merge two new themes, slight adjustments to said themes

This commit is contained in:
Hakim El Hattab 2013-03-04 17:54:59 -05:00
parent 55e16f4cb9
commit 034016e330
6 changed files with 62 additions and 47 deletions

View file

@ -50,7 +50,9 @@ module.exports = function(grunt) {
'css/theme/night.css': 'css/theme/source/night.scss', 'css/theme/night.css': 'css/theme/source/night.scss',
'css/theme/serif.css': 'css/theme/source/serif.scss', 'css/theme/serif.css': 'css/theme/source/serif.scss',
'css/theme/simple.css': 'css/theme/source/simple.scss', 'css/theme/simple.css': 'css/theme/source/simple.scss',
'css/theme/sky.css': 'css/theme/source/sky.scss' 'css/theme/sky.css': 'css/theme/source/sky.scss',
'css/theme/moon.css': 'css/theme/source/moon.scss',
'css/theme/solarized.css': 'css/theme/source/solarized.scss'
} }
}, },
}, },

View file

@ -25,11 +25,11 @@ body {
background-color: #002b36; } background-color: #002b36; }
.reveal { .reveal {
font-family: "Lato", Times, "Times New Roman", serif; font-family: "Lato", sans-serif;
font-size: 36px; font-size: 36px;
font-weight: 200; font-weight: 200;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: #839496; } color: #93a1a1; }
::selection { ::selection {
color: white; color: white;
@ -46,7 +46,7 @@ body {
.reveal h5, .reveal h5,
.reveal h6 { .reveal h6 {
margin: 0 0 20px 0; margin: 0 0 20px 0;
color: #b58900; color: #eee8d5;
font-family: "League Gothic", Impact, sans-serif; font-family: "League Gothic", Impact, sans-serif;
line-height: 0.9em; line-height: 0.9em;
letter-spacing: 0.02em; letter-spacing: 0.02em;
@ -54,7 +54,7 @@ body {
text-shadow: none; } text-shadow: none; }
.reveal h1 { .reveal h1 {
text-shadow: 0 1px 0 #cccccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
/********************************************* /*********************************************
* LINKS * LINKS
@ -83,7 +83,7 @@ body {
.reveal section img { .reveal section img {
margin: 15px 0px; margin: 15px 0px;
background: rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.12);
border: 4px solid #839496; border: 4px solid #93a1a1;
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 0.2s linear; -webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear; -moz-transition: all 0.2s linear;

View file

@ -25,7 +25,7 @@ body {
background-color: #fdf6e3; } background-color: #fdf6e3; }
.reveal { .reveal {
font-family: "Lato", Times, "Times New Roman", serif; font-family: "Lato", sans-serif;
font-size: 36px; font-size: 36px;
font-weight: 200; font-weight: 200;
letter-spacing: -0.02em; letter-spacing: -0.02em;
@ -46,7 +46,7 @@ body {
.reveal h5, .reveal h5,
.reveal h6 { .reveal h6 {
margin: 0 0 20px 0; margin: 0 0 20px 0;
color: #859900; color: #586e75;
font-family: "League Gothic", Impact, sans-serif; font-family: "League Gothic", Impact, sans-serif;
line-height: 0.9em; line-height: 0.9em;
letter-spacing: 0.02em; letter-spacing: 0.02em;
@ -54,13 +54,13 @@ body {
text-shadow: none; } text-shadow: none; }
.reveal h1 { .reveal h1 {
text-shadow: 0 1px 0 #cccccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
/********************************************* /*********************************************
* LINKS * LINKS
*********************************************/ *********************************************/
.reveal a:not(.image) { .reveal a:not(.image) {
color: #b58900; color: #268bd2;
text-decoration: none; text-decoration: none;
-webkit-transition: color 0.15s ease; -webkit-transition: color 0.15s ease;
-moz-transition: color 0.15s ease; -moz-transition: color 0.15s ease;
@ -69,13 +69,13 @@ body {
transition: color 0.15s ease; } transition: color 0.15s ease; }
.reveal a:not(.image):hover { .reveal a:not(.image):hover {
color: #ffc81c; color: #78b9e6;
text-shadow: none; text-shadow: none;
border: none; } border: none; }
.reveal .roll span:after { .reveal .roll span:after {
color: #fff; color: #fff;
background: #694f00; } background: #1a6091; }
/********************************************* /*********************************************
* IMAGES * IMAGES
@ -93,7 +93,7 @@ body {
.reveal a:hover img { .reveal a:hover img {
background: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.2);
border-color: #b58900; border-color: #268bd2;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
/********************************************* /*********************************************
@ -101,31 +101,31 @@ body {
*********************************************/ *********************************************/
.reveal .controls div.navigate-left, .reveal .controls div.navigate-left,
.reveal .controls div.navigate-left.enabled { .reveal .controls div.navigate-left.enabled {
border-right-color: #b58900; } border-right-color: #268bd2; }
.reveal .controls div.navigate-right, .reveal .controls div.navigate-right,
.reveal .controls div.navigate-right.enabled { .reveal .controls div.navigate-right.enabled {
border-left-color: #b58900; } border-left-color: #268bd2; }
.reveal .controls div.navigate-up, .reveal .controls div.navigate-up,
.reveal .controls div.navigate-up.enabled { .reveal .controls div.navigate-up.enabled {
border-bottom-color: #b58900; } border-bottom-color: #268bd2; }
.reveal .controls div.navigate-down, .reveal .controls div.navigate-down,
.reveal .controls div.navigate-down.enabled { .reveal .controls div.navigate-down.enabled {
border-top-color: #b58900; } border-top-color: #268bd2; }
.reveal .controls div.navigate-left.enabled:hover { .reveal .controls div.navigate-left.enabled:hover {
border-right-color: #ffc81c; } border-right-color: #78b9e6; }
.reveal .controls div.navigate-right.enabled:hover { .reveal .controls div.navigate-right.enabled:hover {
border-left-color: #ffc81c; } border-left-color: #78b9e6; }
.reveal .controls div.navigate-up.enabled:hover { .reveal .controls div.navigate-up.enabled:hover {
border-bottom-color: #ffc81c; } border-bottom-color: #78b9e6; }
.reveal .controls div.navigate-down.enabled:hover { .reveal .controls div.navigate-down.enabled:hover {
border-top-color: #ffc81c; } border-top-color: #78b9e6; }
/********************************************* /*********************************************
* PROGRESS BAR * PROGRESS BAR
@ -134,7 +134,7 @@ body {
background: rgba(0, 0, 0, 0.2); } background: rgba(0, 0, 0, 0.2); }
.reveal .progress span { .reveal .progress span {
background: #b58900; background: #268bd2;
-webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
-moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
-ms-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -ms-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);

View file

@ -34,17 +34,32 @@ html * {
rendering-intent: auto; rendering-intent: auto;
} }
@import "solarized_colors.scss"; // Solarized colors
$base03: #002b36;
$base02: #073642;
$base01: #586e75;
$base00: #657b83;
$base0: #839496;
$base1: #93a1a1;
$base2: #eee8d5;
$base3: #fdf6e3;
$yellow: #b58900;
$orange: #cb4b16;
$red: #dc322f;
$magenta: #d33682;
$violet: #6c71c4;
$blue: #268bd2;
$cyan: #2aa198;
$green: #859900;
// Override theme settings (see ../template/settings.scss) // Override theme settings (see ../template/settings.scss)
$mainColor: $base0; $mainColor: $base1;
$headingColor: $yellow; $headingColor: $base2;
$headingTextShadow: none; $headingTextShadow: none;
$backgroundColor: $base03; $backgroundColor: $base03;
$linkColor: $blue; $linkColor: $blue;
$linkColorHover: lighten( $linkColor, 20% ); $linkColorHover: lighten( $linkColor, 20% );
$selectionBackgroundColor: $magenta; $selectionBackgroundColor: $magenta;
$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);

View file

@ -35,17 +35,32 @@ html * {
rendering-intent: auto; rendering-intent: auto;
} }
@import "solarized_colors.scss"; // Solarized colors
$base03: #002b36;
$base02: #073642;
$base01: #586e75;
$base00: #657b83;
$base0: #839496;
$base1: #93a1a1;
$base2: #eee8d5;
$base3: #fdf6e3;
$yellow: #b58900;
$orange: #cb4b16;
$red: #dc322f;
$magenta: #d33682;
$violet: #6c71c4;
$blue: #268bd2;
$cyan: #2aa198;
$green: #859900;
// Override theme settings (see ../template/settings.scss) // Override theme settings (see ../template/settings.scss)
$mainColor: $base00; $mainColor: $base00;
$headingColor: $green; $headingColor: $base01;
$headingTextShadow: none; $headingTextShadow: none;
$backgroundColor: $base3; $backgroundColor: $base3;
$linkColor: $yellow; $linkColor: $blue;
$linkColorHover: lighten( $linkColor, 20% ); $linkColorHover: lighten( $linkColor, 20% );
$selectionBackgroundColor: $magenta; $selectionBackgroundColor: $magenta;
$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 // Background generator
// @mixin bodyBackground() { // @mixin bodyBackground() {

View file

@ -1,17 +0,0 @@
$base03: #002b36;
$base02: #073642;
$base01: #586e75;
$base00: #657b83;
$base0: #839496;
$base1: #93a1a1;
$base2: #eee8d5;
$base3: #fdf6e3;
$yellow: #b58900;
$orange: #cb4b16;
$red: #dc322f;
$magenta: #d33682;
$violet: #6c71c4;
$blue: #268bd2;
$cyan: #2aa198;
$green: #859900;