From 7f7d0aacc61c69034f2e55291740115a21d1a962 Mon Sep 17 00:00:00 2001 From: poojagunturu96 Date: Mon, 6 Jan 2025 13:53:30 -0600 Subject: [PATCH] replace deprecated / operator with math.div in sass files --- src/scss/components/_audio.scss | 2 +- src/scss/components/_banner.scss | 4 +-- .../_college-homepage-grid-header.scss | 8 +++--- src/scss/components/_datepicker.scss | 28 +++++++++---------- src/scss/components/_davis-header.scss | 6 ++-- src/scss/components/_dispatches-item.scss | 4 ++- src/scss/components/_fluencies.scss | 4 +-- src/scss/components/_gallery.scss | 2 +- src/scss/components/_grid.scss | 10 ++++--- src/scss/components/_journey-modal.scss | 8 +++--- src/scss/components/_journey.scss | 6 ++-- src/scss/components/_ls-hero.scss | 6 ++-- src/scss/components/_mega-cta.scss | 2 +- src/scss/components/_midd-nav.scss | 2 +- src/scss/components/_miis-header.scss | 2 ++ src/scss/components/_page-header.scss | 2 +- src/scss/components/_portrait-video.scss | 2 +- src/scss/components/_school-nav.scss | 6 ++-- src/scss/components/_spotlight.scss | 10 +++---- src/scss/components/_themed-panel.scss | 4 ++- src/scss/components/_video.scss | 2 +- src/scss/components/_wrmc-header.scss | 8 +++--- .../components/_wrmc-top-thirty-songs.scss | 2 +- .../components/_wrmc-weekly-schedule.scss | 2 +- src/scss/core/_functions.scss | 6 ++-- src/scss/mixins/_grid-framework.scss | 2 +- src/scss/mixins/_grid.scss | 22 +++++++-------- src/scss/scope/_typography.scss | 3 +- src/templates/partials/gallery-modal.twig | 2 +- .../partials/journey-modal-gallery.twig | 2 +- 30 files changed, 90 insertions(+), 79 deletions(-) diff --git a/src/scss/components/_audio.scss b/src/scss/components/_audio.scss index f55a24903..9b3fa886c 100644 --- a/src/scss/components/_audio.scss +++ b/src/scss/components/_audio.scss @@ -7,7 +7,7 @@ .audio__embed { position: relative; - padding-top: math.percentage(9 / 16); + padding-top: math.percentage(math.div(9, 16)); iframe { position: absolute; diff --git a/src/scss/components/_banner.scss b/src/scss/components/_banner.scss index 5e2b60ff8..76e8f9bf8 100644 --- a/src/scss/components/_banner.scss +++ b/src/scss/components/_banner.scss @@ -33,10 +33,10 @@ .banner__bottom-line { position: absolute; display: block; - width: math.percentage(12 / 12); + width: math.percentage(math.div(12, 12)); @include breakpoints.breakpoint(sm) { - width: math.percentage(9 / 12); + width: math.percentage(math.div(9, 12)); } } diff --git a/src/scss/components/_college-homepage-grid-header.scss b/src/scss/components/_college-homepage-grid-header.scss index be23fcd53..f9264c9c8 100644 --- a/src/scss/components/_college-homepage-grid-header.scss +++ b/src/scss/components/_college-homepage-grid-header.scss @@ -5,7 +5,7 @@ @use "sass:map"; $homepage-animation-duration: 8; -$homepage-animation-sub-duration: $homepage-animation-duration / 4; +$homepage-animation-sub-duration: $homepage-animation-duration * 0.25; $text-colors: ( 1: #75a3cd, @@ -117,7 +117,7 @@ $accessible-text-colors: ( display: block; opacity: 0; animation: #{$homepage-animation-sub-duration + - ($homepage-animation-sub-duration / 2)}s ease-in-out; + ($homepage-animation-sub-duration * 0.5)}s ease-in-out; animation-play-state: inherit; font-size: variables.$typescale-7; width: calc(11 / 12 * 100%); @@ -218,7 +218,7 @@ $accessible-text-colors: ( p { padding-bottom: variables.$spacing-3; animation: #{$homepage-animation-sub-duration + - ($homepage-animation-sub-duration / 2)}s ease-in-out; + ($homepage-animation-sub-duration * 0.5)}s ease-in-out; font-size: variables.$typescale-2; @include breakpoints.breakpoint(md) { @@ -239,7 +239,7 @@ $accessible-text-colors: ( color: variables.$navy; font-weight: variables.$font-weight-bold; animation: #{$homepage-animation-sub-duration + - ($homepage-animation-sub-duration / 2)}s ease-in-out; + ($homepage-animation-sub-duration * 0.5)}s ease-in-out; animation-play-state: inherit; } diff --git a/src/scss/components/_datepicker.scss b/src/scss/components/_datepicker.scss index 8a3f796f8..edaa7fb0e 100644 --- a/src/scss/components/_datepicker.scss +++ b/src/scss/components/_datepicker.scss @@ -2,25 +2,25 @@ @use '../../../node_modules/pikaday/scss/pikaday' with ( - $pd-text-color: $black, - $pd-title-color: $color-primary, - $pd-title-bg: $white, - $pd-picker-bg: $white, - $pd-picker-border: $border-color, - $pd-picker-border-bottom: $border-color, + $pd-text-color: variables.$black, + $pd-title-color: variables.$color-primary, + $pd-title-bg: variables.$white, + $pd-picker-bg: variables.$white, + $pd-picker-border: variables.$border-color, + $pd-picker-border-bottom: variables.$border-color, $pd-picker-shadow: none, - $pd-th-color: $black, - $pd-day-color: $color-primary, + $pd-th-color: variables.$black, + $pd-day-color: variables.$color-primary, $pd-day-bg: transparent, - $pd-day-hover-color: $color-primary, - $pd-day-hover-bg: $gray-light, - $pd-day-today-color: $color-primary, - $pd-day-selected-color: $white, - $pd-day-selected-bg: $color-primary, + $pd-day-hover-color: variables.$color-primary, + $pd-day-hover-bg: variables.$gray-light, + $pd-day-today-color: variables.$color-primary, + $pd-day-selected-color: variables.$white, + $pd-day-selected-bg: variables.$color-primary, $pd-day-selected-shadow: transparent, $pd-day-disabled-color: #999, $pd-week-color: #999, - $pd-font-family: $font-family-sans-serif + $pd-font-family: variables.$font-family-sans-serif ); .pika-single { diff --git a/src/scss/components/_davis-header.scss b/src/scss/components/_davis-header.scss index f376a14df..2a819bf40 100644 --- a/src/scss/components/_davis-header.scss +++ b/src/scss/components/_davis-header.scss @@ -170,7 +170,7 @@ top: 100%; left: 0; background-color: variables.$black; - padding: #{variables.$spacing-3 / 2} variables.$spacing-3; + padding: #{variables.$spacing-3 * 0.5} variables.$spacing-3; transition: opacity 0.2s; opacity: 0; visibility: hidden; @@ -246,8 +246,8 @@ } .davis-nav__link--sub { - padding-top: variables.$spacing-3 / 2; - padding-bottom: variables.$spacing-3 / 2; + padding-top: variables.$spacing-3 * 0.5; + padding-bottom: variables.$spacing-3 * 0.5; font-size: variables.$typescale-2; &:hover, diff --git a/src/scss/components/_dispatches-item.scss b/src/scss/components/_dispatches-item.scss index 769816d9b..1350fd010 100644 --- a/src/scss/components/_dispatches-item.scss +++ b/src/scss/components/_dispatches-item.scss @@ -1,3 +1,5 @@ +@use "sass:math"; + @use "../core/functions"; @use "../core/variables"; @use "../mixins/breakpoints"; @@ -55,7 +57,7 @@ $dispatches-card-height: 470px; display: block; content: ''; width: 100%; - padding-top: (9 / 16) * 100%; + padding-top: math.div(9, 16) * 100%; } > .dispatches-item__image { diff --git a/src/scss/components/_fluencies.scss b/src/scss/components/_fluencies.scss index b28e41027..b5dbaaf48 100644 --- a/src/scss/components/_fluencies.scss +++ b/src/scss/components/_fluencies.scss @@ -129,11 +129,11 @@ &::before { content: ''; display: block; - padding-top: math.percentage(143/166); + padding-top: math.percentage(math.div(143, 166)); width: 100%; @include breakpoints.breakpoint(xl) { - padding-top: math.percentage(133/166); + padding-top: math.percentage(math.div(133, 166)); } } diff --git a/src/scss/components/_gallery.scss b/src/scss/components/_gallery.scss index fcf9be62c..4471f930d 100644 --- a/src/scss/components/_gallery.scss +++ b/src/scss/components/_gallery.scss @@ -8,7 +8,7 @@ .gallery__image { position: relative; - padding-top: math.percentage(9 / 16); + padding-top: math.percentage(math.div(9, 16)); height: 0; overflow: hidden; diff --git a/src/scss/components/_grid.scss b/src/scss/components/_grid.scss index 6531bb44a..76eb290f4 100644 --- a/src/scss/components/_grid.scss +++ b/src/scss/components/_grid.scss @@ -1,3 +1,5 @@ +@use "sass:math"; + @use "../core/variables"; @use "../mixins/grid"; @use "../mixins/grid-framework"; @@ -27,13 +29,13 @@ } .row--sm-gutters { - margin-right: (variables.$grid-gutter-width / -2) !important; - margin-left: (variables.$grid-gutter-width / -2) !important; + margin-right: math.div(variables.$grid-gutter-width, -2) !important; + margin-left: math.div(variables.$grid-gutter-width, -2) !important; > .col, > [class*='col-'] { - padding-left: variables.$grid-gutter-width / 2; - padding-right: variables.$grid-gutter-width / 2; + padding-left: variables.$grid-gutter-width * 0.5; + padding-right: variables.$grid-gutter-width * 0.5; } } diff --git a/src/scss/components/_journey-modal.scss b/src/scss/components/_journey-modal.scss index ab257ccea..9c48b7d63 100644 --- a/src/scss/components/_journey-modal.scss +++ b/src/scss/components/_journey-modal.scss @@ -892,18 +892,18 @@ $school-theme-colors: ( display: block; content: ''; width: 100%; - padding-top: math.percentage(185/288); + padding-top: math.percentage(math.div(185, 288)); @include breakpoints.breakpoint(md) { - padding-top: math.percentage(255/272); + padding-top: math.percentage(math.div(255, 272)); } @media only screen and (min-width: 1200px) { - padding-top: math.percentage(200/330); + padding-top: math.percentage(math.div(200, 330)); } @include breakpoints.breakpoint(xl) { - padding-top: math.percentage(9/16); + padding-top: math.percentage(math.div(9, 16)); } } diff --git a/src/scss/components/_journey.scss b/src/scss/components/_journey.scss index f4a45e8f7..0f60ab998 100644 --- a/src/scss/components/_journey.scss +++ b/src/scss/components/_journey.scss @@ -241,14 +241,14 @@ position: relative; // overflow: hidden; align-items: center; - padding-top: math.percentage(16/9); + padding-top: math.percentage(math.div(16, 9)); @include breakpoints.breakpoint(sm) { - padding-top: math.percentage(225/256); + padding-top: math.percentage(math.div(225, 256)); } @include breakpoints.breakpoint(lg) { - padding-top: math.percentage(9/16); + padding-top: math.percentage(math.div(9, 16)); } .journey-section__background { diff --git a/src/scss/components/_ls-hero.scss b/src/scss/components/_ls-hero.scss index 5b53c053e..32dbe08c7 100644 --- a/src/scss/components/_ls-hero.scss +++ b/src/scss/components/_ls-hero.scss @@ -4,7 +4,7 @@ @use "sass:math"; .ls-hero { position: relative; - padding-top: math.percentage(2 / 5); + padding-top: math.percentage(2 * 0.2); min-height: 480px; @include breakpoints.breakpoint(md) { @@ -56,8 +56,8 @@ .ls-hero__item { display: inline-block; text-align: center; - margin-right: variables.$spacing-4 / 2; - margin-left: variables.$spacing-4 / 2; + margin-right: variables.$spacing-4 * 0.5; + margin-left: variables.$spacing-4 * 0.5; margin-bottom: variables.$spacing-2; } diff --git a/src/scss/components/_mega-cta.scss b/src/scss/components/_mega-cta.scss index c9695da17..ce909c97e 100644 --- a/src/scss/components/_mega-cta.scss +++ b/src/scss/components/_mega-cta.scss @@ -25,7 +25,7 @@ @include breakpoints.breakpoint(md) { height: 0; - padding-top: math.percentage(9 / 16); + padding-top: math.percentage(math.div(9, 16)); overflow: hidden; } @include breakpoints.breakpoint(lg) { diff --git a/src/scss/components/_midd-nav.scss b/src/scss/components/_midd-nav.scss index b4fcc6a23..33fee3c46 100644 --- a/src/scss/components/_midd-nav.scss +++ b/src/scss/components/_midd-nav.scss @@ -177,7 +177,7 @@ padding-left: variables.$spacing-6; @include breakpoints.breakpoint(lg) { - padding-left: variables.$spacing-4 / 2; + padding-left: variables.$spacing-4 * 0.5; } } diff --git a/src/scss/components/_miis-header.scss b/src/scss/components/_miis-header.scss index 853e4fa55..a473c3c6d 100644 --- a/src/scss/components/_miis-header.scss +++ b/src/scss/components/_miis-header.scss @@ -1,5 +1,7 @@ @use "../core/variables"; @use "../mixins/breakpoints"; +@use "../components/midd-header"; +@use "../components/institutional-header"; .miis-header { @extend .midd-header; diff --git a/src/scss/components/_page-header.scss b/src/scss/components/_page-header.scss index 6a3a6eb35..9f577941e 100644 --- a/src/scss/components/_page-header.scss +++ b/src/scss/components/_page-header.scss @@ -10,7 +10,7 @@ } .page-header--has-image { - padding-top: math.percentage(2 / 5); + padding-top: math.percentage(2 * 0.2); height: 0; position: relative; overflow: hidden; diff --git a/src/scss/components/_portrait-video.scss b/src/scss/components/_portrait-video.scss index 8c4bdc3ba..e15c25085 100644 --- a/src/scss/components/_portrait-video.scss +++ b/src/scss/components/_portrait-video.scss @@ -9,7 +9,7 @@ .portrait-video__content { position: relative; - padding-bottom: math.percentage(16 / 9); + padding-bottom: math.percentage(math.div(16, 9)); img, iframe { diff --git a/src/scss/components/_school-nav.scss b/src/scss/components/_school-nav.scss index cc7580e57..7d56785cf 100644 --- a/src/scss/components/_school-nav.scss +++ b/src/scss/components/_school-nav.scss @@ -56,7 +56,7 @@ top: 100%; left: 0; background-color: variables.$white; - padding: #{variables.$spacing-3 / 2} variables.$spacing-3; + padding: #{variables.$spacing-3 * 0.5} variables.$spacing-3; border: 1px solid variables.$navy; transition: opacity 0.2s; opacity: 0; @@ -112,8 +112,8 @@ } .school-nav__link--sub { - padding-top: variables.$spacing-3 / 2; - padding-bottom: variables.$spacing-3 / 2; + padding-top: variables.$spacing-3 * 0.5; + padding-bottom: variables.$spacing-3 * 0.5; font-size: variables.$typescale-2; &:hover, diff --git a/src/scss/components/_spotlight.scss b/src/scss/components/_spotlight.scss index ee585a70b..946b0bc71 100644 --- a/src/scss/components/_spotlight.scss +++ b/src/scss/components/_spotlight.scss @@ -17,7 +17,7 @@ .spotlight__figure { @include breakpoints.breakpoint(lg) { - padding-top: math.percentage(9 / 16); + padding-top: math.percentage(math.div(9, 16)); position: relative; height: 0; overflow: hidden; @@ -56,8 +56,8 @@ @include breakpoints.breakpoint(md) { // fake column offset with padding plus gutter width - padding-left: calc(#{math.percentage(1 / 12)} + #{variables.$grid-gutter-width / 2}); - padding-right: calc(#{math.percentage(1 / 12)} + #{variables.$grid-gutter-width / 2}); + padding-left: calc(#{math.percentage(math.div(1, 12))} + #{variables.$grid-gutter-width * 0.5}); + padding-right: calc(#{math.percentage(math.div(1, 12))} + #{variables.$grid-gutter-width * 0.5}); } // place after so largest breakpoint overrides @@ -73,8 +73,8 @@ // fake column offset with padding plus gutter width padding-top: variables.$spacing-5; padding-bottom: variables.$spacing-5; - padding-left: calc(#{math.percentage(1 / 12)} + #{variables.$grid-gutter-width / 2}); - padding-right: calc(#{math.percentage(1 / 12)} + #{variables.$grid-gutter-width / 2}); + padding-left: calc(#{math.percentage(math.div(1, 12))} + #{variables.$grid-gutter-width * 0.5}); + padding-right: calc(#{math.percentage(math.div(1, 12))} + #{variables.$grid-gutter-width * 0.5}); } // place after so largest breakpoint overrides diff --git a/src/scss/components/_themed-panel.scss b/src/scss/components/_themed-panel.scss index e3f533072..9bffd5db1 100644 --- a/src/scss/components/_themed-panel.scss +++ b/src/scss/components/_themed-panel.scss @@ -1,3 +1,5 @@ +@use "sass:math"; + @use "../core/variables"; @use "../mixins/breakpoints"; @use "../mixins/type"; @@ -39,7 +41,7 @@ display: block; content: ""; width: 100%; - padding-top: (9 / 16) * 100%; + padding-top: math.div(9, 16) * 100%; } @include breakpoints.breakpoint(sm) { diff --git a/src/scss/components/_video.scss b/src/scss/components/_video.scss index 09930f7c7..d3d3e82ae 100644 --- a/src/scss/components/_video.scss +++ b/src/scss/components/_video.scss @@ -9,7 +9,7 @@ .video__content { position: relative; - padding-top: math.percentage(9 / 16); + padding-top: math.percentage(math.div(9, 16)); height: 0; overflow: hidden; background-color: #000; diff --git a/src/scss/components/_wrmc-header.scss b/src/scss/components/_wrmc-header.scss index 085e66493..7a12100c1 100644 --- a/src/scss/components/_wrmc-header.scss +++ b/src/scss/components/_wrmc-header.scss @@ -1,4 +1,4 @@ -school-header.@use "../core/functions"; +@use "../core/functions"; @use "../core/mixins"; @use "../core/variables"; @use "../mixins/breakpoints"; @@ -259,7 +259,7 @@ $school-header-breakpoint: xl; top: 100%; left: 0; background-color: variables.$white; - padding: #{variables.$spacing-3 / 2} variables.$spacing-3; + padding: #{variables.$spacing-3 * 0.5} variables.$spacing-3; border: 1px solid variables.$navy; transition: opacity 0.2s; opacity: 0; @@ -319,8 +319,8 @@ $school-header-breakpoint: xl; } .wrmc-nav__link--sub { - padding-top: variables.$spacing-3 / 2; - padding-bottom: variables.$spacing-3 / 2; + padding-top: variables.$spacing-3 * 0.5; + padding-bottom: variables.$spacing-3 * 0.5; font-size: variables.$typescale-2; &:hover, diff --git a/src/scss/components/_wrmc-top-thirty-songs.scss b/src/scss/components/_wrmc-top-thirty-songs.scss index 3367e4d09..c789f139d 100644 --- a/src/scss/components/_wrmc-top-thirty-songs.scss +++ b/src/scss/components/_wrmc-top-thirty-songs.scss @@ -57,7 +57,7 @@ &:before{ content: ""; display: block; - padding-top: math.percentage(1/1); + padding-top: math.percentage(math.div(1, 1)); background-color: variables.$wrmc-pink; } diff --git a/src/scss/components/_wrmc-weekly-schedule.scss b/src/scss/components/_wrmc-weekly-schedule.scss index b10b5434e..600c65ea8 100644 --- a/src/scss/components/_wrmc-weekly-schedule.scss +++ b/src/scss/components/_wrmc-weekly-schedule.scss @@ -7,7 +7,7 @@ position: relative; .weekly-schedule__column { - width: math.percentage(1/7); + width: math.percentage(math.div(1, 7)); display: flex; flex-direction: column; align-items: center; diff --git a/src/scss/core/_functions.scss b/src/scss/core/_functions.scss index edd927297..96c5c07b1 100644 --- a/src/scss/core/_functions.scss +++ b/src/scss/core/_functions.scss @@ -5,13 +5,15 @@ //// /// Convert a number into an em unit given a base font size //// +@use "sass:math"; + @function em($target, $base: 16) { - @return $target / $base * 1em; + @return math.div($target, $base) * 1em; } //// /// Convert a number into an rem unit given a base font size //// @function rem($target, $base: 16) { - @return $target / $base * 1rem; + @return math.div($target, $base) * 1rem; } diff --git a/src/scss/mixins/_grid-framework.scss b/src/scss/mixins/_grid-framework.scss index 7f5c3e21e..f7ecc7d56 100644 --- a/src/scss/mixins/_grid-framework.scss +++ b/src/scss/mixins/_grid-framework.scss @@ -5,7 +5,7 @@ // adapted from Bootstrap v4.1.1 // https://github.com/twbs/bootstrap/blob/v4.1.1/scss/mixins/_grid-framework.scss -@mixin make-grid-columns($columns: variables.$grid-columns, $breakpoints: $breakpoints) { +@mixin make-grid-columns($columns: variables.$grid-columns, $breakpoints: variables.$breakpoints) { // use placeholders and extend so selectors are combined when css is generated %grid-column { @include grid.make-col-ready; diff --git a/src/scss/mixins/_grid.scss b/src/scss/mixins/_grid.scss index acb65e3b0..d2ec6d2bd 100644 --- a/src/scss/mixins/_grid.scss +++ b/src/scss/mixins/_grid.scss @@ -9,22 +9,22 @@ // - https://github.com/primer/css/blob/v14.1.0/src/layout/grid.scss @mixin make-gutters() { - padding-right: (variables.$grid-gutter-width / 2); - padding-left: (variables.$grid-gutter-width / 2); + padding-right: (variables.$grid-gutter-width * 0.5); + padding-left: (variables.$grid-gutter-width * 0.5); @include breakpoints.breakpoint(lg) { - padding-right: (variables.$grid-gutter-width-lg / 2); - padding-left: (variables.$grid-gutter-width-lg / 2); + padding-right: (variables.$grid-gutter-width-lg * 0.5); + padding-left: (variables.$grid-gutter-width-lg * 0.5); } } @mixin make-row-gutters() { - margin-right: (variables.$grid-gutter-width / -2); - margin-left: (variables.$grid-gutter-width / -2); + margin-right: math.div(variables.$grid-gutter-width, -2); + margin-left: math.div(variables.$grid-gutter-width, -2); @include breakpoints.breakpoint(lg) { - margin-right: (variables.$grid-gutter-width-lg / -2); - margin-left: (variables.$grid-gutter-width-lg / -2); + margin-right: math.div(variables.$grid-gutter-width-lg, -2); + margin-left: math.div(variables.$grid-gutter-width-lg, -2); } } @@ -56,14 +56,14 @@ } @mixin make-col($size, $columns: variables.$grid-columns) { - flex: 0 0 math.percentage($size / $columns); + flex: 0 0 math.percentage(math.div($size, $columns)); // Add a `max-width` to ensure content within each column does not blow out // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari // do not appear to require this. - max-width: math.percentage($size / $columns); + max-width: math.percentage(math.div($size, $columns)); } @mixin make-col-offset($size, $columns: variables.$grid-columns) { - $num: $size / $columns; + $num: math.div($size, $columns); margin-left: if($num == 0, 0, math.percentage($num)); } diff --git a/src/scss/scope/_typography.scss b/src/scss/scope/_typography.scss index 082eef23c..e65f7e9ce 100644 --- a/src/scss/scope/_typography.scss +++ b/src/scss/scope/_typography.scss @@ -1,9 +1,10 @@ -@use "../components/terms"; @use "../core/functions"; @use "../core/mixins"; @use "../core/variables"; @use "../mixins/breakpoints"; @use "../mixins/type"; +@use "../components/terms"; +@use "../components/table"; .typography { > :first-child { diff --git a/src/templates/partials/gallery-modal.twig b/src/templates/partials/gallery-modal.twig index 965a63f4d..457b93917 100644 --- a/src/templates/partials/gallery-modal.twig +++ b/src/templates/partials/gallery-modal.twig @@ -74,7 +74,7 @@ src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 {{item.width}} {{item.height}}'/%3E" {# src="" #} data-src="{{item.src}}" - data-srcset="{% for scale in [1, 0.75, 0.5, 0.25] %}http://placekitten.com/{{(item.width * scale)|round}}/{{(item.height * scale)|round}} {{(item.width * scale)|round}}w{{not loop.last ? ', ' : ''}}{% endfor %}" + data-srcset="{% for scale in [1, 0.75, 0.5, 0.25] %}http://placecats.com/{{(item.width * scale)|round}}/{{(item.height * scale)|round}} {{(item.width * scale)|round}}w{{not loop.last ? ', ' : ''}}{% endfor %}" width="{{item.width}}" alt="" /> diff --git a/src/templates/partials/journey-modal-gallery.twig b/src/templates/partials/journey-modal-gallery.twig index 332894992..216d64474 100644 --- a/src/templates/partials/journey-modal-gallery.twig +++ b/src/templates/partials/journey-modal-gallery.twig @@ -1,4 +1,4 @@ -{% set placehold = 'https://placekitten.com/' %} +{% set placehold = 'https://placecats.com/' %}
{% for item in journey_gallery_data %}