Migrate to Sass for Doxygen custom stylesheets

Closes #1759.

(cherry picked from commit 96f9f5c4b9)
This commit is contained in:
Siavash Eliasi 2020-09-03 16:56:43 +04:30 committed by Camilla Löwy
parent bbc4caf04c
commit cb8aee8437
3 changed files with 73 additions and 72 deletions

File diff suppressed because one or more lines are too long

1
docs/extra.css.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["extra.scss"],"names":[],"mappings":"AA8EA,4GACI,gBACA,iBAGJ,yBACC,yDAGD,6HACC,sDAGD,yIACC,sDAGD,mBACI,WA9EuB,KA+EvB,iBAGJ,uBACC,MAzFoB,QA0FjB,iBAGJ,6UACC,gBAGD,mJACC,YAGD,yHACC,iBAGD,sBACC,gBAGD,4LACC,UAGD,yCACC,aAGD,kMACC,WAnHgC,QAsHjC,KACC,MA1HoB,QA6HrB,sDACC,MA/Ge,QAgHf,mBAGD,GACE,iBACA,eAGF,GACE,iBACA,gBACA,eAGF,GACE,iBACA,gBACA,eAGF,YACC,eACA,gBACA,gBACA,eACA,cAEA,aACA,mBACA,eACA,2BACA,mBACA,sBAGD,UACC,iBACA,mBACA,MA/J0B,KAgK1B,gBACA,qEAGD,YACC,qBACA,kBACA,YAGD,yBACC,WAGD,oCACC,iBACA,gBACA,cACA,MAlL0B,KAqL3B,YACC,eAGD,8CACC,qBAGD,mBACC,MA9L0B,KAiM3B,eACC,kBACA,YACA,eAGD,KACC,WAxM0B,KA2M3B,UACC,gBACA,cACA,eAGD,WACC,gBACA,cACA,eAGD,UACI,aAGJ,mBACI,iBACA,iBAGJ,WACC,gBACA,aACA,mBACA,eACA,2BACA,mBACA,sBAGD,mEACC,MA9OgC,QAiPjC,gCACC,MArPoB,QAwPrB,sCACC,MAjOoB,KAoOrB,yBACC,kBAGD,UACC,iBAGD,wBACC,gBACA,cACA,eACA,qBAGD,uDACC,gEACA,+BACA,+BACA,gBACA,MArPgB,KAwPjB,mBACC,MA5PoB,KA6PpB,aACA,kBACA,yBAGD,QACC,WACA,WAGD,WACC,iBAGD,WACC,mBAGD,WACC,cACA,eACA,qBAGD,oCACC,gEACA,kCACA,2BACA,MAlSe,QAmSf,yBACA,kBAGD,WACC,MA3QuB,QA8QxB,cACC,sBACA,2BACA,4BACA,mBAGD,cACC,sBACA,+BACA,8BACA,gBAGD,mCACC,wBACA,iBACA,sBACA,kBAGD,gIACC,MAxToB,KAyTpB,qBAGD,cACC,wBACA,iBACA,sBACA,kBAGD,iBACC,WACA,4EAGD,oCApSC,gEACA,kCACA,cACA,yBAqSD,wBAxSC,gEACA,kCACA,cACA,yBAySD,qBA5SC,gEACA,kCACA,cACA,yBA6SD,gBAhTC,gEACA,kCACA,cACA,yBAiTD,iGACC,kBACA,YACA,2BACA,aAGD,kRACC,cAGD,SACC,oBAGD,0BACC,mBACA,kBACA,YACA,YACA,cACA,2BACA,aAGD,+CACC,MA1YoB,QA6YrB,+BACC,cAGD,sBACC,cAGD,+CACC,cACA,iBAGD,mBACC,cAGD,KACC,aACA","file":"extra.css"}

View File

@ -1,79 +1,79 @@
// NOTE: Please use this file to perform modifications on default style sheets. // NOTE: Please use this file to perform modifications on default style sheets.
// //
// You need to install a few Ruby gems to generate extra.css from this file: // You need to install the official Sass CLI tool:
// gem install less therubyracer // npm install -g sass
// //
// Run this command to regenerate extra.css after you're finished with changes: // Run this command to regenerate extra.css after you're finished with changes:
// lessc --compress extra.less > extra.css // sass --style=compressed extra.scss extra.css
// //
// Alternatively you can use online services to regenerate extra.css. // Alternatively you can use online services to regenerate extra.css.
// Default text color for page contents // Default text color for page contents
@default-text-color: hsl(0,0%,30%); $default-text-color: hsl(0,0%,30%);
// Page header, footer, table rows, inline codes and definition lists // Page header, footer, table rows, inline codes and definition lists
@header-footer-background-color: hsl(0,0%,95%); $header-footer-background-color: hsl(0,0%,95%);
// Page header, footer links and navigation bar background // Page header, footer links and navigation bar background
@header-footer-link-color: hsl(0,0%,40%); $header-footer-link-color: hsl(0,0%,40%);
// Doxygen navigation bar links // Doxygen navigation bar links
@navbar-link-color: @header-footer-background-color; $navbar-link-color: $header-footer-background-color;
// Page content background color // Page content background color
@content-background-color: hsl(0,0%,100%); $content-background-color: hsl(0,0%,100%);
// Bold, italic, h1, h2, ... and table of contents // Bold, italic, h1, h2, ... and table of contents
@heading-color: hsl(0,0%,10%); $heading-color: hsl(0,0%,10%);
// Function, enum and macro definition separator // Function, enum and macro definition separator
@def-separator-color: @header-footer-background-color; $def-separator-color: $header-footer-background-color;
// Base color hue // Base color hue
@base-hue: 24; $base-hue: 24;
// Default color used for links // Default color used for links
@default-link-color: hsl(@base-hue,100%,50%); $default-link-color: hsl($base-hue,100%,50%);
// Doxygen navigation bar active tab // Doxygen navigation bar active tab
@tab-text-color: hsl(0,0%,100%); $tab-text-color: hsl(0,0%,100%);
@tab-background-color1: @default-link-color; $tab-background-color1: $default-link-color;
@tab-background-color2: lighten(spin(@tab-background-color1, 10), 10%); $tab-background-color2: lighten(adjust-hue($tab-background-color1, 10), 10%);
// Table borders // Table borders
@default-border-color: @default-link-color; $default-border-color: $default-link-color;
// Table header // Table header
@table-text-color: @tab-text-color; $table-text-color: $tab-text-color;
@table-background-color1: @tab-background-color1; $table-background-color1: $tab-background-color1;
@table-background-color2: @tab-background-color2; $table-background-color2: $tab-background-color2;
// Table of contents, data structure index and prototypes // Table of contents, data structure index and prototypes
@toc-background-color1: hsl(0,0%,90%); $toc-background-color1: hsl(0,0%,90%);
@toc-background-color2: lighten(@toc-background-color1, 5%); $toc-background-color2: lighten($toc-background-color1, 5%);
// Function prototype parameters color // Function prototype parameters color
@prototype-param-color: darken(@default-link-color, 25%); $prototype-param-color: darken($default-link-color, 25%);
// Message box color: note, pre, post and invariant // Message box color: note, pre, post and invariant
@box-note-color: hsl(103,80%,85%); $box-note-color: hsl(103,80%,85%);
// Message box color: warning and attention // Message box color: warning and attention
@box-warning-color: hsl(34,80%,85%); $box-warning-color: hsl(34,80%,85%);
// Message box color: deprecated and bug // Message box color: deprecated and bug
@box-bug-color: hsl(333,80%,85%); $box-bug-color: hsl(333,80%,85%);
// Message box color: todo and test // Message box color: todo and test
@box-todo-color: hsl(200,80%,85%); $box-todo-color: hsl(200,80%,85%);
// Message box helper function // Message box helper function
.message-box(@base-color) { @mixin message-box($base-color){
background:linear-gradient(to bottom,lighten(@base-color, 5%) 0%,@base-color 100%); background:linear-gradient(to bottom,lighten($base-color, 5%) 0%,$base-color 100%);
box-shadow:inset 0 0 32px darken(@base-color, 5%); box-shadow:inset 0 0 32px darken($base-color, 5%);
color:darken(@base-color, 67%); color:darken($base-color, 67%);
border:2px solid desaturate(darken(@base-color, 10%), 20%); border:2px solid desaturate(darken($base-color, 10%), 20%);
} }
.sm-dox,.sm-dox a,.sm-dox a:focus,.sm-dox a:active,.sm-dox a:hover,.sm-dox a.highlighted,.sm-dox ul a:hover { .sm-dox,.sm-dox a,.sm-dox a:focus,.sm-dox a:active,.sm-dox a:hover,.sm-dox a.highlighted,.sm-dox ul a:hover {
@ -82,24 +82,24 @@
} }
.sm-dox a span.sub-arrow { .sm-dox a span.sub-arrow {
border-color:@navbar-link-color transparent transparent transparent; border-color:$navbar-link-color transparent transparent transparent;
} }
.sm-dox a span.sub-arrow:active,.sm-dox a span.sub-arrow:focus,.sm-dox a span.sub-arrow:hover,.sm-dox a:hover span.sub-arrow { .sm-dox a span.sub-arrow:active,.sm-dox a span.sub-arrow:focus,.sm-dox a span.sub-arrow:hover,.sm-dox a:hover span.sub-arrow {
border-color:@default-link-color transparent transparent transparent; border-color:$default-link-color transparent transparent transparent;
} }
.sm-dox ul a span.sub-arrow:active,.sm-dox ul a span.sub-arrow:focus,.sm-dox ul a span.sub-arrow:hover,.sm-dox ul a:hover span.sub-arrow { .sm-dox ul a span.sub-arrow:active,.sm-dox ul a span.sub-arrow:focus,.sm-dox ul a span.sub-arrow:hover,.sm-dox ul a:hover span.sub-arrow {
border-color:transparent transparent transparent @default-link-color; border-color:transparent transparent transparent $default-link-color;
} }
.sm-dox ul a:hover { .sm-dox ul a:hover {
background:@header-footer-link-color; background:$header-footer-link-color;
text-shadow:none; text-shadow:none;
} }
.sm-dox ul.sm-nowrap a { .sm-dox ul.sm-nowrap a {
color:@default-text-color; color:$default-text-color;
text-shadow:none; text-shadow:none;
} }
@ -128,15 +128,15 @@ div.headertitle,.note code,.pre code,.post code,.invariant code,.warning code,.a
} }
html,#titlearea,.footer,tr.even,.directory tr.even,.doxtable tr:nth-child(even),tr.markdownTableBody:nth-child(even),.mdescLeft,.mdescRight,.memItemLeft,.memItemRight,code,.markdownTableRowEven { html,#titlearea,.footer,tr.even,.directory tr.even,.doxtable tr:nth-child(even),tr.markdownTableBody:nth-child(even),.mdescLeft,.mdescRight,.memItemLeft,.memItemRight,code,.markdownTableRowEven {
background:@header-footer-background-color; background:$header-footer-background-color;
} }
body { body {
color:@default-text-color; color:$default-text-color;
} }
h1,h2,h2.groupheader,h3,div.toc h3,h4,h5,h6,strong,em { h1,h2,h2.groupheader,h3,div.toc h3,h4,h5,h6,strong,em {
color:@heading-color; color:$heading-color;
border-bottom:none; border-bottom:none;
} }
@ -175,7 +175,7 @@ h3 {
#glfwhome { #glfwhome {
line-height:64px; line-height:64px;
padding-right:48px; padding-right:48px;
color:@header-footer-link-color; color:$header-footer-link-color;
font-size:2.5em; font-size:2.5em;
background:url("https://www.glfw.org/css/arrow.png") no-repeat right; background:url("https://www.glfw.org/css/arrow.png") no-repeat right;
} }
@ -194,7 +194,7 @@ h3 {
line-height:64px; line-height:64px;
margin-left:2em; margin-left:2em;
display:block; display:block;
color:@header-footer-link-color; color:$header-footer-link-color;
} }
.glfwnavbar { .glfwnavbar {
@ -206,7 +206,7 @@ h3 {
} }
#titlearea,.footer { #titlearea,.footer {
color:@header-footer-link-color; color:$header-footer-link-color;
} }
address.footer { address.footer {
@ -216,7 +216,7 @@ address.footer {
} }
#top { #top {
background:@header-footer-link-color; background:$header-footer-link-color;
} }
#main-nav { #main-nav {
@ -251,15 +251,15 @@ address.footer {
} }
#main-menu a,#main-menu a:visited,#main-menu a:hover,#main-menu li { #main-menu a,#main-menu a:visited,#main-menu a:hover,#main-menu li {
color:@navbar-link-color; color:$navbar-link-color;
} }
#main-menu li ul.sm-nowrap li a { #main-menu li ul.sm-nowrap li a {
color:@default-text-color; color:$default-text-color;
} }
#main-menu li ul.sm-nowrap li a:hover { #main-menu li ul.sm-nowrap li a:hover {
color:@default-link-color; color:$default-link-color;
} }
#main-menu > li:last-child { #main-menu > li:last-child {
@ -274,22 +274,22 @@ div.contents,div.header {
max-width:920px; max-width:920px;
margin:0 auto; margin:0 auto;
padding:0 32px; padding:0 32px;
background:@content-background-color none; background:$content-background-color none;
} }
table.doxtable th,table.markdownTable th,dl.reflist dt { table.doxtable th,table.markdownTable th,dl.reflist dt {
background:linear-gradient(to bottom,@table-background-color2 0%,@table-background-color1 100%); background:linear-gradient(to bottom,$table-background-color2 0%,$table-background-color1 100%);
box-shadow:inset 0 0 32px @table-background-color1; box-shadow:inset 0 0 32px $table-background-color1;
text-shadow:0 -1px 1px darken(@table-background-color1, 15%); text-shadow:0 -1px 1px darken($table-background-color1, 15%);
text-align:left; text-align:left;
color:@table-text-color; color:$table-text-color;
} }
dl.reflist dt a.el { dl.reflist dt a.el {
color:@default-link-color; color:$default-link-color;
padding:.2em; padding:.2em;
border-radius:4px; border-radius:4px;
background-color:lighten(@default-link-color, 40%); background-color:lighten($default-link-color, 40%);
} }
div.toc { div.toc {
@ -312,27 +312,27 @@ div.toc li {
} }
div.toc,.memproto,div.qindex,div.ah { div.toc,.memproto,div.qindex,div.ah {
background:linear-gradient(to bottom,@toc-background-color2 0%,@toc-background-color1 100%); background:linear-gradient(to bottom,$toc-background-color2 0%,$toc-background-color1 100%);
box-shadow:inset 0 0 32px @toc-background-color1; box-shadow:inset 0 0 32px $toc-background-color1;
text-shadow:0 1px 1px lighten(@toc-background-color2, 10%); text-shadow:0 1px 1px lighten($toc-background-color2, 10%);
color:@heading-color; color:$heading-color;
border:2px solid @toc-background-color1; border:2px solid $toc-background-color1;
border-radius:4px; border-radius:4px;
} }
.paramname { .paramname {
color:@prototype-param-color; color:$prototype-param-color;
} }
dl.reflist dt { dl.reflist dt {
border:2px solid @default-border-color; border:2px solid $default-border-color;
border-top-left-radius:4px; border-top-left-radius:4px;
border-top-right-radius:4px; border-top-right-radius:4px;
border-bottom:none; border-bottom:none;
} }
dl.reflist dd { dl.reflist dd {
border:2px solid @default-border-color; border:2px solid $default-border-color;
border-bottom-right-radius:4px; border-bottom-right-radius:4px;
border-bottom-left-radius:4px; border-bottom-left-radius:4px;
border-top:none; border-top:none;
@ -341,41 +341,41 @@ dl.reflist dd {
table.doxtable,table.markdownTable { table.doxtable,table.markdownTable {
border-collapse:inherit; border-collapse:inherit;
border-spacing:0; border-spacing:0;
border:2px solid @default-border-color; border:2px solid $default-border-color;
border-radius:4px; border-radius:4px;
} }
a,a:hover,a:visited,a:visited:hover,.contents a:visited,.el,a.el:visited,#glfwhome:hover,#main-menu a:hover,span.lineno a:hover { a,a:hover,a:visited,a:visited:hover,.contents a:visited,.el,a.el:visited,#glfwhome:hover,#main-menu a:hover,span.lineno a:hover {
color:@default-link-color; color:$default-link-color;
text-decoration:none; text-decoration:none;
} }
div.directory { div.directory {
border-collapse:inherit; border-collapse:inherit;
border-spacing:0; border-spacing:0;
border:2px solid @default-border-color; border:2px solid $default-border-color;
border-radius:4px; border-radius:4px;
} }
hr,.memSeparator { hr,.memSeparator {
height:2px; height:2px;
background:linear-gradient(to right,@def-separator-color 0%,darken(@def-separator-color, 10%) 50%,@def-separator-color 100%); background:linear-gradient(to right,$def-separator-color 0%,darken($def-separator-color, 10%) 50%,$def-separator-color 100%);
} }
dl.note,dl.pre,dl.post,dl.invariant { dl.note,dl.pre,dl.post,dl.invariant {
.message-box(@box-note-color); @include message-box($box-note-color);
} }
dl.warning,dl.attention { dl.warning,dl.attention {
.message-box(@box-warning-color); @include message-box($box-warning-color);
} }
dl.deprecated,dl.bug { dl.deprecated,dl.bug {
.message-box(@box-bug-color); @include message-box($box-bug-color);
} }
dl.todo,dl.test { dl.todo,dl.test {
.message-box(@box-todo-color); @include message-box($box-todo-color);
} }
dl.note,dl.pre,dl.post,dl.invariant,dl.warning,dl.attention,dl.deprecated,dl.bug,dl.todo,dl.test { dl.note,dl.pre,dl.post,dl.invariant,dl.warning,dl.attention,dl.deprecated,dl.bug,dl.todo,dl.test {
@ -404,7 +404,7 @@ div.fragment,pre.fragment {
} }
.lineno a,.lineno a:visited,.line,pre.fragment { .lineno a,.lineno a:visited,.line,pre.fragment {
color:@default-text-color; color:$default-text-color;
} }
span.preprocessor,span.comment { span.preprocessor,span.comment {
@ -416,7 +416,7 @@ a.code,a.code:visited {
} }
span.keyword,span.keywordtype,span.keywordflow { span.keyword,span.keywordtype,span.keywordflow {
color:darken(@default-text-color, 5%); color:darken($default-text-color, 5%);
font-weight:bold; font-weight:bold;
} }