Refactor: Replace sidebar with horizontal navigation bar

- Remove sidebar and toggle functionality
- Add Bootstrap navbar with dropdown menus
- Move navigation to top between header and content
- Update menu rendering for Bootstrap dropdowns
- Clean up unused files (header.mustache, sidebar.mustache, sidebar.js)
- Add guide link with book icon in footer
- Simplify layout structure
- Remove duplicate code and fix syntax errors
- Add .gitignore for node_modules and other temp files
This commit is contained in:
2025-11-21 14:23:41 +01:00
parent 0f1c7234b8
commit a86809c243
87 changed files with 8369 additions and 1353 deletions

2078
public/assets/css/bootstrap-icons.css vendored Normal file

File diff suppressed because it is too large Load Diff

6
public/assets/css/bootstrap.min.css vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

316
public/assets/css/style.css Normal file
View File

@@ -0,0 +1,316 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
height: 100%;
margin: 0;
padding: 0;
}
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
.main-wrapper {
flex: 1;
display: flex;
position: relative;
}
.content-wrapper {
flex: 1;
display: flex;
overflow: hidden;
}
.sidebar {
width: 250px;
background-color: #f8f9fa;
border-right: 1px solid #dee2e6;
overflow-y: auto; /* Only sidebar scrolls when needed */
flex-shrink: 0;
transition: transform 0.3s ease;
position: relative;
height: 100%;
z-index: 999;
transform: translateX(0);
}
.sidebar.collapsed {
transform: translateX(-250px);
}
.sidebar-toggle {
position: absolute;
top: 15px;
right: 15px;
z-index: 1001;
background: none;
border: none;
cursor: pointer;
transition: all 0.3s ease;
font-size: 20px;
color: #6c757d;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
}
.sidebar-toggle:hover {
color: #0d6efd;
background-color: #f8f9fa;
}
.sidebar-toggle-outer {
position: relative;
z-index: 1001;
background-color: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
margin-right: 10px;
color: white !important;
display: none; /* Hidden by default */
}
.sidebar-toggle-outer:hover {
background-color: rgba(255, 255, 255, 0.3);
color: white !important;
}
.sidebar.collapsed .sidebar-toggle-inner {
right: auto;
left: 15px;
}
.sidebar.collapsed ~ .main-content {
margin-left: 0;
}
body.sidebar-collapsed .sidebar-toggle-outer {
display: block !important;
}
body:not(.sidebar-collapsed) .sidebar-toggle-outer {
display: none !important;
}
/* Override inline styles */
.sidebar-toggle-outer[style*="display: none"] {
display: none !important;
}
body.sidebar-collapsed .sidebar-toggle-outer[style*="display: none"] {
display: block !important;
}
.main-content {
flex: 1;
overflow: hidden; /* Main content container doesn't scroll */
transition: margin-left 0.3s ease;
margin-left: 250px;
height: 100%;
display: flex;
flex-direction: column;
}
.content-inner {
flex: 1;
overflow-y: auto; /* Only content-inner scrolls when needed */
padding: 20px;
}
.folder-toggle {
font-weight: bold;
color: #212529 !important;
cursor: pointer;
display: flex;
align-items: center;
padding: 0.5rem 0.75rem;
background-color: #f8f9fa !important;
margin: 0.125rem 0;
transition: background-color 0.2s ease;
}
.folder-toggle:hover {
background-color: #e9ecef !important;
}
.folder-toggle[aria-expanded=true] {
background-color: #dee2e6 !important;
color: #212529 !important;
font-weight: 600;
}
.folder-toggle .arrow {
margin-right: 8px;
transition: transform 0.2s;
font-size: 0.8em;
}
.folder-toggle[aria-expanded=true] .arrow {
transform: rotate(90deg);
}
.page-link {
color: #495057 !important;
font-weight: 500;
padding: 0.5rem 0.75rem;
padding-left: 2rem;
background-color: #ffffff !important;
margin: 0.125rem 0;
transition: background-color 0.2s ease;
}
.page-link:hover {
color: #212529 !important;
background-color: #f8f9fa !important;
}
.page-link.active {
background-color: rgba(13, 110, 253, 0.1) !important;
color: #0d6efd !important;
font-weight: 600;
}
.file-info {
font-size: 0.9rem;
color: #6c757d;
flex: 1;
min-width: 0; /* Important for text truncation in flexbox */
}
.file-info {
font-size: 0.9rem;
color: #6c757d;
flex: 1;
min-width: 0; /* Important for text truncation in flexbox */
}
.file-info i {
margin-right: 5px;
}
.page-title {
color: #6c757d;
max-width: 250px !important;
display: inline-block !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
vertical-align: middle;
margin-right: 10px;
}
.page-title:hover {
color: #495057;
cursor: default;
}
.file-details {
color: #6c757d;
font-size: 0.85rem;
}
.site-info a {
color: #0d6efd;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.guide-link {
color: white !important;
text-decoration: none;
font-size: 0.9rem;
&:hover {
color: rgba(255, 255, 255, 0.8) !important;
text-decoration: none;
}
i {
font-size: 1rem;
}
}
.site-title-link {
color: white !important;
text-decoration: none;
&:hover {
color: rgba(255, 255, 255, 0.8) !important;
text-decoration: none;
}
h1 {
margin: 0;
transition: color 0.2s ease;
}
}
footer {
margin-top: auto; /* Push footer to bottom */
flex-shrink: 0;
}
.site-info a:hover {
text-decoration: underline;
}
.auto-link {
color: #0d6efd;
text-decoration: none;
border-bottom: 2px dashed #0d6efd;
font-weight: 500;
transition: all 0.2s ease;
}
.auto-link:hover {
color: #0a58ca;
text-decoration: none;
border-bottom-style: solid;
border-bottom-color: #0a58ca;
}
.search-form {
max-width: 300px;
}
.card-title a {
text-decoration: none;
color: inherit;
}
.card-title a:hover {
text-decoration: underline;
}
.folder-disabled {
font-weight: 500;
color: #6c757d !important;
cursor: not-allowed;
display: flex;
align-items: center;
padding: 0.5rem 0.75rem;
background-color: #f8f9fa !important;
margin: 0.125rem 0;
opacity: 0.7;
}
.folder-disabled .arrow {
margin-right: 8px;
font-size: 0.8em;
opacity: 0.6;
}
@media (max-width: 768px) {
.sidebar {
width: 250px;
background-color: #f8f9fa;
border-right: 1px solid #dee2e6;
overflow-y: auto; /* Only sidebar scrolls when needed */
flex-shrink: 0;
transition: transform 0.3s ease;
position: relative;
height: 100%;
z-index: 999;
transform: translateX(0);
}
}

View File

@@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAOJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKJ;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;;;AAOJ;EACI;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;;;AAQI;EACI;;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AAMhB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;;;AAQI;EACI;;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;AADJ;EACI;;;AAMhB;EACI;EACA;;;AAIA;EACI;EACA;;AAEA;EACI;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;;AAIR;EACI;;;AAIA;EACI;EACA;;AAEA;EACI;;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;;AAIR;EACI;IACI","file":"style.css"}