142 lines
2.3 KiB
CSS
142 lines
2.3 KiB
CSS
|
|
|
|
.logo{
|
|
height:50px;
|
|
width:auto;
|
|
}
|
|
|
|
.info-part{
|
|
margin-left:15%;
|
|
margin-right:15%;
|
|
}
|
|
|
|
#loginForm{
|
|
display:grid;
|
|
margin-right:30%;
|
|
margin-left:30%;
|
|
gap:5px;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
height: 100vh;
|
|
font-family: 'Arial', sans-serif;
|
|
color: #f1f1f1;
|
|
|
|
overflow: hidden;
|
|
}
|
|
|
|
body::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0; left: 0;
|
|
width: 100%; height: 100%;
|
|
background: url('../../static/img/background.gif') center center / cover no-repeat;
|
|
z-index: -2;
|
|
}
|
|
|
|
body::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0; left: 0;
|
|
width: 100%; height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.85);
|
|
z-index: -1;
|
|
}
|
|
|
|
.wrapper {
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
margin-top:10%;
|
|
margin-bottom:auto;
|
|
background-color: #1a1a1a;
|
|
padding: 30px;
|
|
color:white;
|
|
border-radius: 8px;
|
|
box-shadow: 0 0 20px rgba(0,0,0,0.8);
|
|
width: 800px;
|
|
}
|
|
|
|
h1 {
|
|
text-align: center;
|
|
margin-bottom: 30px;
|
|
font-family: 'Courier New', Courier, monospace;
|
|
letter-spacing: 2px;
|
|
}
|
|
|
|
label {
|
|
font-weight: bold;
|
|
margin-top: 15px;
|
|
}
|
|
|
|
input[type="text"], input[type="password"] {
|
|
width: 100%;
|
|
padding: 10px;
|
|
margin-top: 5px;
|
|
background-color: #0f0f0f;
|
|
border: 1px solid #333;
|
|
border-radius: 4px;
|
|
color: #f1f1f1;
|
|
}
|
|
|
|
input[type="submit"] {
|
|
width: 100%;
|
|
padding: 10px;
|
|
margin-top: 20px;
|
|
background-color: #d32f2f;
|
|
border: none;
|
|
border-radius: 4px;
|
|
color: #fff;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
transition: background-color 0.3s;
|
|
}
|
|
|
|
input[type="submit"]:hover {
|
|
background-color: #a12a2a;
|
|
}
|
|
|
|
.header-bar {
|
|
width: 100%;
|
|
height: 5px;
|
|
background-color: #d32f2f;
|
|
margin-bottom: 20px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.error-message {
|
|
color: #ff4d4d;
|
|
margin-top: 10px;
|
|
font-size: 0.9em;
|
|
text-align: center;
|
|
}
|
|
|
|
.note-listing {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.note-card {
|
|
width: 120px;
|
|
background-color: #2a2a2a;
|
|
border-radius: 8px;
|
|
box-shadow: 0 0 10px rgba(0,0,0,0.6);
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
.note-card:hover {
|
|
transform: translateY(-5px);
|
|
box-shadow: 0 0 15px rgba(211, 47, 47, 0.8);
|
|
}
|
|
|
|
.note-icon {
|
|
width: 50px;
|
|
height: 50px;
|
|
}
|
|
|
|
.note-title {
|
|
font-size: 0.9rem;
|
|
margin-top: 5px;
|
|
word-break: break-word;
|
|
}
|
|
|
|
|