11/*
2- * "Darkfish" Rdoc CSS
3- * $Id: rdoc.css 54 2009-01-27 01:09:48Z deveiant $
2+ * RoRvsWild Theme – Rdoc CSS
43 *
5- * Author: Michael Granger <[email protected] > 4+ * Authors: Antoine Marguerie & Alexis Bernard (rorvswild.com)
65 *
76 */
87
9- /* vim: ft=css et sw=2 ts=2 sts=2 */
10- /* Base Green is: #6C8C22 */
11-
12- /* 1. Variables and Root Styles */
138: root {
149 --sidebar-width : 240px ;
15-
10+
1611 --color-primary : oklch (0.5 0.18 29 );
1712 --color-primary-hover : oklch (0.4 0.18 29 );
18-
1913 --color-strong-background : oklch (0.97 0.03 59 );
20-
2114 --color-topbar : var (--color-primary );
2215 --color-topbar-text : var (--color-background );
23-
2416 --color-text : oklch (0.4 0.03 269 );
2517 --color-text-light : oklch (0.5 0.03 269 );
2618 --color-title : oklch (0.27 0.03 269 );
2921 --color-th-background : oklch (0.95 0.002 269 );
3022 --color-border : oklch (0.91 0.002 269 );
3123
32- /* fonts */
3324 --font-sans : "Inter" , system-ui, sans-serif;
3425 --font-mono : "Monaspace" , ui-monospace, 'Cascadia Code' , 'Source Code Pro' , Menlo, Consolas, 'DejaVu Sans Mono' , monospace;
3526}
@@ -42,24 +33,19 @@ html {
4233 font-optical-sizing : auto;
4334 scroll-padding-top : calc (40px + 1em );
4435 scroll-behavior : smooth;
45- font-feature-settings : 'liga' 1 , 'calt' 1 ; /* fix for Chrome */
36+ font-feature-settings : 'liga' 1 , 'calt' 1 ;
4637}
4738
48- /* 2. Global Styles */
4939body {
5040 background : var (--color-background );
5141 font-family : var (--font-sans );
52-
53- /* Layout */
5442 display : flex;
5543 flex-direction : column;
5644 min-height : 100vh ;
5745 margin : 0 ;
5846 padding-top : 35px ;
5947}
6048
61- /* 3. Typography */
62-
6349h1 span ,
6450h2 span ,
6551h3 span ,
@@ -90,7 +76,6 @@ h6:hover span {
9076 display : inline;
9177}
9278
93- /* 4. Links */
9479: any-link {
9580 color : var (--color-primary );
9681 text-decoration : underline;
@@ -100,7 +85,6 @@ h6:hover span {
10085
10186: any-link : hover { color : var (--color-primary-hover ); }
10287
103- /* 5. Code and Pre */
10488code ,
10589pre {
10690 font-family : var (--font-mono );
@@ -109,12 +93,11 @@ pre {
10993 border-radius : 6px ;
11094 padding : 16px ;
11195 overflow-x : auto;
112- font-size : 1rem ; /* Increased from 14px */
113- line-height : 1.5 ; /* Slightly increased for better readability with larger font */
114- margin : 1em 0 ; /* Add some vertical margin */
96+ font-size : 1rem ;
97+ line-height : 1.5 ;
98+ margin : 1em 0 ;
11599}
116100
117- /* 6. Tables */
118101table {
119102 margin : 0 ;
120103 border-spacing : 0 ;
@@ -126,7 +109,7 @@ table tr th, table tr td {
126109 border : 1px solid var (--color-border );
127110}
128111
129- table tr th { background-color : var (--color-th-background ); /* todo */ }
112+ table tr th { background-color : var (--color-th-background ); }
130113
131114table tr : nth-child (even) td { background-color : var (--color-code-background ); }
132115
189172ol ol { margin : 0 ; }
190173
191174details > summary {
192- list-style : none; /* Remove the default marker */
193- position : relative; /* So that the open/close triangle can position itself absolutely inside */
175+ list-style : none;
176+ position : relative;
194177 display : flex;
195178 width : calc (100% - 0.25rem );
196179 gap : 4px ;
@@ -225,7 +208,6 @@ details > summary::after {
225208
226209details [open ] > summary ::after { content : '-' ; }
227210
228- /* Main Content */
229211main {
230212 padding : 1em ;
231213 width : calc (100% - 2em );
@@ -339,7 +321,6 @@ main header h3 {
339321 font-size : 120% ;
340322}
341323
342- /* Navigation and Sidebar */
343324.topbar {
344325 width : 100% ;
345326 padding : 0.5em 1rem ;
@@ -452,17 +433,13 @@ nav p {
452433 margin : 0.5em 0 0 ;
453434}
454435
455- nav .contextual {
456- display : none
457- }
436+ nav .contextual { display : none }
458437
459438# validator-badges {
460439 margin : 1em 1em 2em ;
461440 font-size : smaller;
462441}
463442
464- /* 9. Search */
465-
466443.search-button {
467444 background-color : var (--color-background );
468445 border : none;
@@ -507,9 +484,7 @@ nav.contextual {
507484 backdrop-filter : blur (4px );
508485}
509486
510- .search-dialog [open ] {
511- display : flex;
512- }
487+ .search-dialog [open ] { display : flex; }
513488
514489.search-dialog form {
515490 overflow : hidden;
@@ -531,9 +506,7 @@ nav.contextual {
531506 padding : 1rem ;
532507}
533508
534- .search-dialog form : has (li ) # search-field-wrapper {
535- box-shadow : 0 1px 0 0 var (--color-border );
536- }
509+ .search-dialog form : has (li ) # search-field-wrapper { box-shadow : 0 1px 0 0 var (--color-border ); }
537510
538511# search-field {
539512 width : 100% ;
@@ -613,39 +586,37 @@ nav.contextual {
613586
614587pre ,
615588code {
616- /* syntax highlighting */
617- --color-constant : oklch (0.5 0.18 269 ); /* Bright blue for constants */
618- --color-keyword : var (--color-primary ); /* Red for keywords */
619- --color-ivar : oklch (0.5 0.18 59 ); /* Orange for instance variables */
620- --color-operator : oklch (0.38 0.18 269 ); /* Dark blue for operators */
621- --color-identifier : var (--color-title ); /* Dark gray for identifiers */
622- --color-node : oklch (0.5 0.18 149 ); /* Green for interpolation */
623- --color-comment : oklch (0.5 0.03 269 ); /* Gray for comments */
624- --color-regexp : oklch (0.5 0.18 299 ); /* purple for regular expressions */
625- --color-value : var (--color-operator ); /* Dark blue for numeric values */
626- --color-string : oklch (0.5 0.18 149 ); /* Green for strings */
589+ --color-constant : oklch (0.5 0.18 269 );
590+ --color-keyword : var (--color-primary );
591+ --color-ivar : oklch (0.5 0.18 59 );
592+ --color-operator : oklch (0.38 0.18 269 );
593+ --color-identifier : var (--color-title );
594+ --color-node : oklch (0.5 0.18 149 );
595+ --color-comment : oklch (0.5 0.03 269 );
596+ --color-regexp : oklch (0.5 0.18 299 );
597+ --color-value : var (--color-operator );
598+ --color-string : oklch (0.5 0.18 149 );
627599}
628600
629601code {
630- background-color : var (--color-code-background ); /* Match pre background */
602+ background-color : var (--color-code-background );
631603 padding : 0em 0.4em ;
632604 border-radius : 3px ;
633605 font-size : 1em ;
634606 line-height : 1em ;
635607 text-transform : initial;
636608}
637609
638- /* 13. Syntax Highlighting */
639- .ruby-constant { color : var (--color-constant ); } /* Bright blue for constants */
640- .ruby-keyword { color : var (--color-keyword ); } /* Red for keywords */
641- .ruby-ivar { color : var (--color-ivar ); } /* Orange for instance variables */
642- .ruby-operator { color : var (--color-operator ); } /* Dark blue for operators */
643- .ruby-identifier { color : var (--color-identifier ); } /* Dark gray for identifiers */
644- .ruby-node { color : var (--color-node ); } /* Green for interpolation */
645- .ruby-comment { color : var (--color-comment ); } /* Gray for comments */
646- .ruby-regexp { color : var (--color-regexp ); } /* Navy for regular expressions */
647- .ruby-value { color : var (--color-value ); } /* Dark blue for numeric values */
648- .ruby-string { color : var (--color-string ); } /* Green for strings */
610+ .ruby-constant { color : var (--color-constant ); }
611+ .ruby-keyword { color : var (--color-keyword ); }
612+ .ruby-ivar { color : var (--color-ivar ); }
613+ .ruby-operator { color : var (--color-operator ); }
614+ .ruby-identifier { color : var (--color-identifier ); }
615+ .ruby-node { color : var (--color-node ); }
616+ .ruby-comment { color : var (--color-comment ); }
617+ .ruby-regexp { color : var (--color-regexp ); }
618+ .ruby-value { color : var (--color-value ); }
619+ .ruby-string { color : var (--color-string ); }
649620
650621em {
651622 text-decoration-color : var (--color-border );
658629 background-color : var (--color-strong-background );
659630}
660631
661- /* 14. Specific Component Styles */
662-
663632.note-list {
664633 padding : 1em 1em 2em ;
665634 box-shadow : 0 0 0 1px var (--color-border ) inset;
738707 color : var (--color-title );
739708}
740709
741- pre + .toggle-source {
742- margin-top : 0.5rem ;
743- }
710+ pre + .toggle-source { margin-top : 0.5rem ; }
744711
745712.method-description ,
746713.aliases {
@@ -768,8 +735,6 @@ pre + .toggle-source {
768735 padding : 0 1em ;
769736}
770737
771- /* 11. Media Queries */
772-
773738@media (max-width : 480px ) {
774739 main {
775740 margin : 1em auto;
@@ -862,15 +827,15 @@ pre + .toggle-source {
862827
863828 pre ,
864829 code {
865- --color-constant : oklch (0.84 0.09 260 ); /* Bright blue for constants */
866- --color-keyword : var (--color-primary ); /* Red for keywords */
867- --color-ivar : oklch (0.85 0.09 59 ); /* Orange for instance variables */
868- --color-operator : oklch (0.91 0.04 269 ); /* Dark blue for operators */
869- --color-identifier : var (--color-title ); /* Dark gray for identifiers */
870- --color-node : oklch (0.83 0.09 149 ); /* Green for interpolation */
871- --color-comment : oklch (0.69 0.02 269 ); /* Gray for comments */
872- --color-regexp : oklch (0.85 0.09 299 ); /* purple for regular expressions */
873- --color-value : var (--color-operator ); /* Dark blue for numeric values */
874- --color-string : oklch (0.83 0.09 149 ); /* Green for strings */
830+ --color-constant : oklch (0.84 0.09 260 );
831+ --color-keyword : var (--color-primary );
832+ --color-ivar : oklch (0.85 0.09 59 );
833+ --color-operator : oklch (0.91 0.04 269 );
834+ --color-identifier : var (--color-title );
835+ --color-node : oklch (0.83 0.09 149 );
836+ --color-comment : oklch (0.69 0.02 269 );
837+ --color-regexp : oklch (0.85 0.09 299 );
838+ --color-value : var (--color-operator );
839+ --color-string : oklch (0.83 0.09 149 );
875840 }
876841}
0 commit comments