remove colorBar from cartoassets
This commit is contained in:
parent
9ef35729de
commit
0bb00aedb2
@ -1,116 +0,0 @@
|
|||||||
// Color input styles
|
|
||||||
// ----------------------------------------------
|
|
||||||
|
|
||||||
/* SG
|
|
||||||
# Forms/Color bar
|
|
||||||
|
|
||||||
```
|
|
||||||
<ul class="CDB-ColorBarContainer">
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #9DE0AD;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #50E3C2;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #FFFFC0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #7ED321;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #BD10E0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceMedium" style="background-color: #F15743;"></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<ul class="CDB-ColorBarContainer">
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #9DE0AD;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #50E3C2;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #FFFFC0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #7ED321;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #BD10E0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceSmall" style="background-color: #F15743;"></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<ul class="CDB-ColorBarContainer">
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #9DE0AD;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #50E3C2;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #FFFFC0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #7ED321;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #BD10E0;"></li>
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar--spaceless" style="background-color: #F15743;"></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<ul class="CDB-ColorBarContainer">
|
|
||||||
<li class="CDB-ColorBar" style="background-color: #9DE0AD;"></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<ul class="CDB-ColorBarContainer">
|
|
||||||
<li class="CDB-ColorBar CDB-ColorBar-gradient" style="background: linear-gradient(90deg, #FFFECA, #9FDAB3, #36B6C5, #207EBA, #203196);"></li>
|
|
||||||
</ul>
|
|
||||||
```
|
|
||||||
*/
|
|
||||||
|
|
||||||
@import '../../cdb-variables/sizes';
|
|
||||||
@import '../../cdb-utilities/mixins';
|
|
||||||
|
|
||||||
.CDB-ColorBarContainer {
|
|
||||||
@include display-flex();
|
|
||||||
@include flex-direction(row);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: $baseSize - 2;
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
||||||
border-radius: $baseSize - 2;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.CDB-ColorBar-gradient {
|
|
||||||
border: 0;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
||||||
border-radius: $baseSize - 2;
|
|
||||||
content: '';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceMedium {
|
|
||||||
margin-right: $baseSize / 2;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceless {
|
|
||||||
border-width: 1px 0;
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceless:first-child {
|
|
||||||
border-width: 1px 0 1px 1px;
|
|
||||||
border-radius: $baseSize - 2 0 0 $baseSize - 2;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceless:last-child {
|
|
||||||
border-width: 1px 1px 1px 0;
|
|
||||||
border-radius: 0 $baseSize - 2 $baseSize - 2 0;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceSmall {
|
|
||||||
margin-right: 2px;
|
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceSmall:first-child {
|
|
||||||
border-radius: $baseSize - 2 3px 3px $baseSize - 2;
|
|
||||||
}
|
|
||||||
.CDB-ColorBar.CDB-ColorBar--spaceSmall:last-child {
|
|
||||||
margin-right: 0;
|
|
||||||
border-radius: 3px $baseSize - 2 $baseSize - 2 3px;
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user