aboutsummaryrefslogtreecommitdiff
path: root/css
diff options
context:
space:
mode:
authorHakim El Hattab <hakim.elhattab@gmail.com>2014-09-28 12:14:48 +0200
committerHakim El Hattab <hakim.elhattab@gmail.com>2014-09-28 12:14:48 +0200
commitbd176411ef7fa4b584af5deef538ab8f63f43746 (patch)
tree504120ad8d01bfce756ae8f7c5076dd7331d992a /css
parent9ef0060024a428e2bbfa237f2632e2defe4a5ec3 (diff)
downloadfosdem-2018-presentation-bd176411ef7fa4b584af5deef538ab8f63f43746.tar
fosdem-2018-presentation-bd176411ef7fa4b584af5deef538ab8f63f43746.tar.gz
style tweaks for all themes; larger line heights, no default adjustmetn to letter-spacing
Diffstat (limited to 'css')
-rw-r--r--css/theme/beige.css9
-rw-r--r--css/theme/black.css22
-rw-r--r--css/theme/blood.css9
-rw-r--r--css/theme/default.css9
-rw-r--r--css/theme/moon.css11
-rw-r--r--css/theme/night.css9
-rw-r--r--css/theme/serif.css11
-rw-r--r--css/theme/simple.css11
-rw-r--r--css/theme/sky.css9
-rw-r--r--css/theme/solarized.css11
-rw-r--r--css/theme/source/black.scss15
-rw-r--r--css/theme/source/default.scss1
-rw-r--r--css/theme/template/settings.scss11
-rw-r--r--css/theme/template/theme.scss13
14 files changed, 78 insertions, 73 deletions
diff --git a/css/theme/beige.css b/css/theme/beige.css
index 685f490..5e06849 100644
--- a/css/theme/beige.css
+++ b/css/theme/beige.css
@@ -27,7 +27,6 @@ body {
font-family: "Lato", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #333333; }
::selection {
@@ -37,7 +36,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -52,8 +51,8 @@ body {
margin: 0 0 20px 0;
color: #333333;
font-family: "League Gothic", Impact, sans-serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: uppercase;
text-shadow: none;
word-wrap: break-word; }
@@ -78,7 +77,7 @@ body {
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/black.css b/css/theme/black.css
index 734100a..cbc4d27 100644
--- a/css/theme/black.css
+++ b/css/theme/black.css
@@ -3,7 +3,7 @@
*
* Copyright (C) 2014 Hakim El Hattab, http://hakim.se
*/
-@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
+@import url(https://fonts.googleapis.com/css?family=Montserrat:400);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);
/*********************************************
* GLOBAL STYLES
@@ -14,9 +14,9 @@ body {
.reveal {
font-family: "Open Sans", Helvetica, sans-serif;
- font-size: 32px;
+ font-size: 34px;
font-weight: normal;
- color: #eeeeee; }
+ color: white; }
::selection {
color: white;
@@ -38,28 +38,28 @@ body {
.reveal h5,
.reveal h6 {
margin: 0 0 20px 0;
- color: #eeeeee;
+ color: white;
font-family: "Montserrat", Helvetica, sans-serif;
- line-height: 1em;
+ line-height: 1.2;
letter-spacing: normal;
- text-transform: none;
+ text-transform: uppercase;
text-shadow: none;
word-wrap: break-word; }
.reveal h1 {
- font-size: 3.77em; }
+ font-size: 2.8em; }
.reveal h2 {
- font-size: 2.11em; }
+ font-size: 1.8em; }
.reveal h3 {
- font-size: 1.55em; }
+ font-size: 1.5em; }
.reveal h4 {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
@@ -216,7 +216,7 @@ body {
.reveal section img {
margin: 15px 0px;
background: rgba(255, 255, 255, 0.12);
- border: 4px solid #eeeeee;
+ border: 4px solid white;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
.reveal a img {
diff --git a/css/theme/blood.css b/css/theme/blood.css
index a29b11d..7eb16fb 100644
--- a/css/theme/blood.css
+++ b/css/theme/blood.css
@@ -27,7 +27,6 @@ body {
font-family: Ubuntu, "sans-serif";
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #eeeeee; }
::selection {
@@ -37,7 +36,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -52,8 +51,8 @@ body {
margin: 0 0 20px 0;
color: #eeeeee;
font-family: Ubuntu, "sans-serif";
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: uppercase;
text-shadow: 2px 2px 2px #222222;
word-wrap: break-word; }
@@ -78,7 +77,7 @@ body {
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/default.css b/css/theme/default.css
index 708bfa4..43779b2 100644
--- a/css/theme/default.css
+++ b/css/theme/default.css
@@ -27,7 +27,6 @@ body {
font-family: "Lato", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #eeeeee; }
::selection {
@@ -37,7 +36,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -52,8 +51,8 @@ body {
margin: 0 0 20px 0;
color: #eeeeee;
font-family: "League Gothic", Impact, sans-serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: uppercase;
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);
word-wrap: break-word; }
@@ -78,7 +77,7 @@ body {
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/moon.css b/css/theme/moon.css
index a7b236b..02bc54b 100644
--- a/css/theme/moon.css
+++ b/css/theme/moon.css
@@ -27,7 +27,6 @@ body {
font-family: "Lato", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #93a1a1; }
::selection {
@@ -37,7 +36,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -52,8 +51,8 @@ body {
margin: 0 0 20px 0;
color: #eee8d5;
font-family: "League Gothic", Impact, sans-serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: uppercase;
text-shadow: none;
word-wrap: break-word; }
@@ -71,14 +70,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/night.css b/css/theme/night.css
index ec48802..5325388 100644
--- a/css/theme/night.css
+++ b/css/theme/night.css
@@ -16,7 +16,6 @@ body {
font-family: "Open Sans", sans-serif;
font-size: 30px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #eeeeee; }
::selection {
@@ -26,7 +25,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -41,7 +40,7 @@ body {
margin: 0 0 20px 0;
color: #eeeeee;
font-family: "Montserrat", Impact, sans-serif;
- line-height: 1em;
+ line-height: 1.2;
letter-spacing: -0.03em;
text-transform: none;
text-shadow: none;
@@ -60,14 +59,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/serif.css b/css/theme/serif.css
index a060bc8..db889f8 100644
--- a/css/theme/serif.css
+++ b/css/theme/serif.css
@@ -18,7 +18,6 @@ body {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: black; }
::selection {
@@ -28,7 +27,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -43,8 +42,8 @@ body {
margin: 0 0 20px 0;
color: #383d3d;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: none;
text-shadow: none;
word-wrap: break-word; }
@@ -62,14 +61,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/simple.css b/css/theme/simple.css
index 528bac8..3ee5370 100644
--- a/css/theme/simple.css
+++ b/css/theme/simple.css
@@ -18,7 +18,6 @@ body {
font-family: "Lato", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: black; }
::selection {
@@ -28,7 +27,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -43,8 +42,8 @@ body {
margin: 0 0 20px 0;
color: black;
font-family: "News Cycle", Impact, sans-serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: none;
text-shadow: none;
word-wrap: break-word; }
@@ -62,14 +61,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/sky.css b/css/theme/sky.css
index 0601db4..b8ec51e 100644
--- a/css/theme/sky.css
+++ b/css/theme/sky.css
@@ -25,7 +25,6 @@ body {
font-family: "Open Sans", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #333333; }
::selection {
@@ -35,7 +34,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -50,7 +49,7 @@ body {
margin: 0 0 20px 0;
color: #333333;
font-family: "Quicksand", sans-serif;
- line-height: 1em;
+ line-height: 1.2;
letter-spacing: -0.08em;
text-transform: uppercase;
text-shadow: none;
@@ -69,14 +68,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/solarized.css b/css/theme/solarized.css
index 866c314..1d373c4 100644
--- a/css/theme/solarized.css
+++ b/css/theme/solarized.css
@@ -27,7 +27,6 @@ body {
font-family: "Lato", sans-serif;
font-size: 36px;
font-weight: normal;
- letter-spacing: -0.02em;
color: #657b83; }
::selection {
@@ -37,7 +36,7 @@ body {
.reveal .slides > section,
.reveal .slides > section > section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit; }
/*********************************************
@@ -52,8 +51,8 @@ body {
margin: 0 0 20px 0;
color: #586e75;
font-family: "League Gothic", Impact, sans-serif;
- line-height: 1em;
- letter-spacing: 0.02em;
+ line-height: 1.2;
+ letter-spacing: normal;
text-transform: uppercase;
text-shadow: none;
word-wrap: break-word; }
@@ -71,14 +70,14 @@ body {
font-size: 1em; }
.reveal h1 {
- text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
+ text-shadow: none; }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em; }
+ line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
diff --git a/css/theme/source/black.scss b/css/theme/source/black.scss
index 056617e..6c1e271 100644
--- a/css/theme/source/black.scss
+++ b/css/theme/source/black.scss
@@ -12,23 +12,32 @@
// Include theme-specific fonts
-@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
+@import url(https://fonts.googleapis.com/css?family=Montserrat:400);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);
// Override theme settings (see ../template/settings.scss)
$backgroundColor: #111;
+$mainColor: #fff;
+$headingColor: #fff;
+
$mainFont: 'Open Sans', Helvetica, sans-serif;
-$mainFontSize: 32px;
+$mainFontSize: 34px;
$headingFont: 'Montserrat', Helvetica, sans-serif;
$headingTextShadow: none;
$headingLetterSpacing: normal;
-$headingTextTransform: none;
+$headingTextTransform: uppercase;
$linkColor: #3992fb;
$linkColorHover: lighten( $linkColor, 15% );
$selectionBackgroundColor: lighten( $linkColor, 25% );
+$heading1Size: 2.8em;
+$heading2Size: 1.8em;
+$heading3Size: 1.5em;
+$heading4Size: 1.0em;
+
+
// Theme template ------------------------------
@import "../template/theme";
diff --git a/css/theme/source/default.scss b/css/theme/source/default.scss
index 1117b65..9c40485 100644
--- a/css/theme/source/default.scss
+++ b/css/theme/source/default.scss
@@ -28,6 +28,7 @@
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
// Override theme settings (see ../template/settings.scss)
+$headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2);
$heading1TextShadow: 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);
// Background generator
diff --git a/css/theme/template/settings.scss b/css/theme/template/settings.scss
index 1b4fe9b..88f7d75 100644
--- a/css/theme/template/settings.scss
+++ b/css/theme/template/settings.scss
@@ -13,12 +13,17 @@ $mainColor: #eee;
$headingMargin: 0 0 20px 0;
$headingFont: 'League Gothic', Impact, sans-serif;
$headingColor: #eee;
-$headingLineHeight: 1em;
-$headingLetterSpacing: 0.02em;
+$headingLineHeight: 1.2;
+$headingLetterSpacing: normal;
$headingTextTransform: uppercase;
-$headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2);
+$headingTextShadow: none;
$heading1TextShadow: $headingTextShadow;
+$heading1Size: 3.77em;
+$heading2Size: 2.11em;
+$heading3Size: 1.55em;
+$heading4Size: 1.00em;
+
// Links and actions
$linkColor: #13DAEC;
$linkColorHover: lighten( $linkColor, 20% );
diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss
index 17cf688..f2a542e 100644
--- a/css/theme/template/theme.scss
+++ b/css/theme/template/theme.scss
@@ -13,7 +13,6 @@ body {
font-family: $mainFont;
font-size: $mainFontSize;
font-weight: normal;
- letter-spacing: -0.02em;
color: $mainColor;
}
@@ -25,7 +24,7 @@ body {
.reveal .slides>section,
.reveal .slides>section>section {
- line-height: 1.2em;
+ line-height: 1.3;
font-weight: inherit;
}
@@ -52,10 +51,10 @@ body {
word-wrap: break-word;
}
-.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 {font-size: $heading1Size; }
+.reveal h2 {font-size: $heading2Size; }
+.reveal h3 {font-size: $heading3Size; }
+.reveal h4 {font-size: $heading4Size; }
.reveal h1 {
text-shadow: $heading1TextShadow;
@@ -68,7 +67,7 @@ body {
.reveal p {
margin-bottom: 10px;
- line-height: 1.2em;
+ line-height: 1.3;
}
/* Ensure certain elements are never larger than the slide itself */