Viewing File: /home/maglabs/it/app/design/frontend/Magento/luma/Magento_GiftWrapping/web/css/source/_module.less
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// Variables
// _____________________________________________
@gift-wrapping__border-color: @color-gray-light5;
@gift-wrapping__border-width: @border-width__base;
@gift-wrapping-preview__active__border-color: @color-gray20;
@gift-wrapping-preview__active__border-width: 3px;
@gift-wrapping-thumbnail__height: 4rem;
@gift-wrapping-thumbnail__width: @gift-wrapping-thumbnail__height;
@gift-wrapping-no-image__background: @color-gray95;
@gift-wrapping-no-image-icon__color: @color-gray-darken4;
@gift-wrapping-no-image-icon__font-size: 22px;
//
// Common
// _____________________________________________
& when (@media-common = true) {
.gift-wrapping {
.label {
.lib-css(margin, @form-field-type-label-block__margin);
display: inline-block;
}
.field {
margin-bottom: @indent__s;
}
}
.gift-wrapping-info {
.lib-css(font-weight, @font-weight__light);
font-size: @font-size__l;
margin: @indent__base 0;
}
.gift-wrapping-list {
&:extend(.abs-add-clearfix all);
list-style: none;
margin: @indent__base 0 @indent__s;
padding: 0;
.no-image {
.lib-css(background, @gift-wrapping-no-image__background);
.lib-icon-font(
@icon-present,
@_icon-font-size: @gift-wrapping-no-image-icon__font-size,
@_icon-font-line-height: @gift-wrapping-thumbnail__height,
@_icon-font-color: @gift-wrapping-no-image-icon__color,
@_icon-font-position: after,
@_icon-font-text-hide: true,
@_icon-font-vertical-align: middle
);
&:after {
display: block;
}
}
}
.gift-wrapping-preview,
.gift-wrapping-item > span {
cursor: pointer;
display: block;
overflow: hidden;
position: relative;
z-index: 1;
}
.gift-wrapping-item {
float: left;
margin: 0 @indent__s @indent__s 0;
&:last-child {
margin-right: 0;
}
&._active {
span {
&:before {
.lib-css(border, @gift-wrapping-preview__active__border-width solid @gift-wrapping-preview__active__border-color);
box-sizing: border-box;
content: '';
display: block;
height: 100%;
position: absolute;
width: 100%;
z-index: 2;
}
}
}
> span {
height: @gift-wrapping-thumbnail__height;
width: @gift-wrapping-thumbnail__width;
}
}
.gift-wrapping-title {
margin: @indent__s 0;
.action-remove {
&:extend(.abs-action-button-as-link all);
margin: -@indent__xs 0 0 @indent__xs;
.lib-icon-font(
@icon-trash,
@_icon-font-size: 18px,
@_icon-font-line-height: 20px,
@_icon-font-text-hide: true,
@_icon-font-color: @minicart-icons-color,
@_icon-font-color-hover: @primary__color,
@_icon-font-color-active: @minicart-icons-color
);
}
}
.gift-options-content {
.fieldset {
.field {
margin: @indent__s 0;
}
}
}
.gift-wrapping-summary {
padding-right: 7rem;
.gift-wrapping-title {
border: 0;
display: inline-block;
padding: 0;
}
}
.opc-wrapper {
.fieldset {
&.gift-message {
.field {
&.gift-wrapping {
padding: 0;
width: 100%;
}
}
}
}
}
.opc-wrapper .data.table,
.table-order-items {
.gift-wrapping {
margin: @indent__base 0 0;
.title {
float: none;
}
.content {
&:extend(.abs-add-clearfix all);
margin: 0;
> img {
float: left;
margin: 0 @indent__s 0 0;
max-height: 50px;
max-width: 50px;
}
}
}
}
.gift-summary,
.gift-options {
&:extend(.abs-adjustment-incl-excl-tax all);
.price-box {
margin-left: 22px;
}
.regular-price {
&:before {
content: attr(data-label)': ';
}
.price {
font-weight: @font-weight__bold;
}
}
}
//
// Multiple Shipping Checkout
// ---------------------------------------------
.order-options {
.item {
padding-bottom: @indent__base;
}
.product {
&:extend(.abs-add-clearfix all);
margin-bottom: @indent__s;
}
.product-image-container {
float: left;
padding-right: @indent__s;
}
.gift-wrapping {
margin-bottom: @indent__s;
}
}
}
//
// Mobile
// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.gift-options-cart-item,
.cart-gift-item {
.gift-wrapping {
.lib-css(border-bottom, @gift-wrapping__border-width solid @gift-wrapping__border-color);
margin-bottom: @indent__base;
padding-bottom: @indent__s;
}
}
.gift-wrapping-list {
width: 100%;
}
.gift-wrapping-summary {
+ .gift-message-summary {
padding-right: 0;
}
}
.gift-options-cart-item {
float: left;
width: 100%;
}
.gift-wrapping-preview {
img {
width: 100%;
}
}
.item-actions {
.actions-toolbar {
.gift-options {
.gift-wrapping,
.gift-message {
display: block;
}
}
}
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.data.table {
.gift-wrapping {
.nested,
.content {
&:extend(.abs-add-clearfix-desktop all);
}
}
}
}
//
// Desktop
// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.gift-options-cart-item,
.cart-gift-item {
.gift-wrapping {
box-sizing: border-box;
float: left;
padding-right: @indent__base;
width: 50%;
& + .gift-message {
.lib-css(border-left, @gift-wrapping__border-width solid @gift-wrapping__border-color);
box-sizing: border-box;
float: left;
padding-left: 4.5rem;
width: 50%;
}
}
.gift-summary {
.regular-price {
white-space: nowrap;
}
}
.gift-wrapping-name {
padding-right: @indent__base;
}
}
//
// Multiple Shipping Checkout
// ---------------------------------------------
.order-options,
.table-order-review {
.gift-wrapping {
max-width: 50%;
}
}
}
Back to Directory
File Manager