cartodb4/CartoAssets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add first shapes - #12

Browse Source
This commit is contained in:
piensaenpixel
2016-01-27 19:17:16 +01:00
parent ea648f146d
commit dc4819fe38
9 changed files with 311 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/scss/cdb-components/shapes/threePoints.scss
+64
View File
@@ -0,0 +1,64 @@
/* SG
# Shapes/Three Points
Description
```
<div style="padding: 20px;">
<div class="CDB-Shape-threePoints">
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
</div>
</div>
<div style="padding: 20px;">
<div class="CDB-Shape-threePoints is-blue">
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
</div>
</div>
<div style="background: #2E3C43; padding: 20px;">
<div class="CDB-Shape-threePoints is-white">
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
</div>
</div>
```
*/
@import '../../cdb-variables/colors';
.CDB-Shape-threePoints {
display: inline-block;
position: relative;
width: 3px;
height: 15px;
padding: 0 12;
&:hover {
cursor: pointer;
}
}
.CDB-Shape-threePointsItem {
width: 3px;
height: 3px;
margin-bottom: 3px;
border-radius: 50%;
background: $cMainDark;
}
.CDB-Shape-threePoints.is-blue {
.CDB-Shape-threePointsItem {
background: $cBlue;
}
}
.CDB-Shape-threePoints.is-white {
.CDB-Shape-threePointsItem {
background: $cWhite;
}
}