mirror of
https://github.com/harvard-edge/cs249r_book.git
synced 2026-05-07 10:08:50 -05:00
d9bf132b95
- Remove content-visible wrapper from community index.qmd so Quarto generates TOC entries for the four ## sections - Add ul.collapse override in _toc.scss to ensure TOC list is visible - Add explicit .quarto-dark overrides in community.css for opening text, card headings, and body text visibility - Scope dark mode blockquote rule to blockquote:not([class]) to avoid overriding custom spotlight quotes - Add .content p/li dark mode color rule in _site-dark.scss - Replace MIT Press SVG placeholder with proper PNG logo - Update community index.qmd to reference mit-press.png - Fix Global Network navbar link to /community/ (remove #outreach anchor) - Update landing _quarto.yml to use shared style-site.scss and site-head.html
125 lines
3.3 KiB
SCSS
125 lines
3.3 KiB
SCSS
// =============================================================================
|
|
// TABLE OF CONTENTS — Right-side TOC with accent line and typography hierarchy
|
|
// =============================================================================
|
|
|
|
// Right TOC - Clean typography-focused approach with accent line
|
|
.table-of-contents,
|
|
#TOC,
|
|
.quarto-toc,
|
|
nav[role="doc-toc"] {
|
|
font-size: 0.85rem;
|
|
line-height: 1.6;
|
|
border-left: 3px solid $accent; // Keep the solid accent line
|
|
padding-left: 1.5rem; // Good spacing from line to text
|
|
margin-left: 0.5rem; // Additional breathing room
|
|
|
|
// Ensure TOC list is visible (Bootstrap collapse hides it by default)
|
|
ul.collapse {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
// Ensure header elements don't get extra bars
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
border-left: none !important;
|
|
padding-left: 0 !important;
|
|
}
|
|
|
|
// Remove grey lines from TOC title and containers
|
|
.toc-title,
|
|
.sidebar-title,
|
|
.quarto-toc-title,
|
|
>div,
|
|
>ul,
|
|
li,
|
|
hr,
|
|
.separator,
|
|
.divider {
|
|
border-top: none !important;
|
|
border-bottom: none !important;
|
|
border-right: none !important;
|
|
}
|
|
|
|
// Also remove any box shadows that might look like lines
|
|
* {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
// All links - readable but secondary to main content
|
|
a,
|
|
.nav-link {
|
|
color: #495057; // Readable but not competing with main content
|
|
font-weight: 400; // Normal weight - supportive navigation
|
|
text-decoration: none;
|
|
display: block;
|
|
padding: 0.2rem 0; // Slightly more padding
|
|
transition: all 0.15s ease;
|
|
border: none !important;
|
|
border-left: none !important;
|
|
border-right: none !important;
|
|
border-top: none !important;
|
|
border-bottom: none !important;
|
|
box-shadow: none !important;
|
|
|
|
&:hover {
|
|
color: $accent; // Accent hover for interaction
|
|
font-weight: 500; // Medium weight on hover
|
|
}
|
|
}
|
|
|
|
// Main sections (H2) - clear but not overpowering
|
|
>ul>li {
|
|
margin-bottom: 0.25rem; // Tighter spacing for better density
|
|
|
|
>a {
|
|
font-weight: 500; // Medium weight - clear hierarchy
|
|
color: #2c3e50; // Dark but balanced
|
|
font-size: 0.9rem; // Appropriate size
|
|
margin-bottom: 0.15rem; // Reduced spacing
|
|
letter-spacing: 0.01em; // Subtle spacing
|
|
}
|
|
}
|
|
|
|
// Sub-sections (H3) - supportive weight
|
|
ul ul {
|
|
margin-left: 0.75rem;
|
|
margin-top: 0.15rem; // Reduced top margin
|
|
|
|
li {
|
|
margin-bottom: 0.1rem; // Tighter item spacing
|
|
}
|
|
|
|
a {
|
|
font-size: 0.8rem; // Appropriate size
|
|
color: #6c757d; // Lighter but readable
|
|
font-weight: 400; // Normal weight
|
|
padding: 0.05rem 0; // Reduced vertical padding
|
|
}
|
|
|
|
// Deep nesting (H4+) - subtle but readable
|
|
ul a {
|
|
font-size: 0.75rem;
|
|
color: #8e959c; // Light but still readable
|
|
font-weight: 400; // Normal weight
|
|
}
|
|
}
|
|
|
|
// Active section - clear but balanced accent highlight
|
|
.active,
|
|
.nav-link.active {
|
|
color: $accent !important;
|
|
font-weight: 500 !important; // Medium weight for active state
|
|
border: none !important;
|
|
border-left: none !important;
|
|
border-right: none !important;
|
|
border-top: none !important;
|
|
border-bottom: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
}
|