Color bar & option input component: minor improvements

This commit is contained in:
María Checa 2016-02-23 11:23:49 +01:00
parent 231e72cfd9
commit b7847b25ab
2 changed files with 10 additions and 9 deletions

View File

@ -50,6 +50,7 @@
``` ```
*/ */
@import '../../cdb-variables/sizes';
@import '../../cdb-utilities/mixins'; @import '../../cdb-utilities/mixins';
.CDB-ColorBarContainer { .CDB-ColorBarContainer {
@ -60,9 +61,9 @@
.CDB-ColorBar { .CDB-ColorBar {
position: relative; position: relative;
width: 100%; width: 100%;
height: 6px; height: $baseSize - 2;
border: 1px solid rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 6px; border-radius: $baseSize - 2;
box-sizing: border-box; box-sizing: border-box;
&:last-child { &:last-child {
@ -79,12 +80,12 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
border: 1px solid rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 6px; border-radius: $baseSize - 2;
content: ''; content: '';
} }
} }
.CDB-ColorBar.CDB-ColorBar--spaceMedium { .CDB-ColorBar.CDB-ColorBar--spaceMedium {
margin-right: 4px; margin-right: $baseSize / 2;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
@ -96,20 +97,20 @@
} }
.CDB-ColorBar.CDB-ColorBar--spaceless:first-child { .CDB-ColorBar.CDB-ColorBar--spaceless:first-child {
border-width: 1px 0 1px 1px; border-width: 1px 0 1px 1px;
border-radius: 6px 0 0 6px; border-radius: $baseSize - 2 0 0 $baseSize - 2;
} }
.CDB-ColorBar.CDB-ColorBar--spaceless:last-child { .CDB-ColorBar.CDB-ColorBar--spaceless:last-child {
border-width: 1px 1px 1px 0; border-width: 1px 1px 1px 0;
border-radius: 0 6px 6px 0; border-radius: 0 $baseSize - 2 $baseSize - 2 0;
} }
.CDB-ColorBar.CDB-ColorBar--spaceSmall { .CDB-ColorBar.CDB-ColorBar--spaceSmall {
margin-right: 2px; margin-right: 2px;
border-radius: 2px; border-radius: 2px;
} }
.CDB-ColorBar.CDB-ColorBar--spaceSmall:first-child { .CDB-ColorBar.CDB-ColorBar--spaceSmall:first-child {
border-radius: 6px 3px 3px 6px; border-radius: $baseSize - 2 3px 3px $baseSize - 2;
} }
.CDB-ColorBar.CDB-ColorBar--spaceSmall:last-child { .CDB-ColorBar.CDB-ColorBar--spaceSmall:last-child {
margin-right: 0; margin-right: 0;
border-radius: 3px 6px 6px 3px; border-radius: 3px $baseSize - 2 $baseSize - 2 3px;
} }

View File

@ -118,7 +118,7 @@
box-sizing: content-box; box-sizing: content-box;
&::after { &::after {
padding: 0 6px; padding: 0 $baseSize - 2;
color: $cHintText; color: $cHintText;
content: '·'; content: '·';
} }