scinote-web/app/assets/stylesheets/shared_styles/elements/dropdown.scss

129 lines
2.3 KiB
SCSS
Raw Normal View History

// scss-lint:disable SelectorDepth, NestingDepth, ImportantRule
@import "constants";
.dropdown-menu .divider {
margin: 5px 0;
}
2020-05-08 23:01:55 +08:00
.sci-dropdown {
[data-toggle="dropdown"] {
2020-07-28 21:39:29 +08:00
.caret {
margin: 8px 0 8px 8px;
}
2020-05-08 23:01:55 +08:00
}
&.open {
[data-toggle="dropdown"] {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-color: $brand-focus;
.caret {
2020-07-14 17:24:33 +08:00
transform: rotateX(180deg);
2020-05-08 23:01:55 +08:00
}
}
.dropdown-menu {
2020-07-28 21:39:29 +08:00
@include font-button;
2020-05-08 23:01:55 +08:00
border-top-left-radius: 0;
border-top-right-radius: 0;
box-shadow: $flyout-shadow;
margin-top: -1px;
width: 100%;
li:hover {
background: $color-concrete;
}
}
}
}
.dropdown-menu {
2023-04-06 19:02:34 +08:00
@include font-button;
.form-dropdown-break hr {
margin: 0;
}
.form-dropdown-item {
padding: 0 !important;
2021-06-18 20:19:35 +08:00
button,
.form-dropdown-item-info {
border-radius: 0;
padding-left: .9em;
text-align: left;
width: 100%;
}
button {
color: $color-black !important;
}
.text-light {
color: $color-white;
}
.form-dropdown-item-info {
color: $color-silver-chalice !important;
border-top: 1px solid $color-concrete;
padding-top: .3em;
}
&:only-child .form-dropdown-item-info {
border-top: 0;
padding-top: 0;
}
.project-archive-restore-form {
.button-to {
&:hover {
background-color: $color-dd-hover !important;
}
}
}
.change-projects-view-type-form,
.change-experiments-view-type-form,
.change-my-modules-view-type-form {
.button-to {
float: unset !important;
height: 48px;
margin: 0;
&:active {
background-color: inherit;
}
2020-05-08 23:01:55 +08:00
&.selected::after {
@include font-awesome;
content: $font-fas-check;
float: right;
}
}
}
}
.form-dropdown-state-item {
background: $brand-primary;
border: 1px solid $brand-primary;
color: $color-white;
&:hover {
background: $brand-primary-hover !important;
color: $color-white;
}
&:active,
&.active {
background: $brand-primary-press;
color: $color-white;
}
&:focus {
box-shadow: 0 0 0 1px $brand-complementary;
color: $color-white;
}
}
2020-05-08 23:01:55 +08:00
}