jazzy.css 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
  1. /*! Jazzy - https://github.com/realm/jazzy
  2. * Copyright Realm Inc.
  3. * SPDX-License-Identifier: MIT
  4. */
  5. *, *:before, *:after {
  6. box-sizing: inherit; }
  7. body {
  8. margin: 0;
  9. background: #fff;
  10. color: #333;
  11. font: 16px/1.7 "Helvetica Neue", Helvetica, Arial, sans-serif;
  12. letter-spacing: .2px;
  13. -webkit-font-smoothing: antialiased;
  14. box-sizing: border-box; }
  15. h1 {
  16. font-size: 2rem;
  17. font-weight: 700;
  18. margin: 1.275em 0 0.6em; }
  19. h2 {
  20. font-size: 1.75rem;
  21. font-weight: 700;
  22. margin: 1.275em 0 0.3em; }
  23. h3 {
  24. font-size: 1.5rem;
  25. font-weight: 700;
  26. margin: 1em 0 0.3em; }
  27. h4 {
  28. font-size: 1.25rem;
  29. font-weight: 700;
  30. margin: 1.275em 0 0.85em; }
  31. h5 {
  32. font-size: 1rem;
  33. font-weight: 700;
  34. margin: 1.275em 0 0.85em; }
  35. h6 {
  36. font-size: 1rem;
  37. font-weight: 700;
  38. margin: 1.275em 0 0.85em;
  39. color: #777; }
  40. p {
  41. margin: 0 0 1em; }
  42. ul, ol {
  43. padding: 0 0 0 2em;
  44. margin: 0 0 0.85em; }
  45. blockquote {
  46. margin: 0 0 0.85em;
  47. padding: 0 15px;
  48. color: #858585;
  49. border-left: 4px solid #e5e5e5; }
  50. img {
  51. max-width: 100%; }
  52. a {
  53. color: #4183c4;
  54. text-decoration: none; }
  55. a:hover, a:focus {
  56. outline: 0;
  57. text-decoration: underline; }
  58. a.discouraged {
  59. text-decoration: line-through; }
  60. a.discouraged:hover, a.discouraged:focus {
  61. text-decoration: underline line-through; }
  62. table {
  63. background: #fff;
  64. width: 100%;
  65. border-collapse: collapse;
  66. border-spacing: 0;
  67. overflow: auto;
  68. margin: 0 0 0.85em; }
  69. tr:nth-child(2n) {
  70. background-color: #fbfbfb; }
  71. th, td {
  72. padding: 6px 13px;
  73. border: 1px solid #ddd; }
  74. hr {
  75. height: 1px;
  76. border: none;
  77. background-color: #ddd; }
  78. pre {
  79. margin: 0 0 1.275em;
  80. padding: .85em 1em;
  81. overflow: auto;
  82. background: #f7f7f7;
  83. font-size: .85em;
  84. font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; }
  85. code {
  86. font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; }
  87. .item-container p > code, .item-container li > code, .top-matter p > code, .top-matter li > code {
  88. background: #f7f7f7;
  89. padding: .2em; }
  90. .item-container p > code:before, .item-container p > code:after, .item-container li > code:before, .item-container li > code:after, .top-matter p > code:before, .top-matter p > code:after, .top-matter li > code:before, .top-matter li > code:after {
  91. letter-spacing: -.2em;
  92. content: "\00a0"; }
  93. pre code {
  94. padding: 0;
  95. white-space: pre; }
  96. .content-wrapper {
  97. display: flex;
  98. flex-direction: column; }
  99. @media (min-width: 768px) {
  100. .content-wrapper {
  101. flex-direction: row; } }
  102. .header {
  103. display: flex;
  104. padding: 8px;
  105. font-size: 0.875em;
  106. background: #444;
  107. color: #999; }
  108. .header-col {
  109. margin: 0;
  110. padding: 0 8px; }
  111. .header-col--primary {
  112. flex: 1; }
  113. .header-link {
  114. color: #fff; }
  115. .header-icon {
  116. padding-right: 2px;
  117. vertical-align: -3px;
  118. height: 16px; }
  119. .breadcrumbs {
  120. font-size: 0.875em;
  121. padding: 8px 16px;
  122. margin: 0;
  123. background: #fbfbfb;
  124. border-bottom: 1px solid #ddd; }
  125. .carat {
  126. height: 10px;
  127. margin: 0 5px; }
  128. .navigation {
  129. order: 2; }
  130. @media (min-width: 768px) {
  131. .navigation {
  132. order: 1;
  133. width: 25%;
  134. max-width: 300px;
  135. padding-bottom: 64px;
  136. overflow: hidden;
  137. word-wrap: normal;
  138. background: #fbfbfb;
  139. border-right: 1px solid #ddd; } }
  140. .nav-groups {
  141. list-style-type: none;
  142. padding-left: 0; }
  143. .nav-group-name {
  144. border-bottom: 1px solid #ddd;
  145. padding: 8px 0 8px 16px; }
  146. .nav-group-name-link {
  147. color: #333; }
  148. .nav-group-tasks {
  149. margin: 8px 0;
  150. padding: 0 0 0 8px; }
  151. .nav-group-task {
  152. font-size: 1em;
  153. list-style-type: none;
  154. white-space: nowrap; }
  155. .nav-group-task-link {
  156. color: #808080; }
  157. .main-content {
  158. order: 1; }
  159. @media (min-width: 768px) {
  160. .main-content {
  161. order: 2;
  162. flex: 1;
  163. padding-bottom: 60px; } }
  164. .section {
  165. padding: 0 32px;
  166. border-bottom: 1px solid #ddd; }
  167. .section-content {
  168. max-width: 834px;
  169. margin: 0 auto;
  170. padding: 16px 0; }
  171. .section-name {
  172. color: #666;
  173. display: block; }
  174. .section-name p {
  175. margin-bottom: inherit; }
  176. .declaration .highlight {
  177. overflow-x: initial;
  178. padding: 8px 0;
  179. margin: 0;
  180. background-color: transparent;
  181. border: none; }
  182. .task-group-section {
  183. border-top: 1px solid #ddd; }
  184. .task-group {
  185. padding-top: 0px; }
  186. .task-name-container a[name]:before {
  187. content: "";
  188. display: block; }
  189. .section-name-container {
  190. position: relative; }
  191. .section-name-container .section-name-link {
  192. position: absolute;
  193. top: 0;
  194. left: 0;
  195. bottom: 0;
  196. right: 0;
  197. margin-bottom: 0; }
  198. .section-name-container .section-name {
  199. position: relative;
  200. pointer-events: none;
  201. z-index: 1; }
  202. .section-name-container .section-name a {
  203. pointer-events: auto; }
  204. .item-container {
  205. padding: 0; }
  206. .item {
  207. padding-top: 8px;
  208. width: 100%;
  209. list-style-type: none; }
  210. .item a[name]:before {
  211. content: "";
  212. display: block; }
  213. .item .token, .item .direct-link {
  214. display: inline-block;
  215. text-indent: -20px;
  216. padding-left: 3px;
  217. margin-left: 20px;
  218. font-size: 1rem; }
  219. .item .declaration-note {
  220. font-size: .85em;
  221. color: #808080;
  222. font-style: italic; }
  223. .pointer-container {
  224. border-bottom: 1px solid #ddd;
  225. left: -23px;
  226. padding-bottom: 13px;
  227. position: relative;
  228. width: 110%; }
  229. .pointer {
  230. left: 21px;
  231. top: 7px;
  232. display: block;
  233. position: absolute;
  234. width: 12px;
  235. height: 12px;
  236. border-left: 1px solid #ddd;
  237. border-top: 1px solid #ddd;
  238. background: #fff;
  239. transform: rotate(45deg); }
  240. .height-container {
  241. display: none;
  242. position: relative;
  243. width: 100%;
  244. overflow: hidden; }
  245. .height-container .section {
  246. background: #fff;
  247. border: 1px solid #ddd;
  248. border-top-width: 0;
  249. padding-top: 10px;
  250. padding-bottom: 5px;
  251. padding: 8px 16px; }
  252. .aside, .language {
  253. padding: 6px 12px;
  254. margin: 12px 0;
  255. border-left: 5px solid #dddddd;
  256. overflow-y: hidden; }
  257. .aside .aside-title, .language .aside-title {
  258. font-size: 9px;
  259. letter-spacing: 2px;
  260. text-transform: uppercase;
  261. padding-bottom: 0;
  262. margin: 0;
  263. color: #aaa;
  264. -webkit-user-select: none; }
  265. .aside p:last-child, .language p:last-child {
  266. margin-bottom: 0; }
  267. .language {
  268. border-left: 5px solid #cde9f4; }
  269. .language .aside-title {
  270. color: #4183c4; }
  271. .aside-warning, .aside-deprecated, .aside-unavailable {
  272. border-left: 5px solid #ff6666; }
  273. .aside-warning .aside-title, .aside-deprecated .aside-title, .aside-unavailable .aside-title {
  274. color: #ff0000; }
  275. .graybox {
  276. border-collapse: collapse;
  277. width: 100%; }
  278. .graybox p {
  279. margin: 0;
  280. word-break: break-word;
  281. min-width: 50px; }
  282. .graybox td {
  283. border: 1px solid #ddd;
  284. padding: 5px 25px 5px 10px;
  285. vertical-align: middle; }
  286. .graybox tr td:first-of-type {
  287. text-align: right;
  288. padding: 7px;
  289. vertical-align: top;
  290. word-break: normal;
  291. width: 40px; }
  292. .slightly-smaller {
  293. font-size: 0.9em; }
  294. .footer {
  295. padding: 8px 16px;
  296. background: #444;
  297. color: #ddd;
  298. font-size: 0.8em; }
  299. .footer p {
  300. margin: 8px 0; }
  301. .footer a {
  302. color: #fff; }
  303. html.dash .header, html.dash .breadcrumbs, html.dash .navigation {
  304. display: none; }
  305. html.dash .height-container {
  306. display: block; }
  307. form[role=search] input {
  308. font: 16px/1.7 "Helvetica Neue", Helvetica, Arial, sans-serif;
  309. font-size: 14px;
  310. line-height: 24px;
  311. padding: 0 10px;
  312. margin: 0;
  313. border: none;
  314. border-radius: 1em; }
  315. .loading form[role=search] input {
  316. background: white url(../img/spinner.gif) center right 4px no-repeat; }
  317. form[role=search] .tt-menu {
  318. margin: 0;
  319. min-width: 300px;
  320. background: #fbfbfb;
  321. color: #333;
  322. border: 1px solid #ddd; }
  323. form[role=search] .tt-highlight {
  324. font-weight: bold; }
  325. form[role=search] .tt-suggestion {
  326. font: 16px/1.7 "Helvetica Neue", Helvetica, Arial, sans-serif;
  327. padding: 0 8px; }
  328. form[role=search] .tt-suggestion span {
  329. display: table-cell;
  330. white-space: nowrap; }
  331. form[role=search] .tt-suggestion .doc-parent-name {
  332. width: 100%;
  333. text-align: right;
  334. font-weight: normal;
  335. font-size: 0.9em;
  336. padding-left: 16px; }
  337. form[role=search] .tt-suggestion:hover,
  338. form[role=search] .tt-suggestion.tt-cursor {
  339. cursor: pointer;
  340. background-color: #4183c4;
  341. color: #fff; }
  342. form[role=search] .tt-suggestion:hover .doc-parent-name,
  343. form[role=search] .tt-suggestion.tt-cursor .doc-parent-name {
  344. color: #fff; }