PGL/Clyde
PGL/Clyde
3
2
Fork 3
Code Issues 13 Pull Requests Actions Projects 3 Releases 2 Wiki Activity

New file for login's style

Browse Source
This commit is contained in:
Wawilski 2024-03-02 15:52:35 +01:00
parent 7aefc33c7b
commit a45e38b1f6
4 changed files with 83 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/login.html
View File

@ -1,8 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<body> <body>
<div class="logBoxCenterer"> <div class="logBoxCenterer">
<div class='loginBox'> <div class='loginBox'>
<div class="form"> <div class="form">
<h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1> <h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1>
<div class="inputBox"> <div class="inputBox">
@ -20,10 +20,10 @@
<input type="submit" value="Login"> <input type="submit" value="Login">
</div> </div>
</div> </div>
</div>
</div> </div>
</div>
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>
</body> </body>
</html> </html>

77
frontend/src/assets/main.css
View File

@ -2,80 +2,3 @@ body {
background-color: rgb(53, 25, 60); background-color: rgb(53, 25, 60);
margin:0; margin:0;
} }
.logBoxCenterer {
position: absolute;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.loginBox {
background-color: rgb(24,24,24);
position : absolute;
width: 400px;
display:flex;
justify-content: center;
padding: 40px;
border-radius: 20px;
box-shadow:0 5px 25px #000000;
}
.form {
position:relative;
width:100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items:center;
gap: 15px;
}
.inputBox input {
width:100%;
background:rgb(255, 0 255);
border: none;
margin-right: 50px;
padding-left: 10px;
padding-top:10px;
padding-bottom:10px;
outline:none;
border-radius: 4px;
font-size:1.35em;
}
.inputBox p{
position:relative;
z-index: 100;
font-family:sans-serif ;
color:rgb(239,60,168);
transition:0.5;
}
.register{
color:rgb(239,60,168);
width: 100%;
align-items:center;
display:flex;
justify-content: center;
cursor: pointer;
}
input[type = "submit"] {
background-color: rgb(239,60,168);
cursor: pointer;
padding:10px;
font-size:1.35em;
}
input[type = "submit"]:active{
opacity:0.8;
}

77
frontend/src/assets/styleLogin.css Normal file
View File

@ -0,0 +1,77 @@
.logBoxCenterer {
position: absolute;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.loginBox {
background-color: rgb(24,24,24);
position : absolute;
width: 400px;
display:flex;
justify-content: center;
padding: 40px;
border-radius: 20px;
box-shadow:0 5px 25px #000000;
}
.form {
position:relative;
width:100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items:center;
gap: 15px;
}
.inputBox input {
width:100%;
background:rgb(255, 0 255);
border: none;
margin-right: 50px;
padding-left: 10px;
padding-top:10px;
padding-bottom:10px;
outline:none;
border-radius: 4px;
font-size:1.35em;
}
.inputBox p{
position:relative;
z-index: 100;
font-family:sans-serif ;
color:rgb(239,60,168);
transition:0.5;
}
.register{
color:rgb(239,60,168);
width: 100%;
align-items:center;
display:flex;
justify-content: center;
cursor: pointer;
}
input[type = "submit"] {
background-color: rgb(239,60,168);
cursor: pointer;
padding:10px;
font-size:1.35em;
}
input[type = "submit"]:active{
opacity:0.8;
}

2
frontend/src/main.js
View File

@ -1,5 +1,5 @@
import './assets/main.css' import './assets/main.css'
import './assets/styleLogin.css'
import 'vue3-toastify/dist/index.css'; import 'vue3-toastify/dist/index.css';
import { createApp } from 'vue' import { createApp } from 'vue'