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.

290 lines
5.8KB

  1. /**
  2. * Solarized Light theme for reveal.js.
  3. * Author: Achim Staebler
  4. */
  5. @import url(fonts/league-gothic/league-gothic.css);
  6. @import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
  7. /**
  8. * Solarized colors by Ethan Schoonover
  9. */
  10. html * {
  11. color-profile: sRGB;
  12. rendering-intent: auto; }
  13. /*********************************************
  14. * GLOBAL STYLES
  15. *********************************************/
  16. :root {
  17. --background-color: #fdf6e3;
  18. --main-font: Lato, sans-serif;
  19. --main-font-size: 40px;
  20. --main-color: #657b83;
  21. --block-margin: 20px;
  22. --heading-margin: 0 0 20px 0;
  23. --heading-font: League Gothic, Impact, sans-serif;
  24. --heading-color: #586e75;
  25. --heading-line-height: 1.2;
  26. --heading-letter-spacing: normal;
  27. --heading-text-transform: uppercase;
  28. --heading-text-shadow: none;
  29. --heading-font-weight: normal;
  30. --heading1-text-shadow: none;
  31. --heading1-size: 3.77em;
  32. --heading2-size: 2.11em;
  33. --heading3-size: 1.55em;
  34. --heading4-size: 1em;
  35. --code-font: monospace;
  36. --link-color: #268bd2;
  37. --link-color-hover: #78b9e6;
  38. --selection-background-color: #d33682;
  39. --selection-color: #fff; }
  40. .reveal-viewport {
  41. background: #fdf6e3;
  42. background-color: #fdf6e3; }
  43. .reveal {
  44. font-family: "Lato", sans-serif;
  45. font-size: 40px;
  46. font-weight: normal;
  47. color: #657b83; }
  48. .reveal ::selection {
  49. color: #fff;
  50. background: #d33682;
  51. text-shadow: none; }
  52. .reveal ::-moz-selection {
  53. color: #fff;
  54. background: #d33682;
  55. text-shadow: none; }
  56. .reveal .slides section,
  57. .reveal .slides section > section {
  58. line-height: 1.3;
  59. font-weight: inherit; }
  60. /*********************************************
  61. * HEADERS
  62. *********************************************/
  63. .reveal h1,
  64. .reveal h2,
  65. .reveal h3,
  66. .reveal h4,
  67. .reveal h5,
  68. .reveal h6 {
  69. margin: 0 0 20px 0;
  70. color: #586e75;
  71. font-family: "League Gothic", Impact, sans-serif;
  72. font-weight: normal;
  73. line-height: 1.2;
  74. letter-spacing: normal;
  75. text-transform: uppercase;
  76. text-shadow: none;
  77. word-wrap: break-word; }
  78. .reveal h1 {
  79. font-size: 3.77em; }
  80. .reveal h2 {
  81. font-size: 2.11em; }
  82. .reveal h3 {
  83. font-size: 1.55em; }
  84. .reveal h4 {
  85. font-size: 1em; }
  86. .reveal h1 {
  87. text-shadow: none; }
  88. /*********************************************
  89. * OTHER
  90. *********************************************/
  91. .reveal p {
  92. margin: 20px 0;
  93. line-height: 1.3; }
  94. /* Ensure certain elements are never larger than the slide itself */
  95. .reveal img,
  96. .reveal video,
  97. .reveal iframe {
  98. max-width: 95%;
  99. max-height: 95%; }
  100. .reveal strong,
  101. .reveal b {
  102. font-weight: bold; }
  103. .reveal em {
  104. font-style: italic; }
  105. .reveal ol,
  106. .reveal dl,
  107. .reveal ul {
  108. display: inline-block;
  109. text-align: left;
  110. margin: 0 0 0 1em; }
  111. .reveal ol {
  112. list-style-type: decimal; }
  113. .reveal ul {
  114. list-style-type: disc; }
  115. .reveal ul ul {
  116. list-style-type: square; }
  117. .reveal ul ul ul {
  118. list-style-type: circle; }
  119. .reveal ul ul,
  120. .reveal ul ol,
  121. .reveal ol ol,
  122. .reveal ol ul {
  123. display: block;
  124. margin-left: 40px; }
  125. .reveal dt {
  126. font-weight: bold; }
  127. .reveal dd {
  128. margin-left: 40px; }
  129. .reveal blockquote {
  130. display: block;
  131. position: relative;
  132. width: 70%;
  133. margin: 20px auto;
  134. padding: 5px;
  135. font-style: italic;
  136. background: rgba(255, 255, 255, 0.05);
  137. box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
  138. .reveal blockquote p:first-child,
  139. .reveal blockquote p:last-child {
  140. display: inline-block; }
  141. .reveal q {
  142. font-style: italic; }
  143. .reveal pre {
  144. display: block;
  145. position: relative;
  146. width: 90%;
  147. margin: 20px auto;
  148. text-align: left;
  149. font-size: 0.55em;
  150. font-family: monospace;
  151. line-height: 1.2em;
  152. word-wrap: break-word;
  153. box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
  154. .reveal code {
  155. font-family: monospace;
  156. text-transform: none; }
  157. .reveal pre code {
  158. display: block;
  159. padding: 5px;
  160. overflow: auto;
  161. max-height: 400px;
  162. word-wrap: normal; }
  163. .reveal table {
  164. margin: auto;
  165. border-collapse: collapse;
  166. border-spacing: 0; }
  167. .reveal table th {
  168. font-weight: bold; }
  169. .reveal table th,
  170. .reveal table td {
  171. text-align: left;
  172. padding: 0.2em 0.5em 0.2em 0.5em;
  173. border-bottom: 1px solid; }
  174. .reveal table th[align="center"],
  175. .reveal table td[align="center"] {
  176. text-align: center; }
  177. .reveal table th[align="right"],
  178. .reveal table td[align="right"] {
  179. text-align: right; }
  180. .reveal table tbody tr:last-child th,
  181. .reveal table tbody tr:last-child td {
  182. border-bottom: none; }
  183. .reveal sup {
  184. vertical-align: super;
  185. font-size: smaller; }
  186. .reveal sub {
  187. vertical-align: sub;
  188. font-size: smaller; }
  189. .reveal small {
  190. display: inline-block;
  191. font-size: 0.6em;
  192. line-height: 1.2em;
  193. vertical-align: top; }
  194. .reveal small * {
  195. vertical-align: top; }
  196. .reveal img {
  197. margin: 20px 0; }
  198. /*********************************************
  199. * LINKS
  200. *********************************************/
  201. .reveal a {
  202. color: #268bd2;
  203. text-decoration: none;
  204. transition: color .15s ease; }
  205. .reveal a:hover {
  206. color: #78b9e6;
  207. text-shadow: none;
  208. border: none; }
  209. .reveal .roll span:after {
  210. color: #fff;
  211. background: #1a6091; }
  212. /*********************************************
  213. * Frame helper
  214. *********************************************/
  215. .reveal .r-frame {
  216. border: 4px solid #657b83;
  217. box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
  218. .reveal a .r-frame {
  219. transition: all .15s linear; }
  220. .reveal a:hover .r-frame {
  221. border-color: #268bd2;
  222. box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
  223. /*********************************************
  224. * NAVIGATION CONTROLS
  225. *********************************************/
  226. .reveal .controls {
  227. color: #268bd2; }
  228. /*********************************************
  229. * PROGRESS BAR
  230. *********************************************/
  231. .reveal .progress {
  232. background: rgba(0, 0, 0, 0.2);
  233. color: #268bd2; }
  234. /*********************************************
  235. * PRINT BACKGROUND
  236. *********************************************/
  237. @media print {
  238. .backgrounds {
  239. background-color: #fdf6e3; } }