diff --git a/.DS_Store b/.DS_Store index c8db5615..60537b22 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/gulp-tasks/paths.js b/gulp-tasks/paths.js index 5cb93b2a..b6af2e76 100755 --- a/gulp-tasks/paths.js +++ b/gulp-tasks/paths.js @@ -27,6 +27,11 @@ module.exports = { src: 'src/www/wmcads-website.js', minName: 'wmcads-website.min.js', lint: true + }, + { + src: 'src/www/wmcads-templates.js', + minName: 'wmcads-templates.min.js', + lint: true } ], output: 'build/js/' // Output location of minified JS files diff --git a/src/wmcads/assets/img/logo.svg b/src/wmcads/assets/img/logo.svg index 2b69e646..3200e7ec 100644 --- a/src/wmcads/assets/img/logo.svg +++ b/src/wmcads/assets/img/logo.svg @@ -1 +1,11 @@ - \ No newline at end of file + diff --git a/src/wmcads/assets/sass/_utilities.scss b/src/wmcads/assets/sass/_utilities.scss index 03bd521b..9bd8a3e9 100755 --- a/src/wmcads/assets/sass/_utilities.scss +++ b/src/wmcads/assets/sass/_utilities.scss @@ -165,13 +165,13 @@ body { // Show/hide on desktop devices only .wmcads-hide-mobile { @media screen and (max-width: $breakpoint-md) { - display: none !important; + display: none; } } .wmcads-hide-desktop { @media screen and (min-width: $breakpoint-md) { - display: none !important; + display: none; } } diff --git a/src/wmcads/assets/sass/_vars.scss b/src/wmcads/assets/sass/_vars.scss index 6e60967a..4c40efbb 100755 --- a/src/wmcads/assets/sass/_vars.scss +++ b/src/wmcads/assets/sass/_vars.scss @@ -44,7 +44,7 @@ $black: #000000; } @font-face { - font-family: "Noto Sans Display"; + font-family: "Noto Sans Display Bold"; font-style: normal; font-weight: bold; // sass-lint:disable-block indentation @@ -56,6 +56,7 @@ $black: #000000; // TEXT $text-color: get-color($black); $x-font-family: "Noto Sans Display", sans-serif; +$x-font-family-bold: "Noto Sans Display Bold", sans-serif; $x-heading-font-family: "DM Sans", sans-serif; // Base font size and line height diff --git a/src/wmcads/assets/sass/wmcads-grid/_grid-css-grid.scss b/src/wmcads/assets/sass/wmcads-grid/_grid-css-grid.scss new file mode 100644 index 00000000..c225944e --- /dev/null +++ b/src/wmcads/assets/sass/wmcads-grid/_grid-css-grid.scss @@ -0,0 +1,36 @@ +// Creates a css-grid layout for content cards +.wmcads-css-grid { + display: inline; + + &-4-col { + display: grid; + grid-gap: $size-lg; + grid-template-columns: repeat(auto-fit, minmax(208px, 1fr)); + } + + &-3-col { + display: grid; + grid-gap: $size-lg; + grid-template-columns: repeat(auto-fit, minmax(288px, 1fr)); + } + + &-2-col { + display: grid; + grid-gap: $size-lg; + grid-template-columns: repeat(auto-fit, minmax(448px, 1fr)); + + @media (max-width: $breakpoint-sm) { + grid-template-columns: repeat(auto-fit, minmax(288px, 1fr)); + } + } + + &-block { + &--double { + grid-column: auto / span 2; + + @media (max-width: $breakpoint-sm) { + grid-column: auto / span 1; + } + } + } +} diff --git a/src/wmcads/assets/sass/wmcads-grid/_wmcads-grid.scss b/src/wmcads/assets/sass/wmcads-grid/_wmcads-grid.scss index ffb1f5ea..bd355d4d 100755 --- a/src/wmcads/assets/sass/wmcads-grid/_wmcads-grid.scss +++ b/src/wmcads/assets/sass/wmcads-grid/_wmcads-grid.scss @@ -34,5 +34,6 @@ textarea, } // Import grid components +@import "grid-css-grid"; @import "grid-cols"; @import "grid-spacing"; diff --git a/src/wmcads/assets/sass/wmcads-grid/grid.scss b/src/wmcads/assets/sass/wmcads-grid/grid.scss index 9a9d834b..4c00cb14 100644 --- a/src/wmcads/assets/sass/wmcads-grid/grid.scss +++ b/src/wmcads/assets/sass/wmcads-grid/grid.scss @@ -38,6 +38,7 @@ } // Import grid components + @import "grid-css-grid"; @import "grid-cols"; @import "grid-spacing"; diff --git a/src/wmcads/components/button/_button.scss b/src/wmcads/components/button/_button.scss index 86d51859..3ad4f15c 100755 --- a/src/wmcads/components/button/_button.scss +++ b/src/wmcads/components/button/_button.scss @@ -13,6 +13,7 @@ $btn-transition: ease-in-out background-color 0.2s, ease-in-out border 0.2s; border-radius: $btn-border-radius; color: $white; background-color: get-color(primary); + font-family: $x-font-family-bold; font-size: 1rem; font-weight: bold; text-align: center; diff --git a/src/wmcads/components/content-card/_content-card.njk b/src/wmcads/components/content-card/_content-card.njk index 174c3b68..3ae8ad4d 100755 --- a/src/wmcads/components/content-card/_content-card.njk +++ b/src/wmcads/components/content-card/_content-card.njk @@ -15,7 +15,7 @@ <{{tag}}{{attributes | safe}} class="wmcads-content-card{{"--blue" if params.isCta else "" }} {{"wmcads-content-card--event" if params.isEvent else "" }} {{"wmcads-content-card--news" if params.isNews else "" }} {{"wmcads-css-grid-block--double" if params.isDoubleCard else "" }} "> {% if(params.src) %} + src="https://www.wmca.org.uk/media/3415/wmca-bournville-131.jpg{{"?anchor=center&mode=crop&width=920&height=300&rnd=132122595620000000" if params.isNewsFirst else "" }}{{"?anchor=center&mode=crop&width=480&height=357&rnd=132122595620000000" if params.isNewsSub else "" }}{{"?anchor=center&mode=crop&width=896&height=334&rnd=132122595620000000" if params.isSrcDefault else "" }}{{"?anchor=center&mode=crop&width=1500&height=393&rnd=132122595620000000" if params.isDoubleCard else "" }}{{"?anchor=center&mode=crop&width=600&height=334&rnd=132122595620000000" if params.isThirdCard else "" }}{{"?anchor=center&mode=crop&width=700&height=334&rnd=132122595620000000" if params.isDefault else "" }}" alt="content image"> {% endif %} {% if(params.isCta) %}