Archive: Namaste PHP AMQP framework v1.0 (2017-2020)
952 days continuous production uptime, 40k+ tp/s single node. Original corpo Bitbucket history not included — clean archive commit.
This commit is contained in:
222
html/scss/pro/_material-select.scss
Executable file
222
html/scss/pro/_material-select.scss
Executable file
@@ -0,0 +1,222 @@
|
||||
// Material selct
|
||||
%user-select-none {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.select-label {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.select-wrapper {
|
||||
position: relative;
|
||||
input {
|
||||
&.select-dropdown {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
border-bottom: 1px solid $input-border-color;
|
||||
outline: none;
|
||||
height: $material-select-wrapper-input-dropdown-height;
|
||||
line-height: $material-select-wrapper-input-dropdown-line-height;
|
||||
width: 100%;
|
||||
font-size: $material-select-wrapper-input-dropdown-font-size;
|
||||
margin: 0 0 $material-select-wrapper-input-dropdown-margin 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
&:disabled {
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
border-bottom-color: $material-select-wrapper-input-dropdown-disabled-border-bottom-color;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
.select-dropdown {
|
||||
@extend %user-select-none;
|
||||
}
|
||||
.search-wrap {
|
||||
padding: $material-select-wrapper-search-wrap-py 0;
|
||||
display: block;
|
||||
margin: 0 $material-select-wrapper-search-wrap-mx;
|
||||
.md-form {
|
||||
margin-top: 0;
|
||||
input {
|
||||
padding-bottom: $material-select-wrapper-search-wrap-input-pb;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
span.caret {
|
||||
color: initial;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: $material-select-wrapper-span-caret-top;
|
||||
font-size: $material-select-wrapper-span-caret-font-size;
|
||||
&.disabled {
|
||||
color: $input-disabled-color;
|
||||
}
|
||||
}
|
||||
& + label {
|
||||
position: absolute;
|
||||
top: $material-select-wrapper-span-caret-label-top;
|
||||
font-size: $label-font-size;
|
||||
}
|
||||
i {
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
select {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
display: none !important;
|
||||
&.browser-default {
|
||||
display: block !important;
|
||||
}
|
||||
&:disabled {
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
}
|
||||
}
|
||||
|
||||
.select-dropdown {
|
||||
[type=checkbox]:disabled:not(:checked)+label:before {
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
img {
|
||||
height: $dropdown-item-height - 10;
|
||||
width: $dropdown-item-height - 10;
|
||||
margin: $material-select-dropdown-li-img-my $material-select-dropdown-li-img-mx;
|
||||
float: right;
|
||||
}
|
||||
&.disabled, &.disabled > span, &.optgroup {
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
background-color: transparent!important;
|
||||
cursor: context-menu;
|
||||
}
|
||||
&.optgroup {
|
||||
border-top: 1px solid $dropdown-hover-bg-color;
|
||||
&.selected > span {
|
||||
color: $material-select-dropdown-li-optgroup-selected-span;
|
||||
}
|
||||
& > span {
|
||||
color: $material-select-dropdown-li-optgroup-span;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.multiple-select-dropdown li [type="checkbox"] + label {
|
||||
height: $material-select-multiple-select-dropdown-height;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
box-shadow: $z-depth-1;
|
||||
background-color: $dropdown-bg-color;
|
||||
margin: 0;
|
||||
display: none;
|
||||
min-width: $material-select-dropdown-content-min-width;
|
||||
max-height: $material-select-dropdown-content-max-height;
|
||||
overflow-y: auto;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
will-change: width, height;
|
||||
li {
|
||||
clear: both;
|
||||
color: $material-select-dropdown-content-li-color;
|
||||
cursor: pointer;
|
||||
line-height: $material-select-dropdown-content-li-line-height;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
text-transform: none;
|
||||
&:hover,
|
||||
&.active {
|
||||
background-color: $dropdown-hover-bg-color;
|
||||
}
|
||||
& > a,
|
||||
& > span {
|
||||
font-size: $material-select-dropdown-content-li-span-font-size;
|
||||
color: $dropdown-color;
|
||||
display: block;
|
||||
padding: $material-select-dropdown-content-li-span-padding;
|
||||
}
|
||||
// Icon alignment override
|
||||
& > a > i {
|
||||
height: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Material select color variations
|
||||
.colorful-select {
|
||||
.dropdown-content {
|
||||
padding: $material-select-colorful-dropdown-content-padding;
|
||||
li {
|
||||
&.active span {
|
||||
color: $material-select-colorful-dropdown-content-li-active-color !important;
|
||||
box-shadow: $z-depth-1-half;
|
||||
[type="checkbox"]:checked + label:before {
|
||||
border-color: transparent $white $white transparent;
|
||||
}
|
||||
}
|
||||
a:hover, span:hover {
|
||||
box-shadow: $z-depth-2;
|
||||
color: $material-select-colorful-dropdown-content-li-active-color !important;
|
||||
transition: $material-select-colorful-dropdown-content-li-hover-transition;
|
||||
border-radius: $material-select-colorful-dropdown-content-li-hover-border-radius;
|
||||
[type="checkbox"] + label:before {
|
||||
border-color: $white-base;
|
||||
}
|
||||
[type="checkbox"]:checked + label:before {
|
||||
border-color: transparent $white $white transparent;
|
||||
}
|
||||
}
|
||||
optgroup {
|
||||
}
|
||||
&.disabled,
|
||||
&:disabled,
|
||||
&.optgroup {
|
||||
&.active span {
|
||||
box-shadow: none;
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color !important;
|
||||
border-bottom-color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
cursor: default;
|
||||
}
|
||||
a:hover, span:hover {
|
||||
box-shadow: none;
|
||||
color: $material-select-wrapper-input-dropdown-disabled-color !important;
|
||||
border-bottom-color: $material-select-wrapper-input-dropdown-disabled-color;
|
||||
cursor: default;
|
||||
background-color: $white !important;
|
||||
}
|
||||
label {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@each $type, $color in $dropdown-colors {
|
||||
.dropdown-#{$type} {
|
||||
.dropdown-content li {
|
||||
&.active, a, span:hover {
|
||||
background-color: $color !important;
|
||||
}
|
||||
}
|
||||
.search-wrap input:focus {
|
||||
border-bottom: 1px solid $color;
|
||||
box-shadow: 0 1px 0 0 $color;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user