new controls are used by default, add config options
This commit is contained in:
Hakim El Hattab
parent
8a09557699
commit
a9fcaa6f9e
15 changed files with 160 additions and 575 deletions
164
css/reveal.css
164
css/reveal.css
|
|
@ -189,69 +189,14 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* CONTROLS
|
* CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] {
|
.reveal .controls {
|
||||||
display: none;
|
|
||||||
position: fixed;
|
|
||||||
width: 110px;
|
|
||||||
height: 110px;
|
|
||||||
z-index: 30;
|
|
||||||
right: 10px;
|
|
||||||
bottom: 10px;
|
|
||||||
-webkit-user-select: none; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] button {
|
|
||||||
padding: 0;
|
|
||||||
position: absolute;
|
|
||||||
opacity: 0.05;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
background-color: transparent;
|
|
||||||
border: 12px solid transparent;
|
|
||||||
-webkit-transform: scale(0.9999);
|
|
||||||
transform: scale(0.9999);
|
|
||||||
-webkit-transition: all 0.2s ease;
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
-webkit-tap-highlight-color: transparent; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .enabled {
|
|
||||||
opacity: 0.7;
|
|
||||||
cursor: pointer; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .enabled:active {
|
|
||||||
margin-top: 1px; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left {
|
|
||||||
top: 42px;
|
|
||||||
border-right-width: 22px;
|
|
||||||
border-right-color: #000; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.fragmented {
|
|
||||||
opacity: 0.3; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right {
|
|
||||||
left: 74px;
|
|
||||||
top: 42px;
|
|
||||||
border-left-width: 22px;
|
|
||||||
border-left-color: #000; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.fragmented {
|
|
||||||
opacity: 0.3; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up {
|
|
||||||
left: 42px;
|
|
||||||
border-bottom-width: 22px;
|
|
||||||
border-bottom-color: #000; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.fragmented {
|
|
||||||
opacity: 0.3; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down {
|
|
||||||
left: 42px;
|
|
||||||
top: 74px;
|
|
||||||
border-top-width: 22px;
|
|
||||||
border-top-color: #000; }
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.fragmented {
|
|
||||||
opacity: 0.3; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] {
|
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0; }
|
left: 0; }
|
||||||
.reveal .controls[data-controls-type="edges"] button {
|
.reveal .controls button {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
width: 50px;
|
width: 50px;
|
||||||
|
|
@ -268,8 +213,8 @@ body {
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
-webkit-tap-highlight-color: transparent; }
|
-webkit-tap-highlight-color: transparent; }
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
.reveal .controls button:after {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|
@ -282,81 +227,116 @@ body {
|
||||||
transition: all 0.15s ease, background-color 0.8s ease;
|
transition: all 0.15s ease, background-color 0.8s ease;
|
||||||
-webkit-transform-origin: 2.5px 50%;
|
-webkit-transform-origin: 2.5px 50%;
|
||||||
transform-origin: 2.5px 50%; }
|
transform-origin: 2.5px 50%; }
|
||||||
.reveal .controls[data-controls-type="edges"] button:before {
|
.reveal .controls button:before {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(44deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(44deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(44deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(44deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
.reveal .controls button:after {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-44deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-44deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(-44deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(-44deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] button:hover:before {
|
.reveal .controls button:hover:before {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(40deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(40deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(40deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(40deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] button:hover:after {
|
.reveal .controls button:hover:after {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-40deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-40deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(-40deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(-40deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] button:active:before {
|
.reveal .controls button:active:before {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(36deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(36deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(36deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(36deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] button:active:after {
|
.reveal .controls button:active:after {
|
||||||
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-36deg);
|
-webkit-transform: translateX(10px) translateY(22.5px) rotate(-36deg);
|
||||||
transform: translateX(10px) translateY(22.5px) rotate(-36deg); }
|
transform: translateX(10px) translateY(22.5px) rotate(-36deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] .enabled {
|
.reveal .controls .navigate-left {
|
||||||
opacity: 0.7;
|
|
||||||
cursor: pointer; }
|
|
||||||
.reveal .controls[data-controls-type="edges"] .enabled.fragmented {
|
|
||||||
opacity: 0.3; }
|
|
||||||
.reveal .controls[data-controls-type="edges"] .enabled:hover,
|
|
||||||
.reveal .controls[data-controls-type="edges"] .enabled.fragmented:hover {
|
|
||||||
opacity: 1; }
|
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-left {
|
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: 18px;
|
left: 18px;
|
||||||
-webkit-transform: translateY(-50%);
|
-webkit-transform: translateY(-50%);
|
||||||
transform: translateY(-50%); }
|
transform: translateY(-50%); }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-right {
|
.reveal .controls .navigate-right {
|
||||||
top: 50%;
|
top: 50%;
|
||||||
right: 18px;
|
right: 18px;
|
||||||
-webkit-transform: translateY(-50%) rotate(180deg);
|
-webkit-transform: translateY(-50%) rotate(180deg);
|
||||||
transform: translateY(-50%) rotate(180deg); }
|
transform: translateY(-50%) rotate(180deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-up {
|
.reveal .controls .navigate-up {
|
||||||
top: 18px;
|
top: 18px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
-webkit-transform: translateX(-50%) rotate(90deg);
|
-webkit-transform: translateX(-50%) rotate(90deg);
|
||||||
transform: translateX(-50%) rotate(90deg); }
|
transform: translateX(-50%) rotate(90deg); }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-down {
|
.reveal .controls .navigate-down {
|
||||||
bottom: 18px;
|
bottom: 18px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
-webkit-transform: translateX(-50%) rotate(-90deg);
|
-webkit-transform: translateX(-50%) rotate(-90deg);
|
||||||
transform: translateX(-50%) rotate(-90deg); }
|
transform: translateX(-50%) rotate(-90deg); }
|
||||||
@media screen and (max-width: 500px) {
|
.reveal .controls.soften-back-arrows .navigate-left.enabled,
|
||||||
.reveal .controls[data-controls-type="edges"] {
|
.reveal .controls.soften-back-arrows .navigate-up.enabled {
|
||||||
|
opacity: 0.3; }
|
||||||
|
.reveal .controls.soften-back-arrows .navigate-left.enabled:hover,
|
||||||
|
.reveal .controls.soften-back-arrows .navigate-up.enabled:hover {
|
||||||
|
opacity: 1; }
|
||||||
|
.reveal .controls .enabled {
|
||||||
|
opacity: 0.7;
|
||||||
|
cursor: pointer; }
|
||||||
|
.reveal .controls .enabled.fragmented {
|
||||||
|
opacity: 0.3; }
|
||||||
|
.reveal .controls .enabled:hover,
|
||||||
|
.reveal .controls .enabled.fragmented:hover {
|
||||||
|
opacity: 1; }
|
||||||
|
.reveal .controls[data-controls-placement="bottom-right"] {
|
||||||
bottom: 18px;
|
bottom: 18px;
|
||||||
right: 18px; }
|
right: 18px;
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-left,
|
-webkit-transform: scale(0.85);
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-right,
|
transform: scale(0.85);
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-up,
|
-webkit-transform-origin: 100% 100%;
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-down {
|
transform-origin: 100% 100%; }
|
||||||
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-left,
|
||||||
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-right,
|
||||||
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-up,
|
||||||
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-down {
|
||||||
top: auto;
|
top: auto;
|
||||||
left: auto; }
|
left: auto; }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-left {
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-left {
|
||||||
right: 86px;
|
right: 86px;
|
||||||
bottom: 18px; }
|
bottom: 18px; }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-right {
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-right {
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 18px; }
|
bottom: 18px; }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-up {
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-up {
|
||||||
right: 18px;
|
right: 18px;
|
||||||
bottom: 86px; }
|
bottom: 86px; }
|
||||||
.reveal .controls[data-controls-type="edges"] .navigate-down {
|
.reveal .controls[data-controls-placement="bottom-right"] .navigate-down {
|
||||||
|
right: 18px;
|
||||||
|
bottom: 0; }
|
||||||
|
@media screen and (max-width: 500px) {
|
||||||
|
.reveal .controls {
|
||||||
|
bottom: 18px;
|
||||||
|
right: 18px;
|
||||||
|
-webkit-transform: scale(0.85);
|
||||||
|
transform: scale(0.85);
|
||||||
|
-webkit-transform-origin: 100% 100%;
|
||||||
|
transform-origin: 100% 100%; }
|
||||||
|
.reveal .controls .navigate-left,
|
||||||
|
.reveal .controls .navigate-right,
|
||||||
|
.reveal .controls .navigate-up,
|
||||||
|
.reveal .controls .navigate-down {
|
||||||
|
top: auto;
|
||||||
|
left: auto; }
|
||||||
|
.reveal .controls .navigate-left {
|
||||||
|
right: 86px;
|
||||||
|
bottom: 18px; }
|
||||||
|
.reveal .controls .navigate-right {
|
||||||
|
right: 0;
|
||||||
|
bottom: 18px; }
|
||||||
|
.reveal .controls .navigate-up {
|
||||||
|
right: 18px;
|
||||||
|
bottom: 86px; }
|
||||||
|
.reveal .controls .navigate-down {
|
||||||
right: 18px;
|
right: 18px;
|
||||||
bottom: 0; } }
|
bottom: 0; } }
|
||||||
|
|
||||||
.reveal.has-dark-background .controls[data-controls-type="edges"] button:after,
|
.reveal.has-dark-background .controls button:after,
|
||||||
.reveal.has-dark-background .controls[data-controls-type="edges"] button:before {
|
.reveal.has-dark-background .controls button:before {
|
||||||
background-color: #fff; }
|
background-color: #fff; }
|
||||||
|
|
||||||
.reveal.has-light-background .controls[data-controls-type="edges"] button:after,
|
.reveal.has-light-background .controls button:after,
|
||||||
.reveal.has-light-background .controls[data-controls-type="edges"] button:before {
|
.reveal.has-light-background .controls button:before {
|
||||||
background-color: #000; }
|
background-color: #000; }
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
|
|
|
||||||
143
css/reveal.scss
143
css/reveal.scss
|
|
@ -235,85 +235,7 @@ body {
|
||||||
* CONTROLS
|
* CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] {
|
.reveal .controls {
|
||||||
display: none;
|
|
||||||
position: fixed;
|
|
||||||
width: 110px;
|
|
||||||
height: 110px;
|
|
||||||
z-index: 30;
|
|
||||||
right: 10px;
|
|
||||||
bottom: 10px;
|
|
||||||
|
|
||||||
-webkit-user-select: none;
|
|
||||||
|
|
||||||
button {
|
|
||||||
padding: 0;
|
|
||||||
position: absolute;
|
|
||||||
opacity: 0.05;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
background-color: transparent;
|
|
||||||
border: 12px solid transparent;
|
|
||||||
transform: scale(.9999);
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
-webkit-tap-highlight-color: rgba( 0, 0, 0, 0 );
|
|
||||||
}
|
|
||||||
|
|
||||||
.enabled {
|
|
||||||
opacity: 0.7;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.enabled:active {
|
|
||||||
margin-top: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigate-left {
|
|
||||||
top: 42px;
|
|
||||||
|
|
||||||
border-right-width: 22px;
|
|
||||||
border-right-color: #000;
|
|
||||||
}
|
|
||||||
.navigate-left.fragmented {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigate-right {
|
|
||||||
left: 74px;
|
|
||||||
top: 42px;
|
|
||||||
|
|
||||||
border-left-width: 22px;
|
|
||||||
border-left-color: #000;
|
|
||||||
}
|
|
||||||
.navigate-right.fragmented {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigate-up {
|
|
||||||
left: 42px;
|
|
||||||
|
|
||||||
border-bottom-width: 22px;
|
|
||||||
border-bottom-color: #000;
|
|
||||||
}
|
|
||||||
.navigate-up.fragmented {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigate-down {
|
|
||||||
left: 42px;
|
|
||||||
top: 74px;
|
|
||||||
|
|
||||||
border-top-width: 22px;
|
|
||||||
border-top-color: #000;
|
|
||||||
}
|
|
||||||
.navigate-down.fragmented {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] {
|
|
||||||
$size: 50px;
|
$size: 50px;
|
||||||
$length: floor($size * 0.6);
|
$length: floor($size * 0.6);
|
||||||
$spacing: 18px;
|
$spacing: 18px;
|
||||||
|
|
@ -383,20 +305,6 @@ body {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.enabled {
|
|
||||||
opacity: 0.7;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.enabled.fragmented {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.enabled:hover,
|
|
||||||
.enabled.fragmented:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigate-left {
|
.navigate-left {
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: $spacing;
|
left: $spacing;
|
||||||
|
|
@ -421,10 +329,41 @@ body {
|
||||||
transform: translateX(-50%) rotate( -90deg );
|
transform: translateX(-50%) rotate( -90deg );
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
// The soften back arrows option strongly deemphasizes
|
||||||
|
// backwards navigation in favor of drawing attention
|
||||||
|
// forwards
|
||||||
|
&.soften-back-arrows .navigate-left.enabled,
|
||||||
|
&.soften-back-arrows .navigate-up.enabled {
|
||||||
|
opacity: 0.3;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Any control button that can be clicked is "enabled"
|
||||||
|
.enabled {
|
||||||
|
opacity: 0.7;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Any control button that leads to showing or hiding
|
||||||
|
// a fragment
|
||||||
|
.enabled.fragmented {
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.enabled:hover,
|
||||||
|
.enabled.fragmented:hover {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin bottom-right-controls() {
|
||||||
& {
|
& {
|
||||||
bottom: $spacing;
|
bottom: $spacing;
|
||||||
right: $spacing;
|
right: $spacing;
|
||||||
|
transform: scale(0.85);
|
||||||
|
transform-origin: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navigate-left,
|
.navigate-left,
|
||||||
|
|
@ -452,15 +391,23 @@ body {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&[data-controls-placement="bottom-right"] {
|
||||||
|
@include bottom-right-controls()
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal.has-dark-background .controls[data-controls-type="edges"] button:after,
|
@media screen and (max-width: 500px) {
|
||||||
.reveal.has-dark-background .controls[data-controls-type="edges"] button:before {
|
@include bottom-right-controls()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.reveal.has-dark-background .controls button:after,
|
||||||
|
.reveal.has-dark-background .controls button:before {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal.has-light-background .controls[data-controls-type="edges"] button:after,
|
.reveal.has-light-background .controls button:after,
|
||||||
.reveal.has-light-background .controls[data-controls-type="edges"] button:before {
|
.reveal.has-light-background .controls button:before {
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -255,37 +255,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #8b743d; }
|
background-color: #8b743d; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #8b743d; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #8b743d; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #8b743d; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #c0a86e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #c0a86e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #c0a86e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #c0a86e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #333; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -251,37 +251,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #42affa; }
|
background-color: #42affa; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #42affa; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #42affa; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #42affa; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #8dcffc; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #8dcffc; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #8dcffc; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #8dcffc; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #fff; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -254,37 +254,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #a23; }
|
background-color: #a23; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #a23; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #a23; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #a23; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #dd5566; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #dd5566; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #dd5566; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #dd5566; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #eee; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -257,37 +257,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #13DAEC; }
|
background-color: #13DAEC; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #13DAEC; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #13DAEC; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #13DAEC; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #71e9f4; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #71e9f4; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #71e9f4; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #71e9f4; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #eee; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -255,37 +255,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #268bd2; }
|
background-color: #268bd2; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #93a1a1; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -249,37 +249,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #e7ad52; }
|
background-color: #e7ad52; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #e7ad52; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #e7ad52; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #e7ad52; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #f3d7ac; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #f3d7ac; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #f3d7ac; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #f3d7ac; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #eee; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -251,37 +251,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #51483D; }
|
background-color: #51483D; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #51483D; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #51483D; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #51483D; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #8b7c69; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #8b7c69; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #8b7c69; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #8b7c69; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #000; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -254,37 +254,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #00008B; }
|
background-color: #00008B; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #00008B; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #00008B; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #00008B; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #0000f1; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #0000f1; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #0000f1; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #0000f1; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #000; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -258,37 +258,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #3b759e; }
|
background-color: #3b759e; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #3b759e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #3b759e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #3b759e; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #74a7cb; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #74a7cb; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #74a7cb; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #74a7cb; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #333; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -255,37 +255,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #268bd2; }
|
background-color: #268bd2; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #268bd2; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #78b9e6; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #657b83; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
|
|
@ -297,45 +297,9 @@ body {
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: $linkColor;
|
background-color: $linkColor;
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: $linkColor;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: $linkColor;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: $linkColor;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: $linkColorHover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: $linkColorHover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: $linkColorHover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: $linkColorHover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: $mainColor;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -251,37 +251,9 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left,
|
.reveal .controls button:before,
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled {
|
.reveal .controls button:after {
|
||||||
border-right-color: #2a76dd; }
|
background-color: #2a76dd; }
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled {
|
|
||||||
border-left-color: #2a76dd; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled {
|
|
||||||
border-bottom-color: #2a76dd; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down,
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled {
|
|
||||||
border-top-color: #2a76dd; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover {
|
|
||||||
border-right-color: #6ca0e8; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover {
|
|
||||||
border-left-color: #6ca0e8; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover {
|
|
||||||
border-bottom-color: #6ca0e8; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="bottom-right"] .navigate-down.enabled:hover {
|
|
||||||
border-top-color: #6ca0e8; }
|
|
||||||
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:before,
|
|
||||||
.reveal .controls[data-controls-type="edges"] button:after {
|
|
||||||
background-color: #222; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
||||||
14
js/reveal.js
14
js/reveal.js
|
|
@ -52,6 +52,12 @@
|
||||||
// Display controls in the bottom right corner
|
// Display controls in the bottom right corner
|
||||||
controls: true,
|
controls: true,
|
||||||
|
|
||||||
|
// Determines where controls appear, either "bottom-right" or "edges"
|
||||||
|
controlsPlacement: 'edges',
|
||||||
|
|
||||||
|
// De-emphasizes backwards navigation controls
|
||||||
|
controlsSoftenBackArrows: true,
|
||||||
|
|
||||||
// Display a presentation progress bar
|
// Display a presentation progress bar
|
||||||
progress: true,
|
progress: true,
|
||||||
|
|
||||||
|
|
@ -998,12 +1004,8 @@
|
||||||
dom.controls.style.display = config.controls ? 'block' : 'none';
|
dom.controls.style.display = config.controls ? 'block' : 'none';
|
||||||
dom.progress.style.display = config.progress ? 'block' : 'none';
|
dom.progress.style.display = config.progress ? 'block' : 'none';
|
||||||
|
|
||||||
var controlsType = typeof config.controls === 'string' ? config.controls : 'bottom-right';
|
dom.controls.setAttribute( 'data-controls-placement', config.controlsPlacement );
|
||||||
dom.controls.setAttribute( 'data-controls-type', controlsType );
|
dom.controls.classList.toggle( 'soften-back-arrows', config.controlsSoftenBackArrows );
|
||||||
|
|
||||||
if( typeof config.controls === 'string' ) {
|
|
||||||
dom.controls.classList.add( config.controls );
|
|
||||||
}
|
|
||||||
|
|
||||||
if( config.shuffle ) {
|
if( config.shuffle ) {
|
||||||
shuffle();
|
shuffle();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue