more flexible back arrow controls option
This commit is contained in:
parent
e45a425575
commit
2155415767
@ -267,12 +267,16 @@ body {
|
|||||||
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.deemphasize-back-arrows .navigate-left.enabled,
|
.reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-left.enabled,
|
||||||
.reveal .controls.deemphasize-back-arrows .navigate-up.enabled {
|
.reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-up.enabled {
|
||||||
opacity: 0.3; }
|
opacity: 0.3; }
|
||||||
.reveal .controls.deemphasize-back-arrows .navigate-left.enabled:hover,
|
.reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-left.enabled:hover,
|
||||||
.reveal .controls.deemphasize-back-arrows .navigate-up.enabled:hover {
|
.reveal .controls[data-controls-back-arrows="deemphasized"] .navigate-up.enabled:hover {
|
||||||
opacity: 1; }
|
opacity: 1; }
|
||||||
|
.reveal .controls[data-controls-back-arrows="hidden"] .navigate-left.enabled,
|
||||||
|
.reveal .controls[data-controls-back-arrows="hidden"] .navigate-up.enabled {
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden; }
|
||||||
.reveal .controls .enabled {
|
.reveal .controls .enabled {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
opacity: 0.7;
|
opacity: 0.7;
|
||||||
|
@ -333,11 +333,11 @@ body {
|
|||||||
transform: translateX(-50%) rotate( -90deg );
|
transform: translateX(-50%) rotate( -90deg );
|
||||||
}
|
}
|
||||||
|
|
||||||
// The deemphasize back arrows option strongly deemphasizes
|
// Back arrow style: "deemphasized":
|
||||||
// backwards navigation in favor of drawing attention to
|
// Strongly deemphasizes backwards navigation in favor of drawing
|
||||||
// forwards navigation
|
// attention to forwards navigation
|
||||||
&.deemphasize-back-arrows .navigate-left.enabled,
|
&[data-controls-back-arrows="deemphasized"] .navigate-left.enabled,
|
||||||
&.deemphasize-back-arrows .navigate-up.enabled {
|
&[data-controls-back-arrows="deemphasized"] .navigate-up.enabled {
|
||||||
opacity: 0.3;
|
opacity: 0.3;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@ -345,6 +345,14 @@ body {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Back arrow style: "hidden":
|
||||||
|
// Never shows any arrows for backwards navigation
|
||||||
|
&[data-controls-back-arrows="hidden"] .navigate-left.enabled,
|
||||||
|
&[data-controls-back-arrows="hidden"] .navigate-up.enabled {
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
// Any control button that can be clicked is "enabled"
|
// Any control button that can be clicked is "enabled"
|
||||||
.enabled {
|
.enabled {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
|
@ -55,8 +55,9 @@
|
|||||||
// Determines where controls appear, "edges" or "bottom-right"
|
// Determines where controls appear, "edges" or "bottom-right"
|
||||||
controlsPlacement: 'bottom-right',
|
controlsPlacement: 'bottom-right',
|
||||||
|
|
||||||
// De-emphasizes backwards navigation controls
|
// Specifies the display rules for backwards navigation arrows;
|
||||||
controlsDeemphasizeBackArrows: true,
|
// "deemphasized", "hidden" or "visible"
|
||||||
|
controlsBackArrows: 'deemphasized',
|
||||||
|
|
||||||
// Display a presentation progress bar
|
// Display a presentation progress bar
|
||||||
progress: true,
|
progress: true,
|
||||||
@ -1005,7 +1006,7 @@
|
|||||||
dom.progress.style.display = config.progress ? 'block' : 'none';
|
dom.progress.style.display = config.progress ? 'block' : 'none';
|
||||||
|
|
||||||
dom.controls.setAttribute( 'data-controls-placement', config.controlsPlacement );
|
dom.controls.setAttribute( 'data-controls-placement', config.controlsPlacement );
|
||||||
dom.controls.classList.toggle( 'deemphasize-back-arrows', config.controlsDeemphasizeBackArrows );
|
dom.controls.setAttribute( 'data-controls-back-arrows', config.controlsBackArrows );
|
||||||
|
|
||||||
if( config.shuffle ) {
|
if( config.shuffle ) {
|
||||||
shuffle();
|
shuffle();
|
||||||
|
Loading…
Reference in New Issue
Block a user