You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

277 lines
3.1 KiB

  1. /* Copyright 2013 Michael Bostock. All rights reserved. Do not copy. */
  2. @import url(https://fonts.googleapis.com/css?family=PT+Serif|PT+Serif:b|PT+Serif:i|PT+Sans|PT+Sans:b);
  3. .ocks-org body {
  4. background: #fcfcfa;
  5. color: #333;
  6. font-family: "PT Serif", serif;
  7. margin: 1em auto 4em auto;
  8. position: relative;
  9. width: 960px;
  10. padding: 1rem;
  11. }
  12. .ocks-org header,
  13. .ocks-org footer,
  14. .ocks-org aside,
  15. .ocks-org h1,
  16. .ocks-org h2,
  17. .ocks-org h3,
  18. .ocks-org h4 {
  19. font-family: "PT Sans", sans-serif;
  20. }
  21. .ocks-org h1,
  22. .ocks-org h2,
  23. .ocks-org h3,
  24. .ocks-org h4 {
  25. color: #000;
  26. }
  27. .ocks-org header,
  28. .ocks-org footer {
  29. color: #636363;
  30. }
  31. h1 {
  32. font-size: 64px;
  33. font-weight: 300;
  34. letter-spacing: -2px;
  35. margin: 0.3em 0 0.1em 0;
  36. }
  37. h2 {
  38. margin-top: 2em;
  39. }
  40. h1,
  41. h2 {
  42. text-rendering: optimizeLegibility;
  43. }
  44. h2 a[name],
  45. h2 a[id] {
  46. color: #ccc;
  47. padding-right: 0.3em;
  48. }
  49. header,
  50. footer {
  51. font-size: small;
  52. }
  53. .ocks-org header aside,
  54. .ocks-org footer aside {
  55. float: left;
  56. margin-right: 0.5em;
  57. }
  58. .ocks-org header aside:after,
  59. .ocks-org footer aside:after {
  60. padding-left: 0.5em;
  61. content: "/";
  62. }
  63. footer {
  64. margin-top: 8em;
  65. }
  66. h1 ~ aside {
  67. font-size: small;
  68. right: 0;
  69. position: absolute;
  70. width: 180px;
  71. }
  72. .attribution {
  73. font-size: small;
  74. margin-bottom: 2em;
  75. }
  76. body > p,
  77. li > p,
  78. div > p {
  79. line-height: 1.5em;
  80. }
  81. body > p,
  82. div > p {
  83. width: 720px;
  84. }
  85. body > blockquote {
  86. width: 640px;
  87. }
  88. blockquote q {
  89. display: block;
  90. font-style: oblique;
  91. }
  92. ul {
  93. padding: 0;
  94. }
  95. li {
  96. width: 690px;
  97. margin-left: 30px;
  98. }
  99. a {
  100. color: steelblue;
  101. }
  102. a:not(:hover) {
  103. text-decoration: none;
  104. }
  105. pre,
  106. code,
  107. textarea {
  108. font-family: "Menlo", monospace;
  109. }
  110. code {
  111. line-height: 1em;
  112. }
  113. textarea {
  114. font-size: 100%;
  115. }
  116. pre {
  117. border-left: solid 2px #ccc;
  118. padding-left: 18px;
  119. margin: 2em 0 2em 0;
  120. }
  121. .html .value,
  122. .javascript .string,
  123. .javascript .regexp {
  124. color: #756bb1;
  125. }
  126. .html .tag,
  127. .css .tag,
  128. .javascript .keyword {
  129. color: #3182bd;
  130. }
  131. .comment {
  132. color: #636363;
  133. }
  134. .html .doctype,
  135. .javascript .number {
  136. color: #31a354;
  137. }
  138. .html .attribute,
  139. .css .attribute,
  140. .javascript .class,
  141. .javascript .special {
  142. color: #e6550d;
  143. }
  144. .album_cover {
  145. width: 179px;
  146. height: 179px;
  147. border: 0px;
  148. margin: 0px;
  149. }
  150. .single_cover {
  151. width: 143px;
  152. height: 143px;
  153. border: 0px;
  154. margin: 0px;
  155. }
  156. svg {
  157. font: 10px sans-serif;
  158. }
  159. .axis path,
  160. .axis line {
  161. fill: none;
  162. stroke: #000;
  163. shape-rendering: crispEdges;
  164. }
  165. sup,
  166. sub {
  167. line-height: 0;
  168. }
  169. q:before {
  170. content: "“";
  171. }
  172. q:after {
  173. content: "”";
  174. }
  175. blockquote q {
  176. line-height: 1.5em;
  177. display: inline;
  178. }
  179. blockquote q:before,
  180. blockquote q:after {
  181. content: "";
  182. }
  183. h3,
  184. h4,
  185. p,
  186. ul {
  187. padding-left: 1.2rem;
  188. }
  189. .banner {
  190. padding: 0;
  191. }
  192. #toc {
  193. margin-top: 0;
  194. }
  195. @media only screen and (max-device-width: 1023px) {
  196. .ocks-org body {
  197. font-size: 72%;
  198. padding: 0.5rem;
  199. }
  200. body > p,
  201. div > p {
  202. width: 90vw !important;
  203. }
  204. li {
  205. width: 82vw;
  206. }
  207. h3,
  208. h4,
  209. p,
  210. ul {
  211. padding-left: .7rem;
  212. width: 90vw;
  213. }
  214. h1 {
  215. font-size: 2rem;
  216. }
  217. pre {
  218. padding-left: 0.5rem;
  219. }
  220. .banner,
  221. h1,
  222. img {
  223. max-width: calc(100vw - 2em);
  224. min-width: calc(100vw - 2em);
  225. }
  226. }