invert colors of controls based on current background
This commit is contained in:
		| @@ -277,9 +277,9 @@ body { | |||||||
|     width: 33px; |     width: 33px; | ||||||
|     height: 5px; |     height: 5px; | ||||||
|     border-radius: 2.5px; |     border-radius: 2.5px; | ||||||
|     background: #fff; |     background-color: #fff; | ||||||
|     -webkit-transition: all 0.15s ease; |     -webkit-transition: all 0.15s ease, background-color 0.8s ease; | ||||||
|             transition: all 0.15s 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[data-controls-type="edges"] button:before { | ||||||
| @@ -350,6 +350,14 @@ body { | |||||||
|       right: 18px; |       right: 18px; | ||||||
|       bottom: 0; } } |       bottom: 0; } } | ||||||
|  |  | ||||||
|  | .reveal.has-dark-background .controls[data-controls-type="edges"] button:after, | ||||||
|  | .reveal.has-dark-background .controls[data-controls-type="edges"] button:before { | ||||||
|  |   background-color: #fff; } | ||||||
|  |  | ||||||
|  | .reveal.has-light-background .controls[data-controls-type="edges"] button:after, | ||||||
|  | .reveal.has-light-background .controls[data-controls-type="edges"] button:before { | ||||||
|  |   background-color: #000; } | ||||||
|  |  | ||||||
| /********************************************* | /********************************************* | ||||||
|  * PROGRESS BAR |  * PROGRESS BAR | ||||||
|  *********************************************/ |  *********************************************/ | ||||||
|   | |||||||
| @@ -365,9 +365,9 @@ body { | |||||||
| 		width: $length; | 		width: $length; | ||||||
| 		height: $thickness; | 		height: $thickness; | ||||||
| 		border-radius: $thickness/2; | 		border-radius: $thickness/2; | ||||||
| 		background: #fff; | 		background-color: #fff; | ||||||
|  |  | ||||||
| 		transition: all 0.15s ease; | 		transition: all 0.15s ease, background-color 0.8s ease; | ||||||
| 		transform-origin: $thickness/2 50%; | 		transform-origin: $thickness/2 50%; | ||||||
| 	} | 	} | ||||||
|  |  | ||||||
| @@ -453,6 +453,16 @@ body { | |||||||
| 	} | 	} | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .reveal.has-dark-background .controls[data-controls-type="edges"] button:after, | ||||||
|  | .reveal.has-dark-background .controls[data-controls-type="edges"] button:before { | ||||||
|  | 	background-color: #fff; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | .reveal.has-light-background .controls[data-controls-type="edges"] button:after, | ||||||
|  | .reveal.has-light-background .controls[data-controls-type="edges"] button:before { | ||||||
|  | 	background-color: #000; | ||||||
|  | } | ||||||
|  |  | ||||||
|  |  | ||||||
| /********************************************* | /********************************************* | ||||||
|  * PROGRESS BAR |  * PROGRESS BAR | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user