simplify control styling using currentColor
This commit is contained in:
parent
2155415767
commit
10545d41cc
14 changed files with 31 additions and 39 deletions
|
@ -196,7 +196,8 @@ body {
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 1; }
|
z-index: 1;
|
||||||
|
color: #fff; }
|
||||||
.reveal .controls button {
|
.reveal .controls button {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@ -206,6 +207,7 @@ body {
|
||||||
border: 0;
|
border: 0;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
color: currentColor;
|
||||||
-webkit-transform: scale(0.9999);
|
-webkit-transform: scale(0.9999);
|
||||||
transform: scale(0.9999);
|
transform: scale(0.9999);
|
||||||
-webkit-transition: all 0.2s ease;
|
-webkit-transition: all 0.2s ease;
|
||||||
|
@ -224,7 +226,7 @@ body {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
height: 5px;
|
height: 5px;
|
||||||
border-radius: 2.5px;
|
border-radius: 2.5px;
|
||||||
background-color: #fff;
|
background-color: currentColor;
|
||||||
-webkit-transition: all 0.15s ease, background-color 0.8s ease;
|
-webkit-transition: all 0.15s ease, background-color 0.8s ease;
|
||||||
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%;
|
||||||
|
|
|
@ -261,6 +261,7 @@ body {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
color: #fff;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -271,6 +272,7 @@ body {
|
||||||
border: 0;
|
border: 0;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
color: currentColor;
|
||||||
transform: scale(.9999);
|
transform: scale(.9999);
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
z-index: 2; // above slides
|
z-index: 2; // above slides
|
||||||
|
@ -291,7 +293,7 @@ body {
|
||||||
width: $length;
|
width: $length;
|
||||||
height: $thickness;
|
height: $thickness;
|
||||||
border-radius: $thickness/2;
|
border-radius: $thickness/2;
|
||||||
background-color: #fff;
|
background-color: currentColor;
|
||||||
|
|
||||||
transition: all 0.15s ease, background-color 0.8s ease;
|
transition: all 0.15s ease, background-color 0.8s ease;
|
||||||
transform-origin: $thickness/2 50%;
|
transform-origin: $thickness/2 50%;
|
||||||
|
|
|
@ -255,9 +255,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #8b743d; }
|
||||||
background-color: #8b743d; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -251,9 +251,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #42affa; }
|
||||||
background-color: #42affa; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -254,9 +254,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #a23; }
|
||||||
background-color: #a23; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -257,9 +257,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #13DAEC; }
|
||||||
background-color: #13DAEC; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -255,9 +255,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #268bd2; }
|
||||||
background-color: #268bd2; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -249,9 +249,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #e7ad52; }
|
||||||
background-color: #e7ad52; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -251,9 +251,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #51483D; }
|
||||||
background-color: #51483D; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -254,9 +254,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #00008B; }
|
||||||
background-color: #00008B; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -258,9 +258,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #3b759e; }
|
||||||
background-color: #3b759e; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -255,9 +255,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #268bd2; }
|
||||||
background-color: #268bd2; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
|
@ -297,9 +297,8 @@ body {
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
|
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: $linkColor;
|
||||||
background-color: $linkColor;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -251,9 +251,8 @@ body {
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* NAVIGATION CONTROLS
|
* NAVIGATION CONTROLS
|
||||||
*********************************************/
|
*********************************************/
|
||||||
.reveal .controls button:before,
|
.reveal .controls {
|
||||||
.reveal .controls button:after {
|
color: #2a76dd; }
|
||||||
background-color: #2a76dd; }
|
|
||||||
|
|
||||||
/*********************************************
|
/*********************************************
|
||||||
* PROGRESS BAR
|
* PROGRESS BAR
|
||||||
|
|
Loading…
Reference in a new issue