Contents

@import "../sadui";

.pretty-dropdown {
    @extend %pretty-dropdown-sm;
    @extend %pretty-dropdown-style-default;
    .pretty-dropdown-label {
        color: $colorWhite;
    }
}

%pretty-dropdown-style-default {
    .pretty-dropdown-layer {
        @include border-radius(0.1em);
        border: 1px solid (darken($colorInactive, 10));
        @include background-image(linear-gradient(top, $colorInactive, $colorActive));
    }

    .pretty-dropdown-menu {
        > ul {
            background-color: $colorInactive;
            @include border-radius(0.1em);
            li {
                &.is-selected {
                    background-color: $colorActive;
                }
            }
        }
    }

    .pretty-dropdown-icon-container {
        border-left: 1px solid (darken($colorInactive, 20));
    }

    &.is-disabled {
        @include opacity(0.2);
    }
}

%pretty-dropdown-sm {
    $dropdownHeight: 1.25em;
    $iconAreaWidth: 1.25em;

    .pretty-dropdown-layer {
        margin-right: $iconAreaWidth;
        > * {
            line-height: $dropdownHeight;
            height: $dropdownHeight;
        }
    }
    .pretty-dropdown-label {
        margin-left: 0.5em;
        margin-right: 0.5em;
    }
    .pretty-dropdown-icon-container {
        width: $iconAreaWidth;
    }
    .pretty-dropdown-menu > li {
        padding-left: 0.5em;
    }

}

%pretty-dropdown-lg {
    $dropdownHeight: 2.5em;
    $iconAreaWidth: 2.5em;

    .pretty-dropdown-layer {
        margin-right: $iconAreaWidth;
        > * {
            line-height: $dropdownHeight;
            height: $dropdownHeight;
        }
    }
    .pretty-dropdown-label {
        margin-left: 1em;
        margin-right: 1em;
    }
    .pretty-dropdown-icon-container {
        width: $iconAreaWidth;
    }
    .pretty-dropdown-menu > li {
        padding-left: 1em;
    }
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
sadui-0.0.4	scss/sadui/themes/_pretty_dropdown.scss