extra.scss 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431
  1. // NOTE: Please use this file to perform modifications on default style sheets.
  2. //
  3. // You need to install the official Sass CLI tool:
  4. // npm install -g sass
  5. //
  6. // Run this command to regenerate extra.css after you're finished with changes:
  7. // sass --style=compressed extra.scss extra.css
  8. //
  9. // Alternatively you can use online services to regenerate extra.css.
  10. // Default text color for page contents
  11. $default-text-color: hsl(0,0%,30%);
  12. // Page header, footer, table rows, inline codes and definition lists
  13. $header-footer-background-color: hsl(0,0%,95%);
  14. // Page header, footer links and navigation bar background
  15. $header-footer-link-color: hsl(0,0%,40%);
  16. // Doxygen navigation bar links
  17. $navbar-link-color: $header-footer-background-color;
  18. // Page content background color
  19. $content-background-color: hsl(0,0%,100%);
  20. // Bold, italic, h1, h2, ... and table of contents
  21. $heading-color: hsl(0,0%,10%);
  22. // Function, enum and macro definition separator
  23. $def-separator-color: $header-footer-background-color;
  24. // Base color hue
  25. $base-hue: 24;
  26. // Default color used for links
  27. $default-link-color: hsl($base-hue,100%,50%);
  28. // Doxygen navigation bar active tab
  29. $tab-text-color: hsl(0,0%,100%);
  30. $tab-background-color1: $default-link-color;
  31. $tab-background-color2: lighten(adjust-hue($tab-background-color1, 10), 10%);
  32. // Table borders
  33. $default-border-color: $default-link-color;
  34. // Table header
  35. $table-text-color: $tab-text-color;
  36. $table-background-color1: $tab-background-color1;
  37. $table-background-color2: $tab-background-color2;
  38. // Table of contents, data structure index and prototypes
  39. $toc-background-color1: hsl(0,0%,90%);
  40. $toc-background-color2: lighten($toc-background-color1, 5%);
  41. // Function prototype parameters color
  42. $prototype-param-color: darken($default-link-color, 25%);
  43. // Message box color: note, pre, post and invariant
  44. $box-note-color: hsl(103,80%,85%);
  45. // Message box color: warning and attention
  46. $box-warning-color: hsl(34,80%,85%);
  47. // Message box color: deprecated and bug
  48. $box-bug-color: hsl(333,80%,85%);
  49. // Message box color: todo and test
  50. $box-todo-color: hsl(200,80%,85%);
  51. // Message box helper function
  52. @mixin message-box($base-color){
  53. background:linear-gradient(to bottom,lighten($base-color, 5%) 0%,$base-color 100%);
  54. box-shadow:inset 0 0 32px darken($base-color, 5%);
  55. color:darken($base-color, 67%);
  56. border:2px solid desaturate(darken($base-color, 10%), 20%);
  57. }
  58. .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 {
  59. background:none;
  60. text-shadow:none;
  61. }
  62. .sm-dox a span.sub-arrow {
  63. border-color:$navbar-link-color transparent transparent transparent;
  64. }
  65. .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 {
  66. border-color:$default-link-color transparent transparent transparent;
  67. }
  68. .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 {
  69. border-color:transparent transparent transparent $default-link-color;
  70. }
  71. .sm-dox ul a:hover {
  72. background:$header-footer-link-color;
  73. text-shadow:none;
  74. }
  75. .sm-dox ul.sm-nowrap a {
  76. color:$default-text-color;
  77. text-shadow:none;
  78. }
  79. #main-nav,#main-menu,#main-menu a,#main-menu a:visited,#main-menu a:hover,#main-menu li,.memdoc,dl.reflist dd,div.toc li,.ah,span.lineno,span.lineno a,span.lineno a:hover,.note code,.pre code,.post code,.invariant code,.warning code,.attention code,.deprecated code,.bug code,.todo code,.test code,.doxtable code,.markdownTable code {
  80. background:none;
  81. }
  82. #titlearea,.footer,.contents,div.header,.memdoc,table.doxtable td,table.doxtable th,table.markdownTable td,table.markdownTable th,hr,.memSeparator {
  83. border:none;
  84. }
  85. #main-menu a,#main-menu a:visited,#main-menu a:hover,#main-menu li,.reflist dt a.el,.levels span,.directory .levels span {
  86. text-shadow:none;
  87. }
  88. .memdoc,dl.reflist dd {
  89. box-shadow:none;
  90. }
  91. div.headertitle,.note code,.pre code,.post code,.invariant code,.warning code,.attention code,.deprecated code,.bug code,.todo code,.test code,table.doxtable code,table.markdownTable code {
  92. padding:0;
  93. }
  94. #nav-path,.directory .levels,span.lineno {
  95. display:none;
  96. }
  97. html,#titlearea,.footer,tr.even,.directory tr.even,.doxtable tr:nth-child(even),tr.markdownTableBody:nth-child(even),.mdescLeft,.mdescRight,.memItemLeft,.memItemRight,code,.markdownTableRowEven {
  98. background:$header-footer-background-color;
  99. }
  100. body {
  101. color:$default-text-color;
  102. }
  103. h1,h2,h2.groupheader,h3,div.toc h3,h4,h5,h6,strong,em {
  104. color:$heading-color;
  105. border-bottom:none;
  106. }
  107. h1 {
  108. padding-top:0.5em;
  109. font-size:180%;
  110. }
  111. h2 {
  112. padding-top:0.5em;
  113. margin-bottom:0;
  114. font-size:140%;
  115. }
  116. h3 {
  117. padding-top:0.5em;
  118. margin-bottom:0;
  119. font-size:110%;
  120. }
  121. .glfwheader {
  122. font-size:16px;
  123. min-height:64px;
  124. max-width:920px;
  125. padding:0 32px;
  126. margin:0 auto;
  127. display: flex;
  128. flex-direction: row;
  129. flex-wrap: wrap;
  130. justify-content: flex-start;
  131. align-items: center;
  132. align-content: stretch;
  133. }
  134. #glfwhome {
  135. line-height:64px;
  136. padding-right:48px;
  137. color:$header-footer-link-color;
  138. font-size:2.5em;
  139. background:url("https://www.glfw.org/css/arrow.png") no-repeat right;
  140. }
  141. .glfwnavbar {
  142. list-style-type:none;
  143. margin:0 0 0 auto;
  144. float:right;
  145. }
  146. #glfwhome,.glfwnavbar li {
  147. float:left;
  148. }
  149. .glfwnavbar a,.glfwnavbar a:visited {
  150. line-height:64px;
  151. margin-left:2em;
  152. display:block;
  153. color:$header-footer-link-color;
  154. }
  155. .glfwnavbar {
  156. padding-left: 0;
  157. }
  158. #glfwhome,.glfwnavbar a,.glfwnavbar a:visited {
  159. transition:.35s ease;
  160. }
  161. #titlearea,.footer {
  162. color:$header-footer-link-color;
  163. }
  164. address.footer {
  165. text-align:center;
  166. padding:2em;
  167. margin-top:3em;
  168. }
  169. #top {
  170. background:$header-footer-link-color;
  171. }
  172. #main-nav {
  173. max-width:960px;
  174. margin:0 auto;
  175. font-size:13px;
  176. }
  177. #main-menu {
  178. max-width:920px;
  179. margin:0 auto;
  180. font-size:13px;
  181. }
  182. .memtitle {
  183. display:none;
  184. }
  185. .memproto,.memname {
  186. font-weight:bold;
  187. text-shadow:none;
  188. }
  189. #main-menu {
  190. min-height:36px;
  191. display: flex;
  192. flex-direction: row;
  193. flex-wrap: wrap;
  194. justify-content: flex-start;
  195. align-items: center;
  196. align-content: stretch;
  197. }
  198. #main-menu a,#main-menu a:visited,#main-menu a:hover,#main-menu li {
  199. color:$navbar-link-color;
  200. }
  201. #main-menu li ul.sm-nowrap li a {
  202. color:$default-text-color;
  203. }
  204. #main-menu li ul.sm-nowrap li a:hover {
  205. color:$default-link-color;
  206. }
  207. #main-menu > li:last-child {
  208. margin: 0 0 0 auto;
  209. }
  210. .contents {
  211. min-height:590px;
  212. }
  213. div.contents,div.header {
  214. max-width:920px;
  215. margin:0 auto;
  216. padding:0 32px;
  217. background:$content-background-color none;
  218. }
  219. table.doxtable th,table.markdownTable th,dl.reflist dt {
  220. background:linear-gradient(to bottom,$table-background-color2 0%,$table-background-color1 100%);
  221. box-shadow:inset 0 0 32px $table-background-color1;
  222. text-shadow:0 -1px 1px darken($table-background-color1, 15%);
  223. text-align:left;
  224. color:$table-text-color;
  225. }
  226. dl.reflist dt a.el {
  227. color:$default-link-color;
  228. padding:.2em;
  229. border-radius:4px;
  230. background-color:lighten($default-link-color, 40%);
  231. }
  232. div.toc {
  233. float:none;
  234. width:auto;
  235. }
  236. div.toc h3 {
  237. font-size:1.17em;
  238. }
  239. div.toc ul {
  240. padding-left:1.5em;
  241. }
  242. div.toc li {
  243. font-size:1em;
  244. padding-left:0;
  245. list-style-type:disc;
  246. }
  247. div.toc,.memproto,div.qindex,div.ah {
  248. background:linear-gradient(to bottom,$toc-background-color2 0%,$toc-background-color1 100%);
  249. box-shadow:inset 0 0 32px $toc-background-color1;
  250. text-shadow:0 1px 1px lighten($toc-background-color2, 10%);
  251. color:$heading-color;
  252. border:2px solid $toc-background-color1;
  253. border-radius:4px;
  254. }
  255. .paramname {
  256. color:$prototype-param-color;
  257. }
  258. dl.reflist dt {
  259. border:2px solid $default-border-color;
  260. border-top-left-radius:4px;
  261. border-top-right-radius:4px;
  262. border-bottom:none;
  263. }
  264. dl.reflist dd {
  265. border:2px solid $default-border-color;
  266. border-bottom-right-radius:4px;
  267. border-bottom-left-radius:4px;
  268. border-top:none;
  269. }
  270. table.doxtable,table.markdownTable {
  271. border-collapse:inherit;
  272. border-spacing:0;
  273. border:2px solid $default-border-color;
  274. border-radius:4px;
  275. }
  276. 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 {
  277. color:$default-link-color;
  278. text-decoration:none;
  279. }
  280. div.directory {
  281. border-collapse:inherit;
  282. border-spacing:0;
  283. border:2px solid $default-border-color;
  284. border-radius:4px;
  285. }
  286. hr,.memSeparator {
  287. height:2px;
  288. background:linear-gradient(to right,$def-separator-color 0%,darken($def-separator-color, 10%) 50%,$def-separator-color 100%);
  289. }
  290. dl.note,dl.pre,dl.post,dl.invariant {
  291. @include message-box($box-note-color);
  292. }
  293. dl.warning,dl.attention {
  294. @include message-box($box-warning-color);
  295. }
  296. dl.deprecated,dl.bug {
  297. @include message-box($box-bug-color);
  298. }
  299. dl.todo,dl.test {
  300. @include message-box($box-todo-color);
  301. }
  302. dl.note,dl.pre,dl.post,dl.invariant,dl.warning,dl.attention,dl.deprecated,dl.bug,dl.todo,dl.test {
  303. border-radius:4px;
  304. padding:1em;
  305. text-shadow:0 1px 1px hsl(0,0%,100%);
  306. margin:1em 0;
  307. }
  308. .note a,.pre a,.post a,.invariant a,.warning a,.attention a,.deprecated a,.bug a,.todo a,.test a,.note a:visited,.pre a:visited,.post a:visited,.invariant a:visited,.warning a:visited,.attention a:visited,.deprecated a:visited,.bug a:visited,.todo a:visited,.test a:visited {
  309. color:inherit;
  310. }
  311. div.line {
  312. line-height:inherit;
  313. }
  314. div.fragment,pre.fragment {
  315. background:hsl(0,0%,95%);
  316. border-radius:4px;
  317. border:none;
  318. padding:1em;
  319. overflow:auto;
  320. border-left:4px solid hsl(0,0%,80%);
  321. margin:1em 0;
  322. }
  323. .lineno a,.lineno a:visited,.line,pre.fragment {
  324. color:$default-text-color;
  325. }
  326. span.preprocessor,span.comment {
  327. color:hsl(193,100%,30%);
  328. }
  329. a.code,a.code:visited {
  330. color:hsl(18,100%,45%);
  331. }
  332. span.keyword,span.keywordtype,span.keywordflow {
  333. color:darken($default-text-color, 5%);
  334. font-weight:bold;
  335. }
  336. span.stringliteral {
  337. color:hsl(261,100%,30%);
  338. }
  339. code {
  340. padding:.1em;
  341. border-radius:4px;
  342. }