2
0

jazzy.css 7.3 KB

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