diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss
index 1ec1b8ce..7c88b3f3 100644
--- a/css/theme/template/theme.scss
+++ b/css/theme/template/theme.scss
@@ -237,6 +237,10 @@
vertical-align: top;
}
+.reveal img {
+ margin: $blockMargin 0;
+}
+
/*********************************************
* LINKS
@@ -245,14 +249,10 @@
.reveal a {
color: $linkColor;
text-decoration: none;
-
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
- transition: color .15s ease;
+ transition: color .15s ease;
}
.reveal a:hover {
color: $linkColorHover;
-
text-shadow: none;
border: none;
}
@@ -264,34 +264,22 @@
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255,255,255,0.12);
+.reveal .r-frame {
border: 4px solid $mainColor;
-
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
- .reveal section img.plain {
- border: 0;
- box-shadow: none;
- }
+.reveal a .r-frame {
+ transition: all .15s linear;
+}
- .reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
- transition: all .15s linear;
- }
-
- .reveal a:hover img {
- background: rgba(255,255,255,0.2);
- border-color: $linkColor;
-
- box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
- }
+.reveal a:hover .r-frame {
+ border-color: $linkColor;
+ box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
+}
/*********************************************
@@ -312,9 +300,7 @@
color: $linkColor;
}
.reveal .progress span {
- -webkit-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
- -moz-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
- transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+ transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
}
/*********************************************
diff --git a/demo.html b/demo.html
index a2a1927b..cd073d20 100644
--- a/demo.html
+++ b/demo.html
@@ -51,7 +51,7 @@
Use the Space key to navigate through all slides.
-
+
@@ -63,7 +63,7 @@
That's it, time to go back up.
-
+
@@ -230,7 +230,7 @@
Set data-background="#dddddd"
on a slide to change the background color. All CSS color formats are supported.
-
+
diff --git a/dist/theme/beige.css b/dist/theme/beige.css
index 579770e1..af10d176 100644
--- a/dist/theme/beige.css
+++ b/dist/theme/beige.css
@@ -234,14 +234,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #8b743d;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -254,25 +255,16 @@
background: #564826; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #333;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #8b743d;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -290,8 +282,6 @@
color: #8b743d; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/black.css b/dist/theme/black.css
index 51498a5b..2dcbfb54 100644
--- a/dist/theme/black.css
+++ b/dist/theme/black.css
@@ -230,14 +230,15 @@ section.has-light-background, section.has-light-background h1, section.has-light
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #42affa;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -250,25 +251,16 @@ section.has-light-background, section.has-light-background h1, section.has-light
background: #068de9; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #42affa;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -286,8 +278,6 @@ section.has-light-background, section.has-light-background h1, section.has-light
color: #42affa; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/blood.css b/dist/theme/blood.css
index 396d6328..18a37a8f 100644
--- a/dist/theme/blood.css
+++ b/dist/theme/blood.css
@@ -233,14 +233,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #a23;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -253,25 +254,16 @@
background: #6a1520; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #eee;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #a23;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -289,8 +281,6 @@
color: #a23; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/league.css b/dist/theme/league.css
index 6878bca0..abf28466 100644
--- a/dist/theme/league.css
+++ b/dist/theme/league.css
@@ -236,14 +236,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #13DAEC;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -256,25 +257,16 @@
background: #0d99a5; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #eee;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #13DAEC;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -292,8 +284,6 @@
color: #13DAEC; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/moon.css b/dist/theme/moon.css
index de4a02c8..cc005e35 100644
--- a/dist/theme/moon.css
+++ b/dist/theme/moon.css
@@ -234,14 +234,15 @@ html * {
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #268bd2;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -254,25 +255,16 @@ html * {
background: #1a6091; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #93a1a1;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #268bd2;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -290,8 +282,6 @@ html * {
color: #268bd2; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/night.css b/dist/theme/night.css
index 278bb7fd..a2324e9b 100644
--- a/dist/theme/night.css
+++ b/dist/theme/night.css
@@ -228,14 +228,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #e7ad52;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -248,25 +249,16 @@
background: #d08a1d; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #eee;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #e7ad52;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -284,8 +276,6 @@
color: #e7ad52; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/serif.css b/dist/theme/serif.css
index e4deebd7..886a1cb6 100644
--- a/dist/theme/serif.css
+++ b/dist/theme/serif.css
@@ -230,14 +230,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #51483D;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -250,25 +251,16 @@
background: #25211c; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #000;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #51483D;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -286,8 +278,6 @@
color: #51483D; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/simple.css b/dist/theme/simple.css
index 5b0da04e..80fd6836 100644
--- a/dist/theme/simple.css
+++ b/dist/theme/simple.css
@@ -233,14 +233,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #00008B;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -253,25 +254,16 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
background: #00003f; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #000;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #00008B;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -289,8 +281,6 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
color: #00008B; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/sky.css b/dist/theme/sky.css
index 77786e22..1c81c76e 100644
--- a/dist/theme/sky.css
+++ b/dist/theme/sky.css
@@ -237,14 +237,15 @@
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #3b759e;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -257,25 +258,16 @@
background: #264c66; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #333;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #3b759e;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -293,8 +285,6 @@
color: #3b759e; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/solarized.css b/dist/theme/solarized.css
index 09d6e894..5b6f0859 100644
--- a/dist/theme/solarized.css
+++ b/dist/theme/solarized.css
@@ -234,14 +234,15 @@ html * {
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #268bd2;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -254,25 +255,16 @@ html * {
background: #1a6091; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #657b83;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #268bd2;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -290,8 +282,6 @@ html * {
color: #268bd2; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************
diff --git a/dist/theme/white.css b/dist/theme/white.css
index 6cc55110..03348e8b 100644
--- a/dist/theme/white.css
+++ b/dist/theme/white.css
@@ -230,14 +230,15 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
.reveal small * {
vertical-align: top; }
+.reveal img {
+ margin: 20px 0; }
+
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #2a76dd;
text-decoration: none;
- -webkit-transition: color .15s ease;
- -moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
@@ -250,25 +251,16 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
background: #1a53a1; }
/*********************************************
- * IMAGES
+ * Frame helper
*********************************************/
-.reveal section img {
- margin: 15px 0px;
- background: rgba(255, 255, 255, 0.12);
+.reveal .r-frame {
border: 4px solid #222;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
-.reveal section img.plain {
- border: 0;
- box-shadow: none; }
-
-.reveal a img {
- -webkit-transition: all .15s linear;
- -moz-transition: all .15s linear;
+.reveal a .r-frame {
transition: all .15s linear; }
-.reveal a:hover img {
- background: rgba(255, 255, 255, 0.2);
+.reveal a:hover .r-frame {
border-color: #2a76dd;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
@@ -286,8 +278,6 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
color: #2a76dd; }
.reveal .progress span {
- -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);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
/*********************************************