Viewing File: /home/maglabs/it/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-dropdown.less
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// Forms -> Dropdown element
// _____________________________________________
//
// Variables
// _____________________________________________
//
// Utilities
// ---------------------------------------------
.admin__action-dropdown-menu__align(
@_align
) when (@_align = left) {
.admin__action-dropdown-text {
&:after {
left: -(@component__shadow-size__base + 1);
right: 0;
}
}
.admin__action-dropdown-menu {
left: auto;
right: 0;
}
}
.admin__action-dropdown-menu__align(
@_align
) when (@_align = right) {
.admin__action-dropdown-text {
&:after {
left: 0;
right: -(@component__shadow-size__base + 1);
}
}
.admin__action-dropdown-menu {
left: 0;
right: auto;
}
}
.action-dropdown-menu-link-pattern() {
color: @action-dropdown__color;
display: block;
text-decoration: none;
}
//
.admin__action-dropdown-wrap {
.admin__action-dropdown-menu__align(left);
display: inline-block;
position: relative;
&.active,
&._active {
.admin__action-dropdown {
border-color: @action-dropdown__active__border-color;
box-shadow: @component__box-shadow__base;
}
// Dropdown helper to prevent box shadow unnecessary appearing
.admin__action-dropdown-text {
&:after {
background-color: @action-dropdown__background-color;
content: '';
height: @component__shadow-size__base + 1;
position: absolute;
top: 100%;
}
}
.admin__action-dropdown-menu {
display: block;
}
}
&._disabled {
.admin__action-dropdown {
cursor: default;
}
&:hover {
.admin__action-dropdown {
color: @action-dropdown__color;
}
}
}
}
.admin__action-dropdown {
.action-toggle-triangle(
@_dropdown__padding-right: @action-dropdown__padding-right;
);
background-color: @action-dropdown__background-color;
border: 1px solid transparent;
border-bottom: none;
border-radius: 0;
box-shadow: none;
color: @action-dropdown__color;
display: inline-block;
font-size: @action-dropdown__font-size;
font-weight: @font-weight__regular;
letter-spacing: -.025em;
padding: @action-dropdown__padding-top @action-dropdown__padding-right @action-dropdown__padding-bottom @action-dropdown__padding-horizontal;
position: relative;
vertical-align: baseline;
z-index: 2;
&:hover,
&:focus {
background-color: @action-dropdown__background-color;
color: @action-dropdown__hover__color;
text-decoration: none;
}
// Triangle
&:after {
right: @action-dropdown__padding-horizontal;
}
// Icon
&:before {
margin-right: 1rem;
}
}
.admin__action-dropdown-menu {
background-color: @action-dropdown__background-color;
border: 1px solid @action-dropdown__active__border-color;
box-shadow: @component__box-shadow__base;
display: none;
line-height: @line-height__base;
margin-top: -1px;
min-width: 120%;
padding: @action-dropdown-menu__padding-vertical @action-dropdown-menu__padding-horizontal;
position: absolute;
top: 100%;
transition: all @appearing__transition-duration @apperaing__transition-timing-function;
z-index: 1;
> li {
display: block;
> a {
.action-dropdown-menu-link-pattern();
padding: @action-dropdown-menu-link__padding-vertical @action-dropdown-menu-link__padding-horizontal;
}
}
}
// Generic select lists
.selectmenu {
&:extend(.abs-form-control-pattern);
display: inline-block;
padding-left: 1.5rem;
position: relative;
text-align: left;
width: auto;
z-index: 1;
/**
* @codingStandardsIgnoreStart
*/
&:hover {
&:extend(.abs-form-control-pattern:hover);
}
&._focus {
&:extend(.abs-form-control-pattern:focus);
}
&._active {
border-color: @action__active__border-color;
z-index: @action-select__z-index;
}
.action-save,
.action-edit,
.action-delete {
.action-icon();
&:before {
&:extend(.abs-icon all);
content: @icon-delete__content;
}
> span {
&:extend(.abs-visually-hidden all);
}
padding: 0 1rem 0 1rem;
}
.action-edit,
.action-delete {
border: 0 solid @color-white;
border-left-width: 1px;
bottom: 0;
position: absolute;
right: 0;
top: 0;
z-index: 1;
&:hover {
border: 0 solid @color-white;
border-left-width: 1px;
}
}
.action-save:before {
content: @icon-arrow-right__content;
}
.action-edit:before {
content: @icon-edit__content;
}
}
.selectmenu-value {
display: inline-block;
input[type='text'] {
.lib-css(appearance, none, 1);
border: 0;
display: inline;
margin: 0;
width: 6rem;
body._keyfocus &:focus {
box-shadow: none;
}
}
}
.selectmenu-toggle {
.action-toggle-triangle();
background: transparent;
border-width: 0;
bottom: 0;
float: right;
position: absolute;
right: 0;
top: 0;
width: 0;
&:focus,
&:active,
&:hover {
background: transparent;
}
.selectmenu:hover & {
&:before {
&:extend(.abs-form-control-pattern:hover);
}
}
.selectmenu._active &:before {
border-color: @action__active__border-color;
}
.selectmenu._focus &:before {
&:extend(.abs-form-control-pattern:focus);
}
body._keyfocus &:focus {
box-shadow: none;
}
span {
&:extend(.abs-visually-hidden all);
}
&:before {
background: @color-gray89;
border-left: 1px solid @action__border-color;
bottom: 0;
content: '';
display: block;
position: absolute;
right: 0;
top: 0;
width: 3.2rem;
}
}
.selectmenu-items {
background: @action-dropdown__background-color;
border: 1px solid @action__active__border-color;
box-shadow: @component__box-shadow__base;
display: none;
float: left;
left: -1px;
margin-top: 3px;
max-width: 20rem;
min-width: ~'calc(100% + 2px)';
position: absolute;
top: 100%;
&._active {
display: block;
}
ul {
float: left;
list-style-type: none;
margin: 0;
min-width: 100%;
padding: 0;
}
li {
.lib-vendor-prefix-display(flex);
.lib-vendor-prefix-flex-direction(row);
display: flex;
flex-direction: row;
transition: background .2s linear;
&:hover {
background: @action-menu__hover__background-color;
}
&:last-child {
.selectmenu-item-action {
.lib-link();
}
}
}
}
.selectmenu-item {
position: relative;
width: 100%;
z-index: 1;
li._edit > & {
display: none;
}
}
.selectmenu-item-edit {
display: none;
padding: .3rem 4rem .3rem .4rem;
position: relative;
white-space: nowrap;
z-index: 1;
li:last-child & {
padding-right: .4rem;
}
.admin__control-text {
margin: 0;
width: 5.4rem;
}
li._edit & {
display: block;
}
}
.selectmenu-item-action {
.lib-css(appearance, none, 1);
background: transparent;
border: 0;
color: @text__color;
display: block;
font-size: @font-size__base;
font-weight: @font-weight__regular;
min-width: 100%;
padding: 1rem 6rem 1rem 1.5rem;
text-align: left;
transition: background .2s linear;
width: 5rem;
&:hover,
&:focus {
background: @action-menu__hover__background-color;
}
}
Back to Directory
File Manager