diff --git a/src/assets/styles/scss/partials/01-Abstract/_settings.scss b/src/assets/styles/scss/partials/01-Abstract/_settings.scss index b1f62eb..2ef205d 100644 --- a/src/assets/styles/scss/partials/01-Abstract/_settings.scss +++ b/src/assets/styles/scss/partials/01-Abstract/_settings.scss @@ -12,12 +12,14 @@ /// 62rem * 16px = 992px; not in use yet /// 64rem * 16px = 1024px; /// 80rem * 16px = 1280px; +/// 90rem * 16px = 1440px $breakpoints: ( - "xs": 36em, - "sm": 48em, - "md": 60em, - "lg": 64em, - "xl": 80em, + "xs": 36em, + "sm": 48em, + "md": 60em, + "lg": 64em, + "xl": 80em, + "xxl": 90em, ) !default; // Palette generated with --> diff --git a/src/assets/styles/scss/partials/02-Generic/_common.scss b/src/assets/styles/scss/partials/02-Generic/_common.scss index d1b2abb..9274031 100644 --- a/src/assets/styles/scss/partials/02-Generic/_common.scss +++ b/src/assets/styles/scss/partials/02-Generic/_common.scss @@ -84,6 +84,9 @@ background-image: url("/assets/images/mesh-gradient-black.webp"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } } @@ -92,4 +95,7 @@ background-image: url("/assets/images/mesh-gradient-black.jpg"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } diff --git a/src/assets/styles/scss/partials/05-Templates/_home-tmpl.scss b/src/assets/styles/scss/partials/05-Templates/_home-tmpl.scss index acfbeb1..e4e4db0 100644 --- a/src/assets/styles/scss/partials/05-Templates/_home-tmpl.scss +++ b/src/assets/styles/scss/partials/05-Templates/_home-tmpl.scss @@ -14,6 +14,9 @@ background-image: url("/assets/images/mesh-gradient-white.webp"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } /*! purgecss ignore */ @@ -21,4 +24,7 @@ background-image: url("/assets/images/mesh-gradient-white.jpg"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } diff --git a/src/assets/styles/scss/partials/08-MQ/_dark-theme.scss b/src/assets/styles/scss/partials/08-MQ/_dark-theme.scss index 6b06bf2..ad769e1 100644 --- a/src/assets/styles/scss/partials/08-MQ/_dark-theme.scss +++ b/src/assets/styles/scss/partials/08-MQ/_dark-theme.scss @@ -41,6 +41,9 @@ background-image: url("/assets/images/mesh-gradient-black.webp"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } /*! purgecss ignore */ @@ -48,6 +51,9 @@ background-image: url("/assets/images/mesh-gradient-black.jpg"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } .light-theme { @@ -92,6 +98,9 @@ background-image: url("/assets/images/mesh-gradient-white.webp"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } /*! purgecss ignore */ @@ -99,5 +108,8 @@ background-image: url("/assets/images/mesh-gradient-white.jpg"); background-repeat: no-repeat; background-size: contain; + @include media-query(xxl) { + background-size: cover; + } } }