Dropdown


Кнопка, объединяющая несколько действий. По нажатию на неё появляется выпадающий список действий, само действие совершается при выборе из списка. Вид меню такой же, как у выпадающего списка.

Такая кнопка может выступать как фильтр. В этом случае пользователь может выбрать несколько пунктов в пыпадающем меню (для этого используются чекбоксы). Пункты меню могут быть отмечены иконкой справа (например, цвет линии метро).

Простая кнопка
Спецификации
Состояние Параметр Значение
normal
/* Основные свойства наследуются от стандартной кнопки */
padding: $paddingControlVertical $paddingControlMore $paddingControlVertical $paddingControl;
/* указать отступ от иконки */
/* Выпадающий список */
padding: $paddingMenu;
margin-top: $marginMenu;
box-shadow: $depth2;
/* Строка выпадающего списка */
height: $sizeControlHeight;
padding: 0 $paddingControl;
background-color: $colorBg;
 
0 8px 0 16px
 
 
8px 0
1px 0 0 0
0 4px 20px 0 rgba(0,0,0,.16)
 
32px
0 12px
#ffffff
hover
/* Основные свойства наследуются от стандартной кнопки */
/* Строка выпадающего списка */
@include standardHover ($colorBgSecondary);
 
 
 
active
/* Основные свойства наследуются от стандартной кнопки */
/* прописать анимацию переворачивания иконки */
/* Строка выпадающего списка */
@include standardActive ($colorBgSecondary);
 
 
 
 
disabled opacity: .48;