mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
3532a71c29
This adds documentation for loading, menu, picker, popover, radio, refresher, select, and toast. Also removes unused variables. References #8785
92 lines
2.3 KiB
SCSS
92 lines
2.3 KiB
SCSS
@import "../../themes/ionic.globals.wp";
|
|
|
|
// Windows Select
|
|
// --------------------------------------------------
|
|
|
|
/// @prop - Padding top and bottom of the select
|
|
$select-wp-padding-vertical: 0 !default;
|
|
|
|
/// @prop - Padding left and right of the select
|
|
$select-wp-padding-horizontal: ($item-wp-padding-right / 2) !default;
|
|
|
|
/// @prop - Margin top of the select
|
|
$select-wp-margin-top: $item-wp-padding-top !default;
|
|
|
|
/// @prop - Margin right of the select
|
|
$select-wp-margin-right: ($item-wp-padding-right / 2) !default;
|
|
|
|
/// @prop - Margin bottom of the select
|
|
$select-wp-margin-bottom: $item-wp-padding-bottom !default;
|
|
|
|
/// @prop - Margin left of the select
|
|
$select-wp-margin-left: ($item-wp-padding-left / 2) !default;
|
|
|
|
/// @prop - Border width of the select
|
|
$select-wp-border-width: 2px !default;
|
|
|
|
/// @prop - Border color of the select
|
|
$select-wp-border-color: $input-wp-border-color !default;
|
|
|
|
/// @prop - Width of the select icon
|
|
$select-wp-icon-width: 18px !default;
|
|
|
|
/// @prop - Width of the select icon arrow
|
|
$select-wp-icon-arrow-width: 2px !default;
|
|
|
|
/// @prop - Color of the select icon
|
|
$select-wp-icon-color: $select-wp-border-color !default;
|
|
|
|
/// @prop - Color of the select placeholder
|
|
$select-wp-placeholder-color: $select-wp-icon-color !default;
|
|
|
|
|
|
.select-wp {
|
|
flex: 1;
|
|
|
|
margin: $select-wp-margin-top $select-wp-margin-right $select-wp-margin-bottom $select-wp-margin-left;
|
|
padding: $select-wp-padding-vertical $select-wp-padding-horizontal;
|
|
|
|
max-width: 100%;
|
|
|
|
border: $select-wp-border-width solid $select-wp-border-color;
|
|
line-height: 3rem;
|
|
}
|
|
|
|
.select-wp .select-placeholder {
|
|
color: $select-wp-placeholder-color;
|
|
}
|
|
|
|
.item-wp.item-select ion-label {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.select-wp .select-icon {
|
|
position: relative;
|
|
|
|
align-self: center;
|
|
|
|
width: $select-wp-icon-width;
|
|
height: $select-wp-icon-width;
|
|
}
|
|
|
|
.select-wp .select-icon .select-icon-inner {
|
|
position: absolute;
|
|
top: 3px;
|
|
left: 5px;
|
|
display: block;
|
|
|
|
width: ($select-wp-icon-width / 2);
|
|
height: ($select-wp-icon-width / 2);
|
|
|
|
border-top: $select-wp-icon-arrow-width solid $select-wp-icon-color;
|
|
border-right: $select-wp-icon-arrow-width solid $select-wp-icon-color;
|
|
|
|
transform: rotate(135deg);
|
|
|
|
pointer-events: none;
|
|
}
|
|
|
|
.select-wp .select-text {
|
|
min-height: 3rem;
|
|
}
|