diff options
author | Hakim El Hattab | 2012-08-08 01:14:12 -0400 |
---|---|---|
committer | Hakim El Hattab | 2012-08-08 01:14:12 -0400 |
commit | 25ad8adc68600ba9e77cbd7255a104c004126e21 (patch) | |
tree | 236477a30dbb8b39b52ad9a0d8db05cb38c907bf /css/main.css | |
parent | 1efca069cb99cd446ddec9b9d144fa6ddb6de1f1 (diff) |
themes are now available as separate css files under css/theme/, old theme option in config is no longer supported (closes #104)
Diffstat (limited to 'css/main.css')
-rw-r--r-- | css/main.css | 243 |
1 files changed, 49 insertions, 194 deletions
diff --git a/css/main.css b/css/main.css index cae560f..c846c37 100644 --- a/css/main.css +++ b/css/main.css @@ -10,21 +10,33 @@ /********************************************* - * FONT-FACE DEFINITIONS + * RESET STYLES *********************************************/ -@font-face { - font-family: 'League Gothic'; - src: url('../lib/font/league_gothic-webfont.eot'); - src: url('../lib/font/league_gothic-webfont.eot?#iefix') format('embedded-opentype'), - url('../lib/font/league_gothic-webfont.woff') format('woff'), - url('../lib/font/league_gothic-webfont.ttf') format('truetype'), - url('../lib/font/league_gothic-webfont.svg#LeagueGothicRegular') format('svg'); - font-weight: normal; - font-style: normal; +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} - font-weight: normal; - font-style: normal; +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; } @@ -32,7 +44,8 @@ * GLOBAL STYLES *********************************************/ -html, body { +html, +body { padding: 0; margin: 0; width: 100%; @@ -43,23 +56,7 @@ html, body { body { position: relative; - padding: 0; - margin: 0; - - font-family: 'Lato', Times, 'Times New Roman', serif; - font-size: 36px; - font-weight: 200; - letter-spacing: -0.02em; - color: #eee; - - background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM1NTVhNWYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMWMxZTIwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); - background-color: #2b2b2b; - background: -moz-radial-gradient(center, ellipse cover, rgba(85,90,95,1) 0%, rgba(28,30,32,1) 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(85,90,95,1)), color-stop(100%,rgba(28,30,32,1))); - background: -webkit-radial-gradient(center, ellipse cover, rgba(85,90,95,1) 0%,rgba(28,30,32,1) 100%); - background: -o-radial-gradient(center, ellipse cover, rgba(85,90,95,1) 0%,rgba(28,30,32,1) 100%); - background: -ms-radial-gradient(center, ellipse cover, rgba(85,90,95,1) 0%,rgba(28,30,32,1) 100%); - background: radial-gradient(center, ellipse cover, rgba(85,90,95,1) 0%,rgba(28,30,32,1) 100%); + line-height: 1; } @media screen and (max-width: 900px) { @@ -68,52 +65,21 @@ body { } } +::selection { + background:#FF5E99; + color:#fff; + text-shadow: none; +} + /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4 { - margin: 0 0 20px 0; - - color: #eee; - - font-family: 'League Gothic', Impact, sans-serif; - line-height: 0.9em; - letter-spacing: 0.02em; - - text-transform: uppercase; - text-shadow: 0px 0px 6px rgba(0,0,0,0.2); -} -.reveal h1 { font-size: 3.77em; } +.reveal h1 { font-size: 3.77em; } .reveal h2 { font-size: 2.11em; } .reveal h3 { font-size: 1.55em; } .reveal h4 { font-size: 1em; } -.reveal h1.inverted, -.reveal h2.inverted, -.reveal h3.inverted, -.reveal h4.inverted { - color: #fff; - text-shadow: 0px 0px 2px rgba(0,0,0,0.2); -} - -.reveal h1 { - text-shadow: 0 1px 0 #ccc, - 0 2px 0 #c9c9c9, - 0 3px 0 #bbb, - 0 4px 0 #b9b9b9, - 0 5px 0 #aaa, - 0 6px 1px rgba(0,0,0,.1), - 0 0 5px rgba(0,0,0,.1), - 0 1px 3px rgba(0,0,0,.3), - 0 3px 5px rgba(0,0,0,.2), - 0 5px 10px rgba(0,0,0,.25), - 0 20px 20px rgba(0,0,0,.15); -} - /********************************************* * VIEW FRAGMENTS @@ -188,6 +154,11 @@ body { margin-bottom: 10px; } +.reveal q, +.reveal blockquote { + quotes: none; +} + .reveal blockquote { display: block; position: relative; @@ -206,6 +177,16 @@ body { content: '”'; } +.reveal q { + font-style: italic; +} + .reveal q:before { + content: '“'; + } + .reveal q:after { + content: '”'; + } + .reveal pre { display: block; position: relative; @@ -254,60 +235,6 @@ body { vertical-align: top; } -.reveal q { - font-style: italic; -} - .reveal q:before { - content: '“'; - } - .reveal q:after { - content: '”'; - } - -.reveal a:not(.image) { - color: hsl(185, 85%, 50%); - text-decoration: none; - - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - -ms-transition: color .15s ease; - -o-transition: color .15s ease; - transition: color .15s ease; -} - - .reveal a:not(.image):hover { - color: hsl(185, 85%, 70%); - - text-shadow: none; - border: none; - border-radius: 2px; - } - -.reveal section img { - margin: 30px 0 0 0; - background: rgba(255,255,255,0.12); - border: 4px solid #eee; - - -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); - -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); - box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); - - -webkit-transition: all .2s linear; - -moz-transition: all .2s linear; - -ms-transition: all .2s linear; - -o-transition: all .2s linear; - transition: all .2s linear; -} - - .reveal a:hover img { - background: rgba(255,255,255,0.2); - border-color: #13DAEC; - - -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); - -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); - box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); - } - /********************************************* * CONTROLS @@ -328,13 +255,9 @@ body { font-size: 0.83em; position: absolute; opacity: 0.1; - color: #fff; } .reveal .controls a.enabled { opacity: 0.6; - color: hsl(185, 85%, 70%); - - text-shadow: 0px 0px 2px hsla(185, 45%, 70%, 0.3); } .reveal .controls a.enabled:active { margin-top: 1px; @@ -356,7 +279,6 @@ body { .reveal .controls .down { left: 30px; top: 60px; - } @@ -371,13 +293,10 @@ body { width: 100%; bottom: 0; left: 0; - - background: rgba(0,0,0,0.2); } .reveal .progress span { display: block; - background: hsl(185, 85%, 50%); height: 100%; width: 0px; @@ -455,9 +374,6 @@ body { top: 0; padding: 0 2px; - color: #fff; - background: hsl(185, 60%, 35%); - -webkit-transform-origin: 50% 0%; -moz-transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; @@ -983,64 +899,3 @@ body { display: none; } - -/********************************************* - * NEON THEME - *********************************************/ - -.theme-neon .reveal a, -.theme-neon .reveal a:hover, -.theme-neon .reveal .controls a.enabled { - color: #5de048; -} - -.theme-neon .reveal .progress span, -.theme-neon .reveal .roll span:after { - background: #5de048; -} - -.theme-neon .reveal a.image:hover img { - border-color: #5de048; -} - - -/********************************************* - * BEIGE THEME - *********************************************/ - -.theme-beige body { - color: #333; - - background: #f7f3de; - background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(247,242,211,1) 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(247,242,211,1))); - background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%); - background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%); - background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%); - background: radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%); -} - -.theme-beige .reveal h1, -.theme-beige .reveal h2, -.theme-beige .reveal h3, -.theme-beige .reveal h4, -.theme-beige .reveal h5, -.theme-beige .reveal h6 { - color: #333; - text-shadow: none; -} - -.theme-beige .reveal a, -.theme-beige .reveal a:hover, -.theme-beige .reveal .controls a.enabled { - color: #8b743d; -} - -.theme-beige .reveal .progress span, -.theme-beige .reveal .roll span:after { - background: #8b743d; -} - -.theme-beige .reveal a.image:hover img { - border-color: #8b743d; -} |