Clean up CSS to show left navigation sidebar and hide right TOC
This commit is contained in:
Hugh Ratsch
+59
-76
@@ -1,29 +1,70 @@
|
||||
/* Custom styling for IT Learning Notes */
|
||||
|
||||
/* IMPORTANT: Hide the sidebar/TOC completely */
|
||||
html body .sidebar,
|
||||
/* Show the left navigation sidebar but modify styling */
|
||||
.sidebar {
|
||||
background-color: rgba(245, 245, 247, 0.95) !important;
|
||||
border-right: 1px solid #e1e4e8 !important;
|
||||
}
|
||||
|
||||
.sidebar-scrollbox {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
/* Hide the floating right-side table of contents */
|
||||
.page-toc,
|
||||
.pagetoc,
|
||||
.table-of-contents {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
/* Make content take up full width without sidebar */
|
||||
html body .content-wrap,
|
||||
/* Make content take up appropriate width */
|
||||
.content-wrap {
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
max-width: 100% !important;
|
||||
margin-left: auto !important;
|
||||
margin-right: auto !important;
|
||||
max-width: calc(100% - 300px) !important;
|
||||
padding: 0 30px !important;
|
||||
left: 0 !important;
|
||||
}
|
||||
|
||||
/* Right/left navigation buttons */
|
||||
/* Improve chapter navigation */
|
||||
.chapter {
|
||||
line-height: 1.3 !important;
|
||||
font-size: 0.9em !important;
|
||||
}
|
||||
|
||||
.chapter li a {
|
||||
display: block !important;
|
||||
padding: 5px 0 !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
.chapter li a:hover {
|
||||
text-decoration: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.05) !important;
|
||||
}
|
||||
|
||||
.chapter .active {
|
||||
background-color: rgba(0, 0, 0, 0.07) !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
/* Improve nested section visibility */
|
||||
.chapter li.chapter-item {
|
||||
margin-left: 1em !important;
|
||||
}
|
||||
|
||||
.chapter li.chapter-item.expanded {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
/* Navigation buttons */
|
||||
.nav-chapters {
|
||||
min-width: 30px !important;
|
||||
}
|
||||
|
||||
/* Page table of contents styling for in-page TOC */
|
||||
/* In-page TOC styling */
|
||||
.toc {
|
||||
background-color: #f8f9fa;
|
||||
border: 1px solid #eaecef;
|
||||
@@ -140,17 +181,6 @@ th {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
/* Fix for potentially hidden elements */
|
||||
.hidden {
|
||||
display: block !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* Ensure chapters don't disappear */
|
||||
.chapter {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
/* Ensure main menu button is visible */
|
||||
#menu-bar {
|
||||
z-index: 10 !important;
|
||||
@@ -166,70 +196,24 @@ th {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
/* mdBook TOC styling - this targets the actual sidebar TOC */
|
||||
.content-wrap {
|
||||
max-width: calc(100% - 220px) !important;
|
||||
margin-right: 220px !important;
|
||||
}
|
||||
|
||||
.sidebar-scrollbox {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.chapter {
|
||||
line-height: 1.3 !important;
|
||||
font-size: 0.9em !important;
|
||||
}
|
||||
|
||||
.chapter li a {
|
||||
display: block !important;
|
||||
padding: 5px 0 !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
.chapter li a:hover {
|
||||
text-decoration: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.05) !important;
|
||||
}
|
||||
|
||||
.chapter .active {
|
||||
background-color: rgba(0, 0, 0, 0.07) !important;
|
||||
}
|
||||
|
||||
/* Improve nested section visibility */
|
||||
.chapter li.chapter-item {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.chapter li.chapter-item.expanded {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* mdBook theme-specific adjustments */
|
||||
.light .sidebar {
|
||||
background-color: #fafafa !important;
|
||||
border-right: 1px solid #e6e6e6 !important;
|
||||
}
|
||||
|
||||
.navy .sidebar, .coal .sidebar, .ayu .sidebar {
|
||||
/* Dark mode adjustments */
|
||||
.ayu .sidebar,
|
||||
.navy .sidebar,
|
||||
.coal .sidebar {
|
||||
background-color: #292c2f !important;
|
||||
border-right: 1px solid #393f44 !important;
|
||||
}
|
||||
|
||||
/* Responsive adjustments for the sidebar */
|
||||
/* Responsive adjustments */
|
||||
@media only screen and (max-width: 1300px) {
|
||||
.content-wrap {
|
||||
max-width: calc(100% - 200px) !important;
|
||||
margin-right: 200px !important;
|
||||
max-width: calc(100% - 250px) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1080px) {
|
||||
.content-wrap {
|
||||
max-width: calc(100% - 180px) !important;
|
||||
margin-right: 180px !important;
|
||||
max-width: calc(100% - 200px) !important;
|
||||
}
|
||||
|
||||
.chapter {
|
||||
@@ -240,6 +224,5 @@ th {
|
||||
@media only screen and (max-width: 700px) {
|
||||
.content-wrap {
|
||||
max-width: 100% !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user