style tweaks for all themes; larger line heights, no default adjustmetn to letter-spacing

edit
Hakim El Hattab 2014-09-28 12:14:48 +02:00
parent 9ef0060024
commit bd176411ef
14 changed files with 78 additions and 73 deletions

View File

@ -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,

View File

@ -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 {

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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,

View File

@ -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";

View File

@ -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

View File

@ -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% );

View File

@ -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 */