invert colors of controls based on current background

This commit is contained in:
Hakim El Hattab 2016-04-20 16:27:19 +02:00
parent ce4537f883
commit 69c72b9e08
2 changed files with 23 additions and 5 deletions

View file

@ -277,9 +277,9 @@ body {
width: 33px;
height: 5px;
border-radius: 2.5px;
background: #fff;
-webkit-transition: all 0.15s ease;
transition: all 0.15s ease;
background-color: #fff;
-webkit-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%;
transform-origin: 2.5px 50%; }
.reveal .controls[data-controls-type="edges"] button:before {
@ -350,6 +350,14 @@ body {
right: 18px;
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
*********************************************/

View file

@ -365,9 +365,9 @@ body {
width: $length;
height: $thickness;
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%;
}
@ -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