diff --git a/css/impress-common.css b/css/impress-common.css
new file mode 100644
index 0000000..f918473
--- /dev/null
+++ b/css/impress-common.css
@@ -0,0 +1,155 @@
+/* impress.js doesn't require any particular CSS file.
+Each author should create their own, to achieve the visual style they want.
+Yet in practice many plugins will not do anything useful without CSS. (See for example mouse-timeout plugin.)
+This file contains sample CSS that you may want to use in your presentation.
+It is focused on plugin functionality, not the visual style of your presentation. */
+
+/* Using the substep plugin, hide bullet points at first, then show them one by one. */
+#impress .step .substep {
+ opacity: 0;
+}
+
+#impress .step .substep.substep-visible {
+ opacity: 1;
+ transition: opacity 1s;
+}
+/*
+ Speaker notes allow you to write comments within the steps, that will not
+ be displayed as part of the presentation. However, they will be picked up
+ and displayed by impressConsole.js when you press P.
+*/
+.notes {
+ display: none;
+}
+
+/* Toolbar plugin */
+.impress-enabled div#impress-toolbar {
+ position: fixed;
+ right: 1px;
+ bottom: 1px;
+ opacity: 0.6;
+ z-index: 10;
+}
+.impress-enabled div#impress-toolbar > span {
+ margin-right: 10px;
+}
+.impress-enabled div#impress-toolbar.impress-toolbar-show {
+ display: block;
+}
+.impress-enabled div#impress-toolbar.impress-toolbar-hide {
+ display: none;
+}
+
+/* Progress bar */
+.impress-progress {
+ position: absolute;
+ left: 59px;
+ bottom: 1px;
+ text-align: left;
+ font-size: 10pt;
+ opacity: 0.6;
+}
+.impress-enabled .impress-progressbar {
+ position: absolute;
+ right: 318px;
+ bottom: 1px;
+ left: 118px;
+ border-radius: 7px;
+ border: 2px solid rgba(100, 100, 100, 0.2);
+}
+.impress-progressbar {
+ right: 118px;
+}
+.impress-progressbar DIV {
+ width: 0;
+ height: 2px;
+ border-radius: 5px;
+ background: rgba(75, 75, 75, 0.4);
+ transition: width 1s linear;
+}
+.impress-enabled .impress-progress {
+ position: absolute;
+ left: 59px;
+ bottom: 1px;
+ text-align: left;
+ opacity: 0.6;
+}
+.impress-enabled #impress-help {
+ background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
+ color: #EEEEEE;
+ font-size: 80%;
+ position: fixed;
+ left: 2em;
+ bottom: 2em;
+ width: 24em;
+ border-radius: 1em;
+ padding: 1em;
+ text-align: center;
+ z-index: 100;
+ font-family: Verdana, Arial, Sans;
+}
+.impress-enabled #impress-help td {
+ padding-left: 1em;
+ padding-right: 1em;
+}
+
+/*
+ With help from the mouse-timeout plugin, we can hide the toolbar and
+ have it show only when you move/click/touch the mouse.
+*/
+body.impress-mouse-timeout div#impress-toolbar {
+ display: none;
+}
+
+/*
+ In fact, we can hide the mouse cursor itself too, when mouse isn't used.
+*/
+body.impress-mouse-timeout {
+ cursor: none;
+}
+
+
+/*
+ And as the last thing there is a workaround for quite strange bug.
+ It happens a lot in Chrome. I don't remember if I've seen it in Firefox.
+
+ Sometimes the element positioned in 3D (especially when it's moved back
+ along Z axis) is not clickable, because it falls 'behind' the
+ element.
+
+ To prevent this, I decided to make non clickable by setting
+ pointer-events property to `none` value.
+ Value if this property is inherited, so to make everything else clickable
+ I bring it back on the #impress element.
+
+ If you want to know more about `pointer-events` here are some docs:
+ https://developer.mozilla.org/en/CSS/pointer-events
+
+ There is one very important thing to notice about this workaround - it makes
+ everything 'unclickable' except what's in #impress element.
+
+ So use it wisely ... or don't use at all.
+*/
+
+.impress-enabled { pointer-events: none }
+.impress-enabled #impress { pointer-events: auto }
+
+ /*If you disable pointer-events, you need to re-enable them for the toolbar.
+ And the speaker console while at it.*/
+
+.impress-enabled #impress-toolbar { pointer-events: auto }
+.impress-enabled #impress-console-button { pointer-events: auto }
+
+
+/*
+ There is one funny thing I just realized.
+
+ Thanks to this workaround above everything except #impress element is invisible
+ for click events. That means that the hint element is also not clickable.
+ So basically all of this transforms and delayed transitions trickery was probably
+ not needed at all...
+
+ But it was fun to learn about it, wasn't it?
+*/
+
+
diff --git a/css/impress-demo.css b/css/impress-demo.css
index ddc7f34..adb1840 100644
--- a/css/impress-demo.css
+++ b/css/impress-demo.css
@@ -534,36 +534,6 @@ a:focus {
cursor: pointer;
}
-/*
- This version of impress.js supports plugins, and in particular, a UI toolbar
- plugin that allows easy navigation between steps and autoplay.
-*/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-
-/*
- With help from the mouse-timeout plugin, we can hide the toolbar and
- have it show only when you move/click/touch the mouse.
-*/
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-
-/*
- In fact, we can hide the mouse cursor itself too, when mouse isn't used.
-*/
-body.impress-mouse-timeout {
- cursor: none;
-}
-
-
/*
Now, when we have all the steps styled let's give users a hint how to navigate
around the presentation.
@@ -697,42 +667,6 @@ body.impress-mouse-timeout {
transition: opacity 1s 5s, transform 0.5s 4.5s;
}
-/*
- And as the last thing there is a workaround for quite strange bug.
- It happens a lot in Chrome. I don't remember if I've seen it in Firefox.
-
- Sometimes the element positioned in 3D (especially when it's moved back
- along Z axis) is not clickable, because it falls 'behind' the
- element.
-
- To prevent this, I decided to make non clickable by setting
- pointer-events property to `none` value.
- Value if this property is inherited, so to make everything else clickable
- I bring it back on the #impress element.
-
- If you want to know more about `pointer-events` here are some docs:
- https://developer.mozilla.org/en/CSS/pointer-events
-
- There is one very important thing to notice about this workaround - it makes
- everything 'unclickable' except what's in #impress element.
-
- So use it wisely ... or don't use at all.
-*/
-.impress-enabled { pointer-events: none }
-.impress-enabled #impress { pointer-events: auto }
-.impress-enabled #impress-toolbar { pointer-events: auto }
-.impress-enabled #impress-console-button { pointer-events: auto }
-/*
- There is one funny thing I just realized.
-
- Thanks to this workaround above everything except #impress element is invisible
- for click events. That means that the hint element is also not clickable.
- So basically all of this transforms and delayed transitions trickery was probably
- not needed at all...
-
- But it was fun to learn about it, wasn't it?
-*/
-
/*
That's all I have for you in this file.
Thanks for reading. I hope you enjoyed it at least as much as I enjoyed writing it
diff --git a/examples/2D-navigation/css/presentation.css b/examples/2D-navigation/css/presentation.css
index 036addc..8328607 100644
--- a/examples/2D-navigation/css/presentation.css
+++ b/examples/2D-navigation/css/presentation.css
@@ -87,16 +87,6 @@ body {
.impress-enabled .step.active { opacity: 1 }
-/*
- Speaker notes allow you to write comments within the steps, that will not
- be displayed as part of the presentation. However, they will be picked up
- and displayed by impressConsole.js when integrated.
-*/
-
-.notes {
- display: none;
-}
-
h1,
h2,
h3 {
@@ -236,106 +226,4 @@ body.impress-on-overview #crisps-image {
#image-credits {
color: #779988;
-}
-
-
-
-
-
-
-
-
-
-/******************* PLUGINS *************************************************************/
-/*
- This version of impress.js supports plugins, and in particular, a UI toolbar
- plugin that allows easy navigation between steps and autoplay.
-*/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
- z-index: 10;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-
-/*
- With help from the mouse-timeout plugin, we can hide the toolbar and
- have it show only when you move/click/touch the mouse.
-*/
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-
-/*
- In fact, we can hide the mouse cursor itself too, when mouse isn't used.
-*/
-body.impress-mouse-timeout {
- cursor: none;
-}
-
-
-
-/* Progress bar */
-.impress-progressbar {
- position: absolute;
- right: 118px;
- bottom: 1px;
- left: 118px;
- border-radius: 7px;
- border: 2px solid rgba(100, 100, 100, 0.2);
-}
-.impress-progressbar DIV {
- width: 0;
- height: 2px;
- border-radius: 5px;
- background: rgba(75, 75, 75, 0.4);
- transition: width 1s linear;
-}
-.impress-progress {
- position: absolute;
- left: 59px;
- bottom: 1px;
- text-align: left;
- font-size: 10pt;
- opacity: 0.6;
-}
-
-/* Help popup plugin */
-.impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
-}
-.impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-/* Substep plugin */
-
-#impress .step .substep {
- opacity: 0;
-}
-
-#impress .step .substep.substep-visible {
- opacity: 1;
- transition: opacity 1s;
-}
-
-.impress-enabled { pointer-events: none }
-.impress-enabled #impress { pointer-events: auto }
-.impress-enabled #impress-toolbar { pointer-events: auto }
-.impress-enabled #impress-console-button { pointer-events: auto }
+}
\ No newline at end of file
diff --git a/examples/2D-navigation/index.html b/examples/2D-navigation/index.html
index 0cdf634..c6dc6d7 100644
--- a/examples/2D-navigation/index.html
+++ b/examples/2D-navigation/index.html
@@ -5,6 +5,7 @@
Desserts (2D navigation demo)
+
diff --git a/examples/3D-rotations/css/3D-rotations.css b/examples/3D-rotations/css/3D-rotations.css
index 9c12fd2..77f8139 100644
--- a/examples/3D-rotations/css/3D-rotations.css
+++ b/examples/3D-rotations/css/3D-rotations.css
@@ -58,10 +58,6 @@ body {
}
-.notes {
- display: none;
-}
-
/* Overview step has no background or border */
.overview {
@@ -165,116 +161,10 @@ small {
font-size: 0.4em;
}
-
-/*
- This version of impress.js supports plugins, and in particular, a UI toolbar
- plugin that allows easy navigation between steps and autoplay.
-*/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
- z-index: 10;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-
-/*
- With help from the mouse-timeout plugin, we can hide the toolbar and
- have it show only when you move/click/touch the mouse.
-*/
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-
-/*
- In fact, we can hide the mouse cursor itself too, when mouse isn't used.
-*/
-body.impress-mouse-timeout {
- cursor: none;
-}
-
-
-
-/* Progress bar */
-.impress-progressbar {
- position: absolute;
- right: 118px;
- bottom: 1px;
- left: 118px;
- border-radius: 7px;
- border: 2px solid rgba(100, 100, 100, 0.2);
-}
-.impress-progressbar DIV {
- width: 0;
- height: 2px;
- border-radius: 5px;
- background: rgba(75, 75, 75, 0.4);
- transition: width 1s linear;
-}
-.impress-progress {
- position: absolute;
- left: 59px;
- bottom: 1px;
- text-align: left;
- font-size: 10pt;
- opacity: 0.6;
-}
-
-/* Help popup plugin */
-.impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
-}
-.impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-
/* Styles specific to each step */
#overview2 {
font-size: 20pt;
padding-left: 200px;
text-align: right;
-}
-
-
-/*
- And as the last thing there is a workaround for quite strange bug.
- It happens a lot in Chrome. I don't remember if I've seen it in Firefox.
-
- Sometimes the element positioned in 3D (especially when it's moved back
- along Z axis) is not clickable, because it falls 'behind' the
- element.
-
- To prevent this, I decided to make non clickable by setting
- pointer-events property to `none` value.
- Value if this property is inherited, so to make everything else clickable
- I bring it back on the #impress element.
-
- If you want to know more about `pointer-events` here are some docs:
- https://developer.mozilla.org/en/CSS/pointer-events
-
- There is one very important thing to notice about this workaround - it makes
- everything 'unclickable' except what's in #impress element.
-
- So use it wisely ... or don't use at all.
-*/
-.impress-enabled { pointer-events: none }
-.impress-enabled #impress { pointer-events: auto }
-.impress-enabled #impress-toolbar { pointer-events: auto }
-.impress-enabled #impress-console-button { pointer-events: auto }
+}
\ No newline at end of file
diff --git a/examples/3D-rotations/index.html b/examples/3D-rotations/index.html
index ce1ed83..4b8de9b 100644
--- a/examples/3D-rotations/index.html
+++ b/examples/3D-rotations/index.html
@@ -22,6 +22,7 @@
A Study in 3D Rotations| by Henrik Ingo @henrikingo
+
diff --git a/examples/classic-slides/css/classic-slides.css b/examples/classic-slides/css/classic-slides.css
index fe12162..f5808e2 100644
--- a/examples/classic-slides/css/classic-slides.css
+++ b/examples/classic-slides/css/classic-slides.css
@@ -83,16 +83,6 @@ body {
.impress-enabled .step.active { opacity: 1 }
-/*
- Speaker notes allow you to write comments within the steps, that will not
- be displayed as part of the presentation. However, they will be picked up
- and displayed by impressConsole.js when integrated.
-*/
-
-.notes {
- display: none;
-}
-
/*
These 'slide' step styles were heavily inspired by HTML5 Slides:
http://html5slides.googlecode.com/svn/trunk/styles.css
@@ -314,94 +304,6 @@ td {
opacity: 0.0;
}
-/*
- This version of impress.js supports plugins, and in particular, a UI toolbar
- plugin that allows easy navigation between steps and autoplay.
-*/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
- z-index: 10;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-
-/*
- With help from the mouse-timeout plugin, we can hide the toolbar and
- have it show only when you move/click/touch the mouse.
-*/
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-
-/*
- In fact, we can hide the mouse cursor itself too, when mouse isn't used.
-*/
-body.impress-mouse-timeout {
- cursor: none;
-}
-
-
-
-/* Progress bar */
-.impress-progressbar {
- position: absolute;
- right: 118px;
- bottom: 1px;
- left: 118px;
- border-radius: 7px;
- border: 2px solid rgba(100, 100, 100, 0.2);
-}
-.impress-progressbar DIV {
- width: 0;
- height: 2px;
- border-radius: 5px;
- background: rgba(75, 75, 75, 0.4);
- transition: width 1s linear;
-}
-.impress-progress {
- position: absolute;
- left: 59px;
- bottom: 1px;
- text-align: left;
- font-size: 10pt;
- opacity: 0.6;
-}
-
-/* Help popup plugin */
-.impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
-}
-.impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-/* Substep plugin */
-
-#impress .step .substep {
- opacity: 0;
-}
-
-#impress .step .substep.substep-visible {
- opacity: 1;
- transition: opacity 1s;
-}
-
/*
Styles for specific slides.
*/
@@ -446,6 +348,7 @@ body.impress-mouse-timeout {
#acme-graph-q4 {
background-color: purple;
+ left: 750px;
right: 300px;
}
diff --git a/examples/classic-slides/index.html b/examples/classic-slides/index.html
index 0200ce3..50cae1c 100644
--- a/examples/classic-slides/index.html
+++ b/examples/classic-slides/index.html
@@ -33,7 +33,8 @@
-
+
+
diff --git a/examples/cube/css/cube.css b/examples/cube/css/cube.css
index 4ea33c9..8239916 100644
--- a/examples/cube/css/cube.css
+++ b/examples/cube/css/cube.css
@@ -73,10 +73,6 @@ body {
.impress-enabled .step.active { opacity: 1 }
-.notes {
- display: none;
-}
-
h1,
h2,
h3 {
@@ -150,108 +146,4 @@ strike {
small {
font-size: 0.4em;
-}
-
-
-/*
- This version of impress.js supports plugins, and in particular, a UI toolbar
- plugin that allows easy navigation between steps and autoplay.
-*/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
- z-index: 10;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-
-/*
- With help from the mouse-timeout plugin, we can hide the toolbar and
- have it show only when you move/click/touch the mouse.
-*/
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-
-/*
- In fact, we can hide the mouse cursor itself too, when mouse isn't used.
-*/
-body.impress-mouse-timeout {
- cursor: none;
-}
-
-
-
-/* Progress bar */
-.impress-progressbar {
- position: absolute;
- right: 118px;
- bottom: 1px;
- left: 118px;
- border-radius: 7px;
- border: 2px solid rgba(100, 100, 100, 0.2);
-}
-.impress-progressbar DIV {
- width: 0;
- height: 2px;
- border-radius: 5px;
- background: rgba(75, 75, 75, 0.4);
- transition: width 1s linear;
-}
-.impress-progress {
- position: absolute;
- left: 59px;
- bottom: 1px;
- text-align: left;
- font-size: 10pt;
- opacity: 0.6;
-}
-
-/* Help popup plugin */
-.impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
-}
-.impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-/*
- And as the last thing there is a workaround for quite strange bug.
- It happens a lot in Chrome. I don't remember if I've seen it in Firefox.
-
- Sometimes the element positioned in 3D (especially when it's moved back
- along Z axis) is not clickable, because it falls 'behind' the
- element.
-
- To prevent this, I decided to make non clickable by setting
- pointer-events property to `none` value.
- Value if this property is inherited, so to make everything else clickable
- I bring it back on the #impress element.
-
- If you want to know more about `pointer-events` here are some docs:
- https://developer.mozilla.org/en/CSS/pointer-events
-
- There is one very important thing to notice about this workaround - it makes
- everything 'unclickable' except what's in #impress element.
-
- So use it wisely ... or don't use at all.
-*/
-.impress-enabled { pointer-events: none }
-.impress-enabled #impress { pointer-events: auto }
-.impress-enabled #impress-toolbar { pointer-events: auto }
-.impress-enabled #impress-console-button { pointer-events: auto }
+}
\ No newline at end of file
diff --git a/examples/cube/index.html b/examples/cube/index.html
index fc811e9..95a01b0 100644
--- a/examples/cube/index.html
+++ b/examples/cube/index.html
@@ -5,6 +5,7 @@
Cube | Explore impress.js in 3D | by Henrik Ingo @henrikingo
+
diff --git a/examples/markdown/css/markdown-slides.css b/examples/markdown/css/markdown-slides.css
index db79088..d339b6f 100644
--- a/examples/markdown/css/markdown-slides.css
+++ b/examples/markdown/css/markdown-slides.css
@@ -88,10 +88,6 @@ body {
}
.impress-enabled .step.active { opacity: 1 }
-.notes {
- display: none;
-}
-
h1,
h2,
h3 {
@@ -183,52 +179,4 @@ img {
}
.title h1 { top: 50px; }
.title h2 { top: 400px; }
-.title h3 { top: 500px; }
-
-
-
-/***** Plugins ******/
-.impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
-}
-.impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
-}
-body.impress-mouse-timeout div#impress-toolbar {
- display: none;
-}
-body.impress-mouse-timeout {
- cursor: none;
-}
-/* Help popup plugin */
-.impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
-}
-.impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-
-
-/*
- Disable mouse clicks / focus for body
-*/
-.impress-enabled { pointer-events: none }
-.impress-enabled #impress { pointer-events: auto }
-.impress-enabled #impress-toolbar { pointer-events: auto }
-.impress-enabled #impress-console-button { pointer-events: auto }
+.title h3 { top: 500px; }
\ No newline at end of file
diff --git a/examples/markdown/index.html b/examples/markdown/index.html
index 355a14f..a1d87bd 100644
--- a/examples/markdown/index.html
+++ b/examples/markdown/index.html
@@ -15,7 +15,8 @@
-
+
+
diff --git a/index.html b/index.html
index 6e5e446..25ae67a 100644
--- a/index.html
+++ b/index.html
@@ -90,6 +90,7 @@
-->
+
diff --git a/src/plugins/README.md b/src/plugins/README.md
index 31d3908..ea91f5e 100644
--- a/src/plugins/README.md
+++ b/src/plugins/README.md
@@ -87,89 +87,7 @@ Some addons can handle additional HTML data attributes to help us in further cus
### Sample CSS related to plugins and extra addons
- /* Using the substep plugin, hide bullet points at first, then show them one by one. */
- #impress .step .substep {
- opacity: 0;
- }
-
- #impress .step .substep.substep-visible {
- opacity: 1;
- transition: opacity 1s;
- }
- /*
- Speaker notes allow you to write comments within the steps, that will not
- be displayed as part of the presentation. However, they will be picked up
- and displayed by impressConsole.js when you press P.
- */
- .notes {
- display: none;
- }
-
- /* Toolbar plugin */
- .impress-enabled div#impress-toolbar {
- position: fixed;
- right: 1px;
- bottom: 1px;
- opacity: 0.6;
- z-index: 10;
- }
- .impress-enabled div#impress-toolbar > span {
- margin-right: 10px;
- }
- .impress-enabled div#impress-toolbar.impress-toolbar-show {
- display: block;
- }
- .impress-enabled div#impress-toolbar.impress-toolbar-hide {
- display: none;
- }
-
- /* If you disable pointer-events (like in the impress.js official demo), you need to re-enable them for the toolbar.
- And the speaker console while at it.*/
- .impress-enabled #impress-toolbar { pointer-events: auto }
- .impress-enabled #impress-console-button { pointer-events: auto }
-
- /* Progress bar */
- .impress-enabled .impress-progressbar {
- position: absolute;
- right: 318px;
- bottom: 1px;
- left: 118px;
- border-radius: 7px;
- border: 2px solid rgba(100, 100, 100, 0.2);
- }
- .impress-enabled .impress-progressbar DIV {
- width: 0;
- height: 2px;
- border-radius: 5px;
- background: rgba(75, 75, 75, 0.4);
- transition: width 1s linear;
- }
- .impress-enabled .impress-progress {
- position: absolute;
- left: 59px;
- bottom: 1px;
- text-align: left;
- opacity: 0.6;
- }
- .impress-enabled #impress-help {
- background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
- color: #EEEEEE;
- font-size: 80%;
- position: fixed;
- left: 2em;
- bottom: 2em;
- width: 24em;
- border-radius: 1em;
- padding: 1em;
- text-align: center;
- z-index: 100;
- font-family: Verdana, Arial, Sans;
- }
- .impress-enabled #impress-help td {
- padding-left: 1em;
- padding-right: 1em;
- }
-
+The sample css related to plugins and extra addons is located in [css/impress-common.css](../../css/impress-common.css).
For developers
==============