90 lines
1.6 KiB
CSS
90 lines
1.6 KiB
CSS
@media screen and (min-width: 40em) {
|
|
.paper--quickview {
|
|
height: 260px;
|
|
width: 580px;
|
|
}
|
|
|
|
.actionsContainer--quickview {
|
|
padding: 0 2rem 2rem 2rem;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 50em) {
|
|
.paper--quickview {
|
|
height: 450px;
|
|
width: 900px;
|
|
}
|
|
}
|
|
|
|
|
|
@media screen and (min-width: 75em) {
|
|
.paper--quickview {
|
|
width: calc(100% - 4rem);
|
|
height: auto;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 82em) {
|
|
.actionsContainer--quickview {
|
|
padding: 0 2.5rem 2.5rem 2.5rem;
|
|
}
|
|
}
|
|
|
|
.paper--quickview {
|
|
min-width: 320px;
|
|
max-width: 96rem;
|
|
}
|
|
|
|
.headerContainer--quickview {
|
|
border: none;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
.actionsContainer--quickview {
|
|
height: 100%;
|
|
width: 100%;
|
|
transition: box-shadow 150ms ease-in-out, border-top 150ms ease-in-out;
|
|
border-top-style: solid;
|
|
border-top-width: 1px;
|
|
border-top-color: transparent;
|
|
box-shadow: -4px 0px 27px -12px transparent;
|
|
}
|
|
|
|
.actionsContentWrapper {
|
|
border-top-width: 1px;
|
|
border-top-style: solid;
|
|
border-top-color: #aaa;
|
|
padding-top: 1.5rem;
|
|
}
|
|
|
|
.contentContainer--quickviewContent {
|
|
padding: 2.5rem 0 2.5rem 2rem;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.triggerContainer--quickview {
|
|
padding: .75rem;
|
|
}
|
|
|
|
.triggerContainer {
|
|
outline: none;
|
|
}
|
|
|
|
.actionsContainer--quickview:not(.actionsContainerEndOfContent--quickview) {
|
|
border-top-color: rgb(238, 238, 238);
|
|
box-shadow: -4px 0px 27px -12px rgba(0,0,0,0.64);
|
|
}
|
|
|
|
.actionsContainer--quickview:not(.actionsContainerEndOfContent--quickview) .actionsContentWrapper {
|
|
border-top-color: transparent;
|
|
}
|
|
|
|
.closeButton {
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
.paper--product-gifts {
|
|
padding: 1.5rem;
|
|
}
|