DigitalConsumer.ISS/src/styles/common-styles.scss

115 lines
No EOL
2.3 KiB
SCSS

// Common/Global Styles
// Use this file for global styles that don't or won't have their own stylesheet
html,
body {
height: 100%;
}
body {
font-size: 16px;
background-color: #fff;
color: #4d5151;
.container-fluid {
.prevent-squish {
overflow-x: unset;
}
&.fade-on-route-transition {
height: 100vh;
display: flex;
flex-direction: column;
padding: 0 1.5rem;
}
// Set max-width on columns to prevent overly-wide
// components on extra wide screens.
.col-md-6 {
max-width: 472px;
@include media-breakpoint-up(xl) {
max-width: 708px;
}
.col {
max-width: 236px;
&.one-list-card-width {
max-width: 472px;
@include media-breakpoint-up(xl) {
max-width: 66.6666666%;
}
}
}
.shop-question {
.col {
max-width: 472px;
}
}
}
.col-xl-4 {
max-width: 472px;
.col {
max-width: 100%;
}
}
//END set max-width on columns
}
.pointer {
cursor: pointer;
}
.container,
.container-fluid {
overflow-x: hidden;
}
.sub-container {
&.make-tall {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
}
}
.sr-only {
position: absolute;
left: -10000px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
}
.pac-container {
z-index: 10000 !important;
}
div#app:has(~ div#onetrust-consent-sdk div#onetrust-banner-sdk[style]) {
padding-bottom: 3rem;
@include media-breakpoint-up(xl) {
padding-bottom: unset;
}
}
div#app:has(~ div#onetrust-consent-sdk div#onetrust-banner-sdk[style*="display: none"]) {
padding-bottom: 0;
}
}
.modal-open {
.container-fluid {
&.fade-on-route-transition {
overflow: hidden;
height: auto;
}
}
}