| Current Path : /home/rtorresani/www/vendor/magento/theme-adminhtml-backend/web/css/source/forms/ |
| Current File : //home/rtorresani/www/vendor/magento/theme-adminhtml-backend/web/css/source/forms/_temp.less |
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// Admin section wrapper title @todo ui - find the right place
// _____________________________________________
.fieldset-wrapper-title,
.admin__fieldset-wrapper-title {
&:extend(.abs-clearfix all);
border-bottom: 1px solid @color-gray80;
line-height: 1.4;
margin-bottom: 0;
padding: 14px 0 16px;
.title {
font-size: 2rem;
font-weight: 400;
.admin__fieldset-wrapper-content & {
font-size: 1.5rem;
font-weight: 700;
}
&.active {
~ .actions {
display: none;
}
}
}
.actions {
display: block;
float: right;
}
}
.admin__fieldset-wrapper-content {
.admin__fieldset {
padding-bottom: 3rem;
padding-top: 3rem;
> .admin__collapsible-block-wrapper {
&:first-child {
margin-top: -3rem;
}
}
> *:first-child {
margin-top: 0;
}
> *:last-child {
margin-bottom: 0;
}
}
}
// @todo ui Move to other place - will be done in upcoming task 'Address Tabs':
.address-item-edit-content {
background: @color-white;
border: 1px solid @color-gray-brown;
box-shadow: 0 2px 1px 0 rgba(217, 210, 202, .5);
margin-left: 359px;
max-width: 500px;
padding: 15px 30px;
.admin__field {
&:extend(.abs-field-rows all);
}
.admin__legend {
display: none;
}
}
.address-list {
float: left;
list-style-type: none;
margin: 0;
padding: 0;
width: 360px;
.address-list-item-actions {
position: absolute;
right: 1rem;
top: 1rem;
}
.address-list-item {
background: @color-white-fog2;
border: 1px solid @color-gray-brown;
cursor: pointer;
margin-bottom: -1px;
padding: 10px 10px 15px;
position: relative;
z-index: 1;
&.ui-state-active {
background: @color-white;
box-shadow: 0 1px 1px 0 rgba(217, 210, 202, 1);
margin-left: -2px;
padding-left: 12px;
position: relative;
z-index: 2;
&:before,
&:after {
color: @color-white;
content: '\e02a';
font-family: 'MUI-Icons';
font-size: 18px;
font-style: normal;
font-weight: normal;
line-height: 11px;
margin-top: -5px;
position: absolute;
right: -9px;
speak: none;
text-indent: -6px;
top: 50%;
width: 10px;
z-index: 2;
}
&:before {
color: @color-gray-brown;
right: -11px;
z-index: 1;
}
}
}
address {
font-style: normal;
line-height: 1.5;
margin: 0 20px 15px 0;
&:first-line {
// It does not work if First Name and Last Name are arranged in two lines
font-weight: bold;
}
}
.address-list-actions {
background: none;
border: 0;
box-shadow: none;
cursor: default;
padding: 20px 0 0;
}
.action-delete {
.lib-button-reset();
.lib-icon-font(
@icon-remove-small__content,
@icons-admin__font-name,
@_icon-font-size: 1.6rem,
@_icon-font-line-height: 16px,
@_icon-font-text-hide: true,
@_icon-font-position: after,
@_icon-font-color: @color-brown-darker
);
span {
max-height: 1px;
max-width: 1px;
}
&:hover {
position: relative;
z-index: 2;
&:after {
color: darken(@color-brown-darker, 20%);
}
// @Todo ui - testing solution to show action hint without title attribute
span {
background-color: @color-very-light-gray;
border: 1px solid @color-heathered-grey;
border-radius: .4rem;
bottom: 100%;
clip: auto;
font-size: @font-size__s;
height: auto;
left: auto;
margin: 0 auto .1rem;
max-height: 50px;
max-width: 200px;
padding: .5rem;
right: auto;
top: auto;
transition: all .01s linear .7s;
white-space: nowrap;
width: auto;
}
}
}
}
//
// Login page form errors @todo ui - remove after validation consistency
// _____________________________________________
[class*='admin__control-'].mage-error ~ [class*='admin__addon-']:before,
.admin__field-control > [class*='admin__control-'].mage-error {
border-color: @field-error-control__border-color;
}
label.mage-error {
&:extend(.admin__field-error);
}
//
// Login page captcha reload @todo ui - remove after loader consistency
// _____________________________________________
.page-layout-admin-login {
.loading-mask {
background: rgba(255,255,255,.2);
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: @z-index-10;
}
.popup-loading {
height: 149px;
left: 50%;
margin-left: -218px/2;
margin-top: -149px/2;
overflow: hidden;
position: absolute;
top: 50%;
width: 218px;
}
}
//
// Login page captcha field @todo ui - Create new captcha markup - Change reload button
// _____________________________________________
.page-layout-admin-login {
.field-captcha {
padding-left: 30px;
vertical-align: middle;
.captcha-reload {
float: right;
margin-top: 15px;
}
}
}
//
// Form loader @todo ui - remove after loader consistency
// _____________________________________________
.admin__form-loading-mask {
background: rgba(255, 255, 255, .5);
bottom: 0;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: @loader-overlay__z-index;
.spinner {
font-size: @data-grid-spinner__size;
left: 50%;
margin-left: -(@data-grid-spinner__size / 2);
margin-top: -(@data-grid-spinner__size / 2);
position: absolute;
top: 50%;
}
}
//
// Selectbox in calendar @todo ui - Remove after default select styles set
// _____________________________________________
.ui-datepicker .ui-datepicker-title select {
&:extend(.admin__control-select all);
}
//
// Data grid
// _____________________________________________
.data-grid {
.head-massaction {
.admin__control-select {
min-width: 6rem;
}
}
.data-grid-filters {
td {
border-bottom: 1px solid @color-gray84;
padding: 1rem;
}
select,
input[type='text'] {
font-size: 1.3rem;
height: 2.8rem;
min-width: 5rem;
padding: .2rem .4rem;
width: 100%;
}
.admin__control-text {
width: 100%;
}
select {
background-position+: ~'calc(100% - 5px)' -37px;
background-size+: auto;
background-position+: 100%;
background-size+: 18px 100%;
background-position+: ~'calc(100% - 18px)' 0;
background-size+: 1px 100%;
height: 2.8rem;
padding: .2rem 1.8rem .2rem .3rem;
&:focus {
background-position+: ~'calc(100% - 5px)' 11px;
background-position+: 100%;
background-position+: ~'calc(100% - 18px)' 0;
}
}
td {
._has-datepicker {
+ .ui-datepicker-trigger {
height: 2.8rem;
margin-left: -3.2rem;
width: 2.8rem;
&:after {
line-height: 28px;
}
}
}
}
}
.range-line {
position: relative;
+ .range-line {
margin-top: .5rem;
}
}
.col-qty {
.admin__control-text {
&:extend(.abs-control-qty all);
}
}
.field-row {
display: inline-block;
}
}
.mass-select-info {
&:before {
content: '(';
}
&:after {
content: ')';
}
&._empty {
display: none;
}
}
.mass-select-wrap {
margin-left: 1.1rem;
margin-top: 3.3rem;
position: absolute;
top: 100%;
select {
cursor: pointer;
height: 22px;
left: 0;
opacity: .01;
position: absolute;
top: 0;
width: 22px;
z-index: 2;
+ label {
&:extend(.abs-action-default);
height: 16px;
line-height: 16px;
padding: 0;
width: 16px;
z-index: 1;
/**
* @codingStandardsIgnoreStart
*/
&:before {
&:extend(.admin__control-checkbox + label:before);
left: 0;
position: absolute;
top: 0;
}
&:after {
&:extend(.action-multicheck-wrap .action-multicheck-toggle:after);
top: 40% !important;
}
}
&:focus {
+ label {
&:after {
&:extend(.action-multicheck-wrap .action-multicheck-toggle._active:after);
}
}
}
&._checked {
+ label {
&:before {
&:extend(.admin__control-checkbox:checked + label:before);
}
// @codingStandardsIgnoreEnd
}
&._indeterminate {
+ label {
&:before {
content: '-';
font-size: 2rem;
line-height: .7rem;
}
}
}
}
&._disabled {
display: none;
+ label {
cursor: not-allowed;
opacity: .6;
}
}
}
}
.admin__data-grid-toolbar {
*,
*:before,
*:after {
box-sizing: border-box;
}
.admin__data-grid-header-row {
.action-select-multiselect {
-webkit-appearance: menulist-button;
appearance: menulist-button;
height: 38px;
left: -1rem;
min-width: 0;
opacity: .01;
top: -1.2rem;
width: 52px;
}
> div {
margin-left: @temp_gutter;
&:first-child {
margin-left: 0;
}
}
button {
vertical-align: top;
}
}
.admin__filter-actions {
float: left;
}
.admin__control-filter {
.admin__control-select {
margin-right: @action__outer-indent;
}
}
.admin__data-grid-export {
float: right;
.admin__control-select {
margin-right: @action__outer-indent;
}
}
.admin__grid-massaction {
float: left;
.admin__control-select {
margin-right: @action__outer-indent;
}
+ .admin__control-text {
float: left;
}
.form-inline {
display: inline;
.admin__field-label {
float: none;
padding-left: 2rem;
padding-right: 1rem;
width: auto;
}
}
.admin__grid-massaction-form {
.admin__control-select {
~ button {
display: none;
}
&._selected {
~ button {
display: inline-block;
}
}
}
}
.admin__control-select-placeholder {
color: @color-darker-gray;
font-weight: @font-weight__bold;
}
}
.admin__data-grid-pager-wrap {
float: right;
}
.admin__data-grid-header-row {
&._massaction {
position: relative;
z-index: 1;
}
}
}
//
// Tablets
// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__l) {
.admin__data-grid-toolbar {
.admin__data-grid-header-row {
.admin__filter-actions {
float: none;
margin-bottom: @indent__base;
}
}
.admin__data-grid-header-row {
.admin__control-support-text {
margin-left: 0;
}
}
}
}
.admin__grid-control {
.admin__grid-control {
display: none;
}
}
.ui-dialog {
.admin__data-grid-header-row._massaction,
.mass-select-wrap select,
.mass-select-wrap,
.admin__grid-massaction {
z-index: 2000;
}
.admin__data-grid-wrap {
z-index: 1999;
}
}
.data-grid {
td.col-action {
a + a {
&:before {
content: '';
display: block;
}
}
}
}
//
// Popups
// _____________________________________________
.attribute-popup {
background-color: @color-white;
.edit-form {
padding-left: 1.8rem;
padding-right: 1.8rem;
}
}
.product-configure-popup {
.time-picker {
display: block;
margin-top: 1rem;
}
}