new optional controls aligned to screen edges
This commit is contained in:
		
							
								
								
									
										191
									
								
								css/reveal.css
									
									
									
									
									
								
							
							
						
						
									
										191
									
								
								css/reveal.css
									
									
									
									
									
								
							| @@ -189,7 +189,7 @@ body { | ||||
| /********************************************* | ||||
|  * CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls { | ||||
| .reveal .controls[data-controls-type="bottom-right"] { | ||||
|   display: none; | ||||
|   position: fixed; | ||||
|   width: 110px; | ||||
| @@ -198,62 +198,143 @@ body { | ||||
|   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 button { | ||||
|   padding: 0; | ||||
| .reveal .controls[data-controls-type="edges"] { | ||||
|   display: none; | ||||
|   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 .enabled { | ||||
|   opacity: 0.7; | ||||
|   cursor: pointer; } | ||||
|  | ||||
| .reveal .controls .enabled:active { | ||||
|   margin-top: 1px; } | ||||
|  | ||||
| .reveal .controls .navigate-left { | ||||
|   top: 42px; | ||||
|   border-right-width: 22px; | ||||
|   border-right-color: #000; } | ||||
|  | ||||
| .reveal .controls .navigate-left.fragmented { | ||||
|   opacity: 0.3; } | ||||
|  | ||||
| .reveal .controls .navigate-right { | ||||
|   left: 74px; | ||||
|   top: 42px; | ||||
|   border-left-width: 22px; | ||||
|   border-left-color: #000; } | ||||
|  | ||||
| .reveal .controls .navigate-right.fragmented { | ||||
|   opacity: 0.3; } | ||||
|  | ||||
| .reveal .controls .navigate-up { | ||||
|   left: 42px; | ||||
|   border-bottom-width: 22px; | ||||
|   border-bottom-color: #000; } | ||||
|  | ||||
| .reveal .controls .navigate-up.fragmented { | ||||
|   opacity: 0.3; } | ||||
|  | ||||
| .reveal .controls .navigate-down { | ||||
|   left: 42px; | ||||
|   top: 74px; | ||||
|   border-top-width: 22px; | ||||
|   border-top-color: #000; } | ||||
|  | ||||
| .reveal .controls .navigate-down.fragmented { | ||||
|   opacity: 0.3; } | ||||
|   top: 0; | ||||
|   right: 0; | ||||
|   bottom: 0; | ||||
|   left: 0; } | ||||
|   .reveal .controls[data-controls-type="edges"] button { | ||||
|     position: absolute; | ||||
|     padding: 0; | ||||
|     width: 36px; | ||||
|     height: 36px; | ||||
|     background-color: transparent; | ||||
|     border: 0; | ||||
|     outline: 0; | ||||
|     cursor: pointer; | ||||
|     opacity: 0; | ||||
|     -webkit-transform: scale(0.9999); | ||||
|             transform: scale(0.9999); | ||||
|     -webkit-transition: all 0.2s ease; | ||||
|             transition: all 0.2s ease; | ||||
|     z-index: 2; | ||||
|     -webkit-appearance: none; | ||||
|     -webkit-tap-highlight-color: transparent; } | ||||
|   .reveal .controls[data-controls-type="edges"] button:before, | ||||
|   .reveal .controls[data-controls-type="edges"] button:after { | ||||
|     content: ''; | ||||
|     position: absolute; | ||||
|     top: 40%; | ||||
|     left: 0; | ||||
|     width: 36px; | ||||
|     height: 5px; | ||||
|     border-radius: 2.5px; | ||||
|     background: #fff; | ||||
|     -webkit-transition: all 0.15s ease; | ||||
|             transition: all 0.15s ease; | ||||
|     -webkit-transform-origin: 0% 50%; | ||||
|             transform-origin: 0% 50%; } | ||||
|   .reveal .controls[data-controls-type="edges"] button:before { | ||||
|     -webkit-transform: translate(0, -1px) rotate(40deg); | ||||
|             transform: translate(0, -1px) rotate(40deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] button:after { | ||||
|     -webkit-transform: translate(0, 1px) rotate(-40deg); | ||||
|             transform: translate(0, 1px) rotate(-40deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] button:hover:before { | ||||
|     -webkit-transform: translate(0, -1px) rotate(36deg); | ||||
|             transform: translate(0, -1px) rotate(36deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] button:hover:after { | ||||
|     -webkit-transform: translate(0, 1px) rotate(-36deg); | ||||
|             transform: translate(0, 1px) rotate(-36deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] button:active:before { | ||||
|     -webkit-transform: translate(0, -1px) rotate(34deg); | ||||
|             transform: translate(0, -1px) rotate(34deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] button:active:after { | ||||
|     -webkit-transform: translate(0, 1px) rotate(-34deg); | ||||
|             transform: translate(0, 1px) rotate(-34deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] .enabled { | ||||
|     opacity: 0.7; | ||||
|     cursor: pointer; } | ||||
|   .reveal .controls[data-controls-type="edges"] .enabled:hover { | ||||
|     opacity: 1; } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-left { | ||||
|     top: 50%; | ||||
|     left: 18px; | ||||
|     margin-top: -18px; } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-left.fragmented { | ||||
|     opacity: 0.3; } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-right { | ||||
|     top: 50%; | ||||
|     right: 18px; | ||||
|     margin-top: -18px; | ||||
|     -webkit-transform: rotate(180deg); | ||||
|             transform: rotate(180deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-right.fragmented { | ||||
|     opacity: 0.3; } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-up { | ||||
|     top: 18px; | ||||
|     left: 50%; | ||||
|     margin-left: -18px; | ||||
|     -webkit-transform: rotate(90deg); | ||||
|             transform: rotate(90deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-up.fragmented { | ||||
|     opacity: 0.3; } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-down { | ||||
|     bottom: 18px; | ||||
|     left: 50%; | ||||
|     margin-left: -18px; | ||||
|     -webkit-transform: rotate(-90deg); | ||||
|             transform: rotate(-90deg); } | ||||
|   .reveal .controls[data-controls-type="edges"] .navigate-down.fragmented { | ||||
|     opacity: 0.3; } | ||||
|  | ||||
| /********************************************* | ||||
|  * PROGRESS BAR | ||||
|   | ||||
							
								
								
									
										193
									
								
								css/reveal.scss
									
									
									
									
									
								
							
							
						
						
									
										193
									
								
								css/reveal.scss
									
									
									
									
									
								
							| @@ -235,7 +235,7 @@ body { | ||||
|  * CONTROLS | ||||
|  *********************************************/ | ||||
|  | ||||
| .reveal .controls { | ||||
| .reveal .controls[data-controls-type="bottom-right"] { | ||||
| 	display: none; | ||||
| 	position: fixed; | ||||
| 	width: 110px; | ||||
| @@ -245,73 +245,192 @@ body { | ||||
| 	bottom: 10px; | ||||
|  | ||||
| 	-webkit-user-select: none; | ||||
| } | ||||
|  | ||||
| .reveal .controls 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 ); | ||||
| } | ||||
| 	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 ); | ||||
| 	} | ||||
|  | ||||
| .reveal .controls .enabled { | ||||
| 	opacity: 0.7; | ||||
| 	cursor: pointer; | ||||
| } | ||||
| 	.enabled { | ||||
| 		opacity: 0.7; | ||||
| 		cursor: pointer; | ||||
| 	} | ||||
|  | ||||
| .reveal .controls .enabled:active { | ||||
| 	margin-top: 1px; | ||||
| } | ||||
| 	.enabled:active { | ||||
| 		margin-top: 1px; | ||||
| 	} | ||||
|  | ||||
| 	.reveal .controls .navigate-left { | ||||
| 	.navigate-left { | ||||
| 		top: 42px; | ||||
|  | ||||
| 		border-right-width: 22px; | ||||
| 		border-right-color: #000; | ||||
| 	} | ||||
| 		.reveal .controls .navigate-left.fragmented { | ||||
| 			opacity: 0.3; | ||||
| 		} | ||||
| 	.navigate-left.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.reveal .controls .navigate-right { | ||||
| 	.navigate-right { | ||||
| 		left: 74px; | ||||
| 		top: 42px; | ||||
|  | ||||
| 		border-left-width: 22px; | ||||
| 		border-left-color: #000; | ||||
| 	} | ||||
| 		.reveal .controls .navigate-right.fragmented { | ||||
| 			opacity: 0.3; | ||||
| 		} | ||||
| 	.navigate-right.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.reveal .controls .navigate-up { | ||||
| 	.navigate-up { | ||||
| 		left: 42px; | ||||
|  | ||||
| 		border-bottom-width: 22px; | ||||
| 		border-bottom-color: #000; | ||||
| 	} | ||||
| 		.reveal .controls .navigate-up.fragmented { | ||||
| 			opacity: 0.3; | ||||
| 		} | ||||
| 	.navigate-up.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.reveal .controls .navigate-down { | ||||
| 	.navigate-down { | ||||
| 		left: 42px; | ||||
| 		top: 74px; | ||||
|  | ||||
| 		border-top-width: 22px; | ||||
| 		border-top-color: #000; | ||||
| 	} | ||||
| 		.reveal .controls .navigate-down.fragmented { | ||||
| 			opacity: 0.3; | ||||
| 	.navigate-down.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
| } | ||||
|  | ||||
|  | ||||
| .reveal .controls[data-controls-type="edges"] { | ||||
| 	$size: 36px; | ||||
| 	$spacing: 18px; | ||||
| 	$thickness: 5px; | ||||
| 	$angle: 40deg; | ||||
| 	$angleHover: 36deg; | ||||
| 	$angleActive: 34deg; | ||||
|  | ||||
| 	@mixin arrowTransform( $angle, $x: 0, $y: 0 ) { | ||||
| 		&:before { | ||||
| 			transform: translate( $x, $y ) rotate( $angle ); | ||||
| 		} | ||||
|  | ||||
| 		&:after { | ||||
| 			transform: translate( $x, -$y ) rotate( -$angle ); | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	display: none; | ||||
| 	position: absolute; | ||||
| 	top: 0; | ||||
| 	right: 0; | ||||
| 	bottom: 0; | ||||
| 	left: 0; | ||||
|  | ||||
| 	button { | ||||
| 		position: absolute; | ||||
| 		padding: 0; | ||||
| 		width: $size; | ||||
| 		height: $size; | ||||
| 		background-color: transparent; | ||||
| 		border: 0; | ||||
| 		outline: 0; | ||||
| 		cursor: pointer; | ||||
| 		opacity: 0; | ||||
| 		transform: scale(.9999); | ||||
| 		transition: all 0.2s ease; | ||||
| 		z-index: 2; // above slides | ||||
| 		-webkit-appearance: none; | ||||
| 		-webkit-tap-highlight-color: rgba( 0, 0, 0, 0 ); | ||||
| 	} | ||||
|  | ||||
| 	button:before, | ||||
| 	button:after { | ||||
| 		content: ''; | ||||
| 		position: absolute; | ||||
| 		top: 40%; | ||||
| 		left: 0; | ||||
| 		width: $size; | ||||
| 		height: $thickness; | ||||
| 		border-radius: $thickness / 2; | ||||
| 		background: #fff; | ||||
|  | ||||
| 		transition: all 0.15s ease; | ||||
| 		transform-origin: 0% 50%; | ||||
| 	} | ||||
|  | ||||
| 	button { | ||||
| 		@include arrowTransform( $angle, 0, -1px ); | ||||
|  | ||||
| 		&:hover { | ||||
| 			@include arrowTransform( $angleHover, 0, -1px ); | ||||
| 		} | ||||
|  | ||||
| 		&:active { | ||||
| 			@include arrowTransform( $angleActive, 0, -1px ); | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	.enabled { | ||||
| 		opacity: 0.7; | ||||
| 		cursor: pointer; | ||||
| 	} | ||||
|  | ||||
| 	.enabled:hover { | ||||
| 		opacity: 1; | ||||
| 	} | ||||
|  | ||||
| 	.navigate-left { | ||||
| 		top: 50%; | ||||
| 		left: $spacing; | ||||
| 		margin-top: -$size/2; | ||||
| 	} | ||||
| 	.navigate-left.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.navigate-right { | ||||
| 		top: 50%; | ||||
| 		right: $spacing; | ||||
| 		margin-top: -$size/2; | ||||
| 		transform: rotate( 180deg ); | ||||
| 	} | ||||
| 	.navigate-right.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.navigate-up { | ||||
| 		top: $spacing; | ||||
| 		left: 50%; | ||||
| 		margin-left: -$size/2; | ||||
| 		transform: rotate( 90deg ); | ||||
| 	} | ||||
| 	.navigate-up.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
|  | ||||
| 	.navigate-down { | ||||
| 		bottom: $spacing; | ||||
| 		left: 50%; | ||||
| 		margin-left: -$size/2; | ||||
| 		transform: rotate( -90deg ); | ||||
| 	} | ||||
| 	.navigate-down.fragmented { | ||||
| 		opacity: 0.3; | ||||
| 	} | ||||
| } | ||||
|  | ||||
|  | ||||
| /********************************************* | ||||
|  * PROGRESS BAR | ||||
|   | ||||
| @@ -255,34 +255,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #8b743d; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #c0a86e; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #c0a86e; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #c0a86e; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -251,34 +251,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #42affa; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #8dcffc; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #8dcffc; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #8dcffc; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -254,34 +254,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #a23; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #dd5566; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #dd5566; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #dd5566; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -257,34 +257,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #13DAEC; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #71e9f4; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #71e9f4; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #71e9f4; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -255,34 +255,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #268bd2; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -249,34 +249,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #e7ad52; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #f3d7ac; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #f3d7ac; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #f3d7ac; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -251,34 +251,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #51483D; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #8b7c69; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #8b7c69; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #8b7c69; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -254,34 +254,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #00008B; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #0000f1; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #0000f1; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #0000f1; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -258,34 +258,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #3b759e; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #74a7cb; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #74a7cb; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #74a7cb; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -255,34 +255,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #268bd2; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #78b9e6; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
| @@ -297,42 +297,47 @@ body { | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
|  | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
| 	border-right-color: $linkColor; | ||||
| } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
| 	border-right-color: $linkColorHover; | ||||
| } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
| 	border-left-color: $linkColorHover; | ||||
| } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
| 	border-bottom-color: $linkColorHover; | ||||
| } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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; | ||||
| } | ||||
|  | ||||
|  | ||||
| /********************************************* | ||||
|  * PROGRESS BAR | ||||
|   | ||||
| @@ -251,34 +251,38 @@ body { | ||||
| /********************************************* | ||||
|  * NAVIGATION CONTROLS | ||||
|  *********************************************/ | ||||
| .reveal .controls .navigate-left, | ||||
| .reveal .controls .navigate-left.enabled { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left, | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled { | ||||
|   border-right-color: #2a76dd; } | ||||
|  | ||||
| .reveal .controls .navigate-right, | ||||
| .reveal .controls .navigate-right.enabled { | ||||
| .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 .navigate-up, | ||||
| .reveal .controls .navigate-up.enabled { | ||||
| .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 .navigate-down, | ||||
| .reveal .controls .navigate-down.enabled { | ||||
| .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 .navigate-left.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-left.enabled:hover { | ||||
|   border-right-color: #6ca0e8; } | ||||
|  | ||||
| .reveal .controls .navigate-right.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-right.enabled:hover { | ||||
|   border-left-color: #6ca0e8; } | ||||
|  | ||||
| .reveal .controls .navigate-up.enabled:hover { | ||||
| .reveal .controls[data-controls-type="bottom-right"] .navigate-up.enabled:hover { | ||||
|   border-bottom-color: #6ca0e8; } | ||||
|  | ||||
| .reveal .controls .navigate-down.enabled:hover { | ||||
| .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 | ||||
|  *********************************************/ | ||||
|   | ||||
		Reference in New Issue
	
	Block a user