ttrss/lib/flat-ttrss/dijit/form/Select.styl

164 lines
3.1 KiB
Stylus
Raw Normal View History

2018-12-04 19:24:31 +00:00
/* Select | Combobox
* And minor style for DateTextBox | MultiSelect
*
* Styling Select mainly includes:
*
* 1. Containers
* Select:
* .dijitSelect
* .dijitButtonContents
* Combobox:
* .dijitComboBox
*
* 2. Arrow Button
* .dijitArrowButton
* .dijitArrowButtonInner
* .dijitComboBox .dijitButtonNode
*
* 3. Menu
* .dijitSelectMenu
*
* 4. States - Hover, Active, Focused, Disabled, e.g.
*
* Select: Hover, Active, Focused, Disabled
* .dijitSelectHover
* .dijitSelectFocused
* .dijitSelectDisabled
*
* Combobox: Hover, Focused (Open), Disabled
* .dijitComboBox .dijitDownArrowButtonHover
* .dijitComboBoxOpenHover .dijitButtonNode
* .dijitComboBoxDisabled .dijitButtonNode
*
*/
@import 'dijit_form_variables';
.{$theme-name} {
/* arrows */
.dijitSelect,
.dijitComboBox {
.dijitArrowButtonInner {
margin: 0;
width:0;
height: 0;
}
}
/* ----- Select ----- */
.dijitSelect {
button-style();
table-layout: fixed;
.dijitButtonContents,
.dijitArrowButton {
line-height: 20px;
padding: $button-padding;
border: 0;
border-radius: 0 $select-button-border-radius $select-button-border-radius 0;
}
.dijitButtonContents {
padding:0;
overflow: hidden;
text-overflow: ellipsis;
border-radius: $select-button-border-radius 0 0 $select-button-border-radius;
}
.dijitInputField {
padding: 0 0 0 $input-padding*3;
}
.dijitArrowButton {
width: $button-arrow-width;
padding: $button-arrow-padding;
}
}
/* hover */
.dijitSelectHover {
button-hover-style();
}
.dijitSelectActive {
button-active-style();
}
/* focused */
.dijitSelectFocused {
border: $select-focus-border;
}
/* disabled */
.dijitSelectDisabled {
button-disabled-style();
}
/* ----- Combobox ----- */
.dijitComboBox .dijitButtonNode {
button-style();
border-radius: 0 $select-button-border-radius $select-button-border-radius 0;
}
/* hover */
.dijitComboBoxOpenHover .dijitButtonNode,
.dijitComboBox .dijitDownArrowButtonHover {
button-hover-style();
box-shadow: none;
}
/* disabled */
.dijitComboBoxDisabled .dijitButtonNode {
button-disabled-style();
}
.dijitComboBox .dijitArrowButton {
width: $button-arrow-width;
padding: $button-arrow-padding;
}
// remove arrow when wrapped in a toolbar dijit
.dijitToolbar .dijitComboBox .dijitArrowButtonInner {
border: none;
}
/* ----- DateTextBox ----- */
.dijitDateTextBox .dijitArrowButton:before {
content: $select-date-icon;
}
/* ----- TimeTextBox ----- */
.dijitTimeTextBox .dijitArrowButton:before {
content: $select-time-icon;
}
/* ----- Multiple Select ----- */
select {
padding: $input-padding 0;
border: 1px solid $input-border-color;
box-shadow: $shadow-depth1;
}
select option {
padding: $input-padding $input-padding * 2;
}
/* Dropdown menu styles for "Select"
* Most of menu styles are defined in Menu.styl
*/
.dijitSelectMenu td.dijitMenuItemIconCell,
.dijitSelectMenu td.dijitMenuArrowCell {
/* so that arrow and icon cells from MenuItem are not displayed */
display: none;
}
}