Make body flex layout and style footer

This commit is contained in:
thePR0M3TH3AN
2025-07-10 13:47:06 -04:00
parent 79edcf396b
commit a4bb430824

View File

@@ -14,6 +14,9 @@ body {
background: var(--bg-color); background: var(--bg-color);
color: var(--text-color); color: var(--text-color);
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
min-height: 100vh;
} }
.header { .header {
display: flex; display: flex;
@@ -53,11 +56,12 @@ body {
.logo { text-decoration: none; color: var(--text-color); font-weight: bold; } .logo { text-decoration: none; color: var(--text-color); font-weight: bold; }
.sidebar-toggle, .sidebar-toggle,
.theme-toggle { background: none; border: none; font-size: 1.2rem; margin-right: 1rem; cursor: pointer; } .theme-toggle { background: none; border: none; font-size: 1.2rem; margin-right: 1rem; cursor: pointer; }
.container { display: flex; } .container { display: flex; flex: 1; }
.sidebar { .sidebar {
width: var(--sidebar-width); width: var(--sidebar-width);
background: var(--sidebar-bg); background: var(--sidebar-bg);
padding: 1rem; padding: 1rem;
box-sizing: border-box;
} }
.sidebar ul { list-style: none; padding: 0; margin: 0; } .sidebar ul { list-style: none; padding: 0; margin: 0; }
.sidebar li { margin: 0.25rem 0; } .sidebar li { margin: 0.25rem 0; }
@@ -65,9 +69,14 @@ body {
.sidebar ul ul { padding-left: 1rem; margin-left: 0.5rem; border-left: 2px solid #ccc; } .sidebar ul ul { padding-left: 1rem; margin-left: 0.5rem; border-left: 2px solid #ccc; }
main { main {
flex: 1; flex: 1;
padding: 1rem; padding: 2rem;
} }
.breadcrumbs a { color: var(--text-color); text-decoration: none; } .breadcrumbs a { color: var(--text-color); text-decoration: none; }
.footer {
text-align: center;
padding: 1rem;
background: var(--sidebar-bg);
}
@media (max-width: 768px) { @media (max-width: 768px) {
.sidebar { .sidebar {
position: fixed; position: fixed;