0
0
mirror of https://github.com/neon-mmd/websurfx.git synced 2024-10-18 06:22:53 -04:00

feat: add & change styling for the error-box & the navbar (#185)

This commit is contained in:
neon_arch 2023-08-21 17:28:40 +03:00
parent c4935f202a
commit 6bfdc75365

View File

@ -89,17 +89,71 @@ body {
width: 40rem; width: 40rem;
} }
/* styles for the error box */
.error_box .error_box_toggle_button {
background: var(--foreground-color);
}
.error_box .dropdown_error_box {
position: absolute;
display: none;
flex-direction: column;
background: var(--background-color);
border-radius: 0;
margin-left: 2rem;
min-height: 20rem;
min-width: 22rem;
}
.error_box .dropdown_error_box.show {
display: flex;
}
.error_box .dropdown_error_box .error_item,
.error_box .dropdown_error_box .no_errors {
display: flex;
align-items: center;
color: var(--foreground-color);
letter-spacing: 0.1rem;
padding: 1rem;
font-size: 1.2rem;
}
.error_box .dropdown_error_box .error_item {
justify-content: space-between;
}
.error_box .dropdown_error_box .no_errors {
min-height: 18rem;
justify-content: center;
}
.error_box .dropdown_error_box .error_item:hover {
box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1);
}
.error_box .error_item .severity_color {
width: 1.2rem;
height: 1.2rem;
}
/* styles for the footer and header */ /* styles for the footer and header */
header { header,
background: var(--background-color); footer {
width: 100%; width: 100%;
background: var(--background-color);
display: flex; display: flex;
justify-content: right;
align-items: center;
padding: 1rem; padding: 1rem;
align-items: center;
}
header {
justify-content: space-between;
}
header h1 a {
text-transform: capitalize;
text-decoration: none;
color: var(--foreground-color);
letter-spacing: 0.1rem;
margin-left: 1rem;
} }
header ul, header ul,
@ -142,13 +196,8 @@ footer div {
} }
footer { footer {
background: var(--background-color);
width: 100%;
padding: 1rem;
display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center;
} }
/* Styles for the search page */ /* Styles for the search page */