feat(docs): enhance visual hierarchy and contrast

docs/_config.yml

@@ -9,21 +9,26 @@ heading_anchors: true
 back_to_top: true
 back_to_top_text: "Back to top"
 
+# Theme Overrides
+color_scheme: "dark"
+custom_css: true
+custom_css_path: "/assets/css/custom.css"
+
 # Typography and Spacing
-spacing_unit: 1.5
+spacing_unit: 2
 font_size: "16px"
-content_width: "1000px"
+content_width: "900px"
 typographic_spacing: true
 
 # Heading Styles
-heading_spacing: 1.5
-h1_size: "2.5rem"
-h2_size: "2rem"
-h3_size: "1.5rem"
+heading_spacing: 2.5
+h1_size: "3rem"
+h2_size: "2.5rem"
+h3_size: "1.75rem"
 h4_size: "1.25rem"
 
 # Text Styles
-body_line_height: 1.6
+body_line_height: 1.8
 body_font_family: "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"
 mono_font_family: "'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace"
 
@@ -40,8 +45,8 @@ search:
 
 # Code and Content
 enable_copy_code_button: true
-code_block_padding: "1rem"
-code_font_size: "0.9em"
+code_block_padding: "1.5rem"
+code_font_size: "0.95em"
 
 # Callouts for Important Information
 callouts:
@@ -70,8 +75,8 @@ aux_links_new_tab: true
 footer_content: "Licensed under Apache License, Version 2.0."
 
 # Additional Styles
-callouts_opacity: 0.9
-callouts_padding: "1rem"
-table_font_size: "0.9em"
+callouts_opacity: 1
+callouts_padding: "1.5rem"
+table_font_size: "0.95em"
 nav_font_size: "1rem"
-sidebar_width: "300px"
+sidebar_width: "280px"

docs/assets/css/custom.css

@@ -1,96 +1 @@
-/* Typography Enhancements */
-.main-content {
-    font-size: var(--font-size, 16px);
-    line-height: var(--body-line-height, 1.6);
-}
-
-/* Heading Styles */
-.main-content h1 {
-    margin-top: 2em;
-    margin-bottom: 1em;
-    font-weight: 500;
-    letter-spacing: -0.5px;
-}
-
-.main-content h2 {
-    margin-top: 1.5em;
-    margin-bottom: 0.75em;
-    font-weight: 500;
-    border-bottom: 1px solid var(--border-color);
-    padding-bottom: 0.3em;
-}
-
-.main-content h3 {
-    margin-top: 1.2em;
-    margin-bottom: 0.5em;
-    font-weight: 500;
-}
-
-/* Code Blocks */
-.highlight {
-    margin: 1.5em 0;
-    border-radius: 4px;
-}
-
-.highlight pre {
-    padding: var(--code-block-padding, 1rem);
-    font-family: var(--mono-font-family);
-    font-size: var(--code-font-size, 0.9em);
-}
-
-/* Callouts */
-.callout {
-    margin: 1.5em 0;
-    padding: var(--callouts-padding, 1rem);
-    border-radius: 4px;
-    opacity: var(--callouts-opacity, 0.9);
-}
-
-.callout p:last-child {
-    margin-bottom: 0;
-}
-
-/* Lists */
-.main-content ul,
-.main-content ol {
-    margin: 0.8em 0;
-    padding-left: 1.5em;
-}
-
-.main-content li {
-    margin: 0.3em 0;
-}
-
-/* Links */
-.main-content a {
-    text-decoration: none;
-    border-bottom: 1px solid var(--link-color);
-}
-
-.main-content a:hover {
-    border-bottom-width: 2px;
-}
-
-/* Tables */
-.main-content table {
-    margin: 1.5em 0;
-    font-size: var(--table-font-size, 0.9em);
-    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-}
-
-/* Navigation */
-.nav-list .nav-list-item {
-    font-size: var(--nav-font-size, 1rem);
-    margin: 0.3em 0;
-}
-
-/* Search Results */
-.search-result-doc {
-    font-size: 1.1em;
-    margin-bottom: 0.5em;
-}
-
-.search-result-preview {
-    color: var(--text-color);
-    opacity: 0.8;
-} 
+