Dropdown component

This commit is contained in:
Maria Checa 2016-02-09 18:42:52 +01:00
parent 820a4dad42
commit a4878321ad

View File

@ -38,19 +38,19 @@
</ul> </ul>
</div> </div>
<div class="CDB-Dropdown-options"> <div class="CDB-Dropdown-options CDB-Text">
<ul> <ul>
<li class="CDB-Dropdown-optionsElement is-selected"> <li class="CDB-Dropdown-optionsElement is-selected">
<span class="u-iBlock u-lSpace CDB-Text CDB-Size-medium">selected</span> <span class="u-iBlock u-lSpace CDB-Size-medium">selected</span>
</li> </li>
<li class="CDB-Dropdown-optionsElement"> <li class="CDB-Dropdown-optionsElement">
<span class="u-iBlock u-lSpace CDB-Text CDB-Size-medium">active</span> <span class="u-iBlock u-lSpace CDB-Size-medium">active</span>
</li> </li>
<li class="CDB-Dropdown-optionsElement is-disabled"> <li class="CDB-Dropdown-optionsElement is-disabled">
<span class="u-iBlock u-lSpace CDB-Text CDB-Size-medium">disabled</span> <span class="u-iBlock u-lSpace CDB-Size-medium">disabled</span>
</li> </li>
<li class="CDB-Dropdown-optionsElement is-disabled"> <li class="CDB-Dropdown-optionsElement is-disabled">
<span class="u-iBlock u-lSpace CDB-Text CDB-Size-medium">disabled</span> <span class="u-iBlock u-lSpace CDB-Size-medium">disabled</span>
</li> </li>
</ul> </ul>
</div> </div>
@ -59,6 +59,7 @@
``` ```
*/ */
@import '../../cdb-utilities/mixins';
@import '../../cdb-variables/sizes'; @import '../../cdb-variables/sizes';
@import '../../cdb-variables/colors'; @import '../../cdb-variables/colors';
@ -67,10 +68,11 @@
height: 250px; height: 250px;
} }
.CDB-Dropdown { .CDB-Dropdown {
@include display-flex();
@include flex-direction(row);
height: 200px; height: 200px;
position: absolute; position: absolute;
top: 40px; top: 40px;
font-size: 0;
} }
.CDB-Dropdown-calculations { .CDB-Dropdown-calculations {
display: inline-block; display: inline-block;