custom.css 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269
  1. ---
  2. ---
  3. .book-body {
  4. overflow-y: scroll;
  5. }
  6. .book-body .book-header {
  7. position: fixed;
  8. width: 100%;
  9. }
  10. .book.with-summary .book-body .book-header {
  11. position: fixed;
  12. width: calc(100% - 300px);
  13. }
  14. .book-body .body-inner {
  15. /* position: absolute; */
  16. margin-top: 50px;
  17. min-height: calc(100% - 50px);
  18. }
  19. .book-body .body-inner .page-wrapper {
  20. min-height: calc(100% - 46px);
  21. }
  22. .book-body .body-inner .page-wrapper .page-inner {
  23. padding-bottom: 20px;
  24. }
  25. @media (max-width: 1240px) {
  26. .book-body .body-inner .navigation {
  27. max-width: calc(50% - 3px);
  28. width: calc(50% - 3px);
  29. }
  30. }
  31. .book .book-body .book-header {
  32. background: #ffffff;
  33. }
  34. .book.color-theme-1 .book-body .book-header {
  35. background: #f3eacb;
  36. }
  37. .book.color-theme-2 .book-body .book-header {
  38. background: #1c1f2b;
  39. }
  40. .page-inner {
  41. max-width: {{ site.page_width | default: '900px' }};
  42. }
  43. .back-to-top {
  44. right: calc((100% - 300px - min(100% - 300px, {{ site.page_width | default: '900px' }})) / 2 + 25px);
  45. }
  46. /* scrollbar */
  47. ::-webkit-scrollbar {
  48. width: 5px;
  49. height: 5px;
  50. }
  51. ::-webkit-scrollbar-track-piece {
  52. /* background-color: rgba(125, 125, 125, 0.2); */
  53. -webkit-border-radius: 6px;
  54. }
  55. ::-webkit-scrollbar-thumb:vertical {
  56. height: 5px;
  57. background-color: rgba(7, 17, 27, .2);
  58. -webkit-border-radius: 6px;
  59. }
  60. ::-webkit-scrollbar-thumb:horizontal {
  61. width: 5px;
  62. background-color: rgba(125, 125, 125, 0.2);
  63. -webkit-border-radius: 6px;
  64. }
  65. /* Style for search page on mobile screens */
  66. #book-search-input-link {
  67. padding: 6px;
  68. background: 0 0;
  69. background: inherit;
  70. transition: top .5s ease;
  71. border-bottom: 1px solid rgba(0,0,0,.07);
  72. border-top: 1px solid rgba(0,0,0,.07);
  73. margin-bottom: 10px;
  74. margin-top: -1px;
  75. }
  76. #book-search-input-link a {
  77. width: 100%;
  78. background: 0 0;
  79. border: 1px solid transparent;
  80. box-shadow: none;
  81. outline: 0;
  82. line-height: 38px;
  83. padding: 7px 7px;
  84. color: #757575;
  85. }
  86. #book-search-input {
  87. display: block;
  88. }
  89. #book-search-input-link {
  90. display: none;
  91. }
  92. @media (max-width: 1240px) {
  93. #book-search-input {
  94. display: none;
  95. }
  96. #book-search-input-link {
  97. display: block;
  98. }
  99. }
  100. #book-search-input-inside {
  101. padding: 6px;
  102. background: 0 0;
  103. transition: top .5s ease;
  104. background: #fff;
  105. border-bottom: 1px solid rgba(0,0,0,.07);
  106. border-top: 1px solid rgba(0,0,0,.07);
  107. margin-bottom: 10px;
  108. margin-top: -1px;
  109. }
  110. #book-search-input-inside input {
  111. width: 100%;
  112. background: 0 0;
  113. border: 1px solid transparent;
  114. box-shadow: none;
  115. outline: 0;
  116. line-height: 22px;
  117. padding: 7px 7px;
  118. color: inherit;
  119. }
  120. /* Custom font settings */
  121. .book.font-family-0 {
  122. font-family: Georgia, serif;
  123. }
  124. .book.font-family-1 {
  125. font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  126. }
  127. /* Render wide tables */
  128. .table-wrapper {
  129. overflow-x: scroll;
  130. }
  131. /* Tips, warnings, and dangers */
  132. .markdown-section blockquote.block-tip {
  133. border-color: var(--c-tip);
  134. background-color: var(--c-tip-bg);
  135. color: var(--c-tip-text);
  136. font-family: var(--font-family);
  137. }
  138. .markdown-section blockquote.block-tip h1 {
  139. color: var(--c-tip-title);
  140. }
  141. .markdown-section blockquote.block-tip h2 {
  142. color: var(--c-tip-title);
  143. }
  144. .markdown-section blockquote.block-tip h3 {
  145. color: var(--c-tip-title);
  146. }
  147. .markdown-section blockquote.block-tip h4 {
  148. color: var(--c-tip-title);
  149. }
  150. .markdown-section blockquote.block-tip h5 {
  151. color: var(--c-tip-title);
  152. }
  153. .markdown-section blockquote.block-tip h6 {
  154. color: var(--c-tip-title);
  155. }
  156. .markdown-section blockquote.block-warning {
  157. border-color: var(--c-warning);
  158. background-color: var(--c-warning-bg);
  159. color: var(--c-warning-text);
  160. font-family: var(--font-family);
  161. }
  162. .markdown-section blockquote.block-warning h1 {
  163. color: var(--c-warning-title);
  164. }
  165. .markdown-section blockquote.block-warning h2 {
  166. color: var(--c-warning-title);
  167. }
  168. .markdown-section blockquote.block-warning h3 {
  169. color: var(--c-warning-title);
  170. }
  171. .markdown-section blockquote.block-warning h4 {
  172. color: var(--c-warning-title);
  173. }
  174. .markdown-section blockquote.block-warning h5 {
  175. color: var(--c-warning-title);
  176. }
  177. .markdown-section blockquote.block-warning h6 {
  178. color: var(--c-warning-title);
  179. }
  180. .markdown-section blockquote.block-danger {
  181. border-color: var(--c-danger);
  182. background-color: var(--c-danger-bg);
  183. color: var(--c-danger-text);
  184. font-family: var(--font-family);
  185. }
  186. .markdown-section blockquote.block-danger h1 {
  187. color: var(--c-danger-title);
  188. }
  189. .markdown-section blockquote.block-danger h2 {
  190. color: var(--c-danger-title);
  191. }
  192. .markdown-section blockquote.block-danger h3 {
  193. color: var(--c-danger-title);
  194. }
  195. .markdown-section blockquote.block-danger h4 {
  196. color: var(--c-danger-title);
  197. }
  198. .markdown-section blockquote.block-danger h5 {
  199. color: var(--c-danger-title);
  200. }
  201. .markdown-section blockquote.block-danger h6 {
  202. color: var(--c-danger-title);
  203. }
  204. :root {
  205. --c-tip: #42b983;
  206. --c-tip-bg: #e2f5ec;
  207. --c-tip-text: #215d42;
  208. --c-tip-title: #359469;
  209. --c-warning: #e7c000;
  210. --c-warning-bg: rgba(255, 229, 100, .25);
  211. --c-warning-text: #6b5900;
  212. --c-warning-title: #b29400;
  213. --c-danger: #c00;
  214. --c-danger-bg: #ffe0e0;
  215. --c-danger-text: #600;
  216. --c-danger-title: #c00;
  217. --font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  218. }