diff --git a/.eleventy.js b/.eleventy.js index 1449d7a490..d22353a162 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -3,6 +3,7 @@ const util = require("util"); const { optimize } = require("svgo"); const path = require("path"); const markdownIt = require("markdown-it"); +const markdownItFootnote = require("markdown-it-footnote"); const dayjs = require("dayjs"); const customParseFormat = require("dayjs/plugin/customParseFormat"); @@ -83,13 +84,18 @@ module.exports = function (eleventyConfig) { return value.replace(/(<([^>]+)>)/gi, ""); }); - const mdRender = new markdownIt({}); + const mdRender = new markdownIt({ + html: true, + breaks: false, + linkify: true, + }).use(markdownItFootnote); eleventyConfig.addFilter("markdown", function (value) { if (value) { return mdRender.render(value); } return ""; }); + eleventyConfig.setLibrary("md", mdRender); eleventyConfig.addFilter("filterByAttribute", (array, attribute, value) => { return array.filter(element => element.data[attribute] === value); diff --git a/package.json b/package.json index fda51c37ef..f22229df1d 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,7 @@ "express": "^4.18.1", "html-minifier": "4.0.0", "markdown-it": "14.1.0", + "markdown-it-footnote": "^4.0.0", "netlify-plugin-11ty": "^1.1.0", "npm-run-all2": "^6.0.0", "prettier": "3.2.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f6f4a72cc9..9474f5866f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -87,6 +87,9 @@ importers: markdown-it: specifier: 14.1.0 version: 14.1.0 + markdown-it-footnote: + specifier: ^4.0.0 + version: 4.0.0 netlify-plugin-11ty: specifier: ^1.1.0 version: 1.4.0 @@ -2229,6 +2232,9 @@ packages: resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==} engines: {node: '>=8'} + markdown-it-footnote@4.0.0: + resolution: {integrity: sha512-WYJ7urf+khJYl3DqofQpYfEYkZKbmXmwxQV8c8mO/hGIhgZ1wOe7R4HLFNwqx7TjILbnC98fuyeSsin19JdFcQ==} + markdown-it@13.0.2: resolution: {integrity: sha512-FtwnEuuK+2yVU7goGn/MJ0WBZMM9ZPgU9spqlFs7/A/pDIUNSOQZhUgOqYCficIuR2QaFnrt8LHqBWsbTAoI5w==} hasBin: true @@ -5921,6 +5927,8 @@ snapshots: dependencies: semver: 6.3.1 + markdown-it-footnote@4.0.0: {} + markdown-it@13.0.2: dependencies: argparse: 2.0.1 diff --git a/src/assets/css/app.scss b/src/assets/css/app.scss index 1a9fc76ee5..d668d67f8c 100644 --- a/src/assets/css/app.scss +++ b/src/assets/css/app.scss @@ -9,6 +9,7 @@ @import "base/forms"; @import "base/prism-theme"; +@import "components/icon-arrow"; @import "components/nav"; @import "components/nav-submenu"; @import "components/mobile-menu"; diff --git a/src/assets/css/base/_buttons-links.scss b/src/assets/css/base/_buttons-links.scss index c5f009e353..b0b6127d37 100644 --- a/src/assets/css/base/_buttons-links.scss +++ b/src/assets/css/base/_buttons-links.scss @@ -16,22 +16,11 @@ p a { transition: color ease 0.5s; overflow: hidden; transform: translate3d(0, 0, 0); + --icon-arrow-margin: 0 0 0 0.5rem; - .icon-arrow { - flex-shrink: 0; - transform: translateX(0px) rotate(-90deg); - height: 1rem; - width: 1rem; - color: var(--color-white); - margin-left: 0.5rem; - transition: transform 0.5s ease; - } &:hover, &:focus { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } &--purple { @@ -45,10 +34,6 @@ p a { &--white { background-color: var(--color-white); color: var(--color-link-primary); - - .icon-arrow { - color: var(--color-link-primary); - } } } @@ -60,85 +45,22 @@ p a { display: flex; align-items: center; text-decoration: none; + --icon-arrow-size: 1.5rem; + --icon-arrow-margin: 0 1.5rem 0 0; + --icon-arrow-color: var(--color-purple); &-text { text-decoration: none; } - .icon-arrow { - flex-shrink: 0; - transform: translateX(0px) rotate(-90deg); - height: 1.5rem; - width: 1.5rem; - color: var(--color-purple); - margin-right: 1.5rem; - transition: transform 0.5s ease; - } - - &.previous { - .icon-arrow { - transform: translateX(0px) rotate(90deg); - margin-right: 1.5rem; - margin-left: 0; - transition: transform 0.5s ease; - } - - &:hover .icon-arrow, &:focus .icon-arrow { - transform: translateX(-0.5rem) rotate(90deg); - } - } -} - -.btn-secondary:hover, .btn-secondary:focus { - text-decoration: none; - - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } - - .btn-secondary-text { - text-decoration: none; - } -} - -.next { - .icon-arrow { - transform: rotate(-90deg); - margin-right: 0; - margin-left: 1.5rem; - } -} - -.videos { - .icon-arrow { - transform: rotate(-90deg); - margin-right: 0; - margin-left: 1.5rem; - } -} - -.message { - cursor: pointer; - - .icon-arrow { - transform: rotate(-90deg); - margin-right: 0; - margin-left: 1.5rem; - color: var(--color-white); - } - &:hover, &:focus { - color: var(--color-aqua); + --icon-arrow-transform: translate3d(0.5rem,0,0); + text-decoration: none; + color: var(--color-purple); } -} -a.btn-secondary { - &:hover, - &:focus { - .btn-secondary__text { - color: var(--color-purple); - } + &--reversed { + --icon-arrow-margin: 0 0 0 1.5rem; } } diff --git a/src/assets/css/base/_prism-theme.scss b/src/assets/css/base/_prism-theme.scss index eb478941a2..82f58887c0 100644 --- a/src/assets/css/base/_prism-theme.scss +++ b/src/assets/css/base/_prism-theme.scss @@ -4,8 +4,8 @@ * @author Katorly */ /* General */ -pre[class*="language-"], -code[class*="language-"] { +pre, +code { color: #c9d1d9; font-size: 1.5rem; text-shadow: none; @@ -24,26 +24,26 @@ code[class*="language-"] { -ms-hyphens: none; hyphens: none; } -pre[class*="language-"]::selection, -code[class*="language-"]::selection, -pre[class*="language-"]::mozselection, -code[class*="language-"]::mozselection { +pre::selection, +code::selection, +pre::mozselection, +code::mozselection { text-shadow: none; background: #234879; } @media print { - pre[class*="language-"], - code[class*="language-"] { + pre, + code { text-shadow: none; } } -pre[class*="language-"] { +pre { padding: 1em; margin: 2em 0; overflow: auto; background: #161b22; } -:not(pre) > code[class*="language-"] { +:not(pre) > code { padding: .1em .3em; border-radius: .3em; color: #c9d1d9; @@ -53,7 +53,7 @@ pre[class*="language-"] { pre[data-line] { position: relative; } -pre[class*="language-"] > code[class*="language-"] { +pre > code { position: relative; z-index: 1; } diff --git a/src/assets/css/base/_variables.scss b/src/assets/css/base/_variables.scss index 52d2277f6c..5707d40f03 100644 --- a/src/assets/css/base/_variables.scss +++ b/src/assets/css/base/_variables.scss @@ -20,6 +20,12 @@ --color-link-background: var(--color-yellow); --font-base: "Core Sans A", sans-serif; + + // Arrow icons + --icon-arrow-rotate: -90deg; + --icon-arrow-transform: translate3d(0, 0, 0); + --icon-arrow-size: 1rem; + --icon-arrow-margin: 0 0 0 1rem; } $breakpoint-s: 48em; diff --git a/src/assets/css/components/_case-cards.scss b/src/assets/css/components/_case-cards.scss index c8de5e957d..21d7daed6a 100644 --- a/src/assets/css/components/_case-cards.scss +++ b/src/assets/css/components/_case-cards.scss @@ -70,6 +70,7 @@ @media (hover: hover) { .case-cards__grid-element:hover, .case-cards__grid-element:focus { + --icon-arrow-transform: translate3d(0.5rem, 0, 0); color: var(--color-white); cursor: pointer; @@ -80,23 +81,9 @@ .solution { transform: translate(0px); } - - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } } } -.case-cards_link { - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 100%; - text-decoration: none; -} - .case-cards__content { position: relative; width: 100%; @@ -120,6 +107,7 @@ text-decoration: none; background-repeat: no-repeat; z-index: 50; + outline-offset: -0.5rem; } .case-cards__link-wrapper { @@ -144,37 +132,16 @@ } .case-cards__link-arrow { + --icon-arrow-size: 1.5rem; position: relative; margin-left: 0.25rem; z-index: 1; display: flex; justify-content: center; - - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: transform 0.5s ease; - width: 24px; - height: auto; - } - - &--rotate { - margin-left: 0; - margin-right: 0.5rem; - - .icon-arrow { - transform: rotate(90deg); - } - } } .case-cards__link-label a { text-decoration: none; position: relative; z-index: 100; - - &:hover, - &:focus { - cursor: pointer; - color: var(--color-white); - } } diff --git a/src/assets/css/components/_client-card.scss b/src/assets/css/components/_client-card.scss index 7f8954ac7c..7ec2ecf8a1 100644 --- a/src/assets/css/components/_client-card.scss +++ b/src/assets/css/components/_client-card.scss @@ -18,32 +18,19 @@ } .client-card__link { + --icon-arrow-size: 1.5rem; + --icon-arrow-margin: 0 0 0 0.75rem; display: flex; align-items: center; -} - -.client-card__link { flex-shrink: 0; - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: transform 0.5s ease; - height: 1.5rem; - width: 1.5rem; - color: var(--color-purple); - margin-left: 0.75rem; - } - &:hover, &:focus { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } } -@media (min-width: $breakpoint-s) { +@media (min-width: 48em) { .client-card { margin: 0; } diff --git a/src/assets/css/components/_featured-case-study.scss b/src/assets/css/components/_featured-case-study.scss index 6547501ae2..13fb2ea1e0 100644 --- a/src/assets/css/components/_featured-case-study.scss +++ b/src/assets/css/components/_featured-case-study.scss @@ -10,17 +10,9 @@ margin-top: rem-calc(80); } - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: transform 0.5s ease; - } - &:hover, &:focus { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } &--purple { @@ -241,6 +233,10 @@ } } + .featured-case-studies .featured-case-study { + grid-column: span 3 / span 3; + } + .featured-case-study__content-wrapper { justify-content: center; align-items: flex-start; diff --git a/src/assets/css/components/_featured-services.scss b/src/assets/css/components/_featured-services.scss index 0dfe947359..e5f81e73db 100644 --- a/src/assets/css/components/_featured-services.scss +++ b/src/assets/css/components/_featured-services.scss @@ -24,6 +24,9 @@ } .featured-services__link { + --icon-arrow-color: var(--color-purple); + --icon-arrow-size: 1.5rem; + --icon-arrow-margin: 0 1.5rem 0 0; display: flex; align-items: start; flex-direction: column; @@ -38,25 +41,13 @@ font-size: 1rem; } - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: transform 0.5s ease; - height: 1.5rem; - width: 1.5rem; - color: var(--color-purple); - margin-right: 1.5rem; - } - &:hover, &:focus { + --icon-arrow-transform: translate3d(0.5rem, 0, 0); + .featured-services__link-description { color: var(--color-purple); } - - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } } } @@ -66,7 +57,7 @@ align-items: center; } -a.featured-services__link { +.featured-services__link { &:hover, &:focus { .featured-services__link-text { diff --git a/src/assets/css/components/_icon-arrow.scss b/src/assets/css/components/_icon-arrow.scss new file mode 100644 index 0000000000..cbe4ca593e --- /dev/null +++ b/src/assets/css/components/_icon-arrow.scss @@ -0,0 +1,10 @@ +.icon-arrow { + flex-shrink: 0; + height: var(--icon-arrow-size); + width: var(--icon-arrow-size); + margin: var(--icon-arrow-margin); + transform: var(--icon-arrow-transform) rotate(var(--icon-arrow-rotate)); + transition: transform 0.5s ease; + will-change: transform; + color: var(--icon-arrow-color, inherit); +} diff --git a/src/assets/css/components/_nav-submenu.scss b/src/assets/css/components/_nav-submenu.scss index 2b37b65aa9..554af58744 100644 --- a/src/assets/css/components/_nav-submenu.scss +++ b/src/assets/css/components/_nav-submenu.scss @@ -17,6 +17,7 @@ } .nav-submenu__toggle { + --icon-arrow-margin: 0 0 0 0.5rem; display: flex; align-items: center; border: 0; @@ -29,15 +30,8 @@ display: none; } - svg { - margin-left: 0.5rem; - transform: rotate(0); - } - body[data-js-enabled="false"] .nav-submenu[open] & { - svg { - transform: rotate(180deg); - } + --icon-arrow-rotate: 0deg; } } @@ -72,6 +66,9 @@ } .nav-submenu__link { + --icon-arrow-size: 0.75rem; + --icon-arrow-margin: 0 1rem 0 0; + display: flex; flex-direction: column; text-decoration: none; @@ -79,22 +76,10 @@ outline-offset: -0.125rem; transition: color 0.3s ease; - .icon-arrow { - width: 0.75rem; - height: 0.75rem; - transform: translateX(0px) rotate(-90deg); - margin-right: 1rem; - transition: transform 0.5s ease; - } - &:hover, &:focus { + --icon-arrow-transform: translate3d(0.5rem, 0, 0); color: var(--color-accent); text-decoration: none; - - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } } } @@ -137,35 +122,16 @@ body[data-js-enabled="true"] { } .nav-submenu__toggle { - svg { - transform: translateX(0px) rotate(-90deg); - height: 1rem; - width: 1rem; - } - &:hover, &:focus { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } } .nav-submenu__link { + --icon-arrow-size: 2rem; font-size: 2rem; display: flex; align-items: start; padding: 0.5rem 0; - - .icon-arrow { - width: 2rem; - height: 2rem; - } - } - - .nav-submenu[open] .nav-submenu__toggle svg & { - svg { - transform: rotate(-90deg); - } } } diff --git a/src/assets/css/components/_nav.scss b/src/assets/css/components/_nav.scss index e140608cb1..6c9e394e21 100644 --- a/src/assets/css/components/_nav.scss +++ b/src/assets/css/components/_nav.scss @@ -62,7 +62,7 @@ transition: color 0.3s ease; &:hover, - &:focus { + &:focus-within { color: var(--color-aqua); .nav__link-text { diff --git a/src/assets/css/components/_next-events-cards.scss b/src/assets/css/components/_next-events-cards.scss index fa9f42a6f0..68e28ef57c 100644 --- a/src/assets/css/components/_next-events-cards.scss +++ b/src/assets/css/components/_next-events-cards.scss @@ -10,7 +10,6 @@ align-items: start; text-decoration: none; overflow: hidden; - cursor: pointer; a:hover, &:focus { @@ -18,16 +17,8 @@ } } -.next-events-cards__grid-element:hover, .next-events-cards__grid-element:focus { - color: var(--color-white); - cursor: pointer; - - .next-events-cards__link-arrow { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } - } +.next-events-cards__grid-element:hover, .next-events-cards__grid-element:focus-within { + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } .next-events-cards__date-wrapper { @@ -64,14 +55,6 @@ align-self: end; } -.next-events-cards--hover { - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 100%; -} - .next-events-cards__link { position: absolute; top: 0; @@ -84,26 +67,10 @@ } .next-events-cards__link-arrow { + --icon-arrow-size: 1.5rem; position: relative; margin-left: 0.25rem; z-index: 1; display: flex; justify-content: center; - - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: color 0.3s ease; - width: 24px; - height: auto; - transition: transform 0.5s ease; - } - - &--rotate { - margin-left: 0; - margin-right: 0.5rem; - - .icon-arrow { - transform: rotate(90deg); - } - } } diff --git a/src/assets/css/components/_pagination.scss b/src/assets/css/components/_pagination.scss index 0f04ead1f8..703919a20e 100644 --- a/src/assets/css/components/_pagination.scss +++ b/src/assets/css/components/_pagination.scss @@ -14,11 +14,7 @@ margin-top: 3rem; } - & .next:only-child { - margin-left: auto; - } - - & .next-wrapper:only-child { + & > [class$="reversed"]:only-child { margin-left: auto; } } @@ -31,41 +27,16 @@ flex-grow: 2; } + .previous-wrapper { + --icon-arrow-rotate: 90deg; display: flex; flex-direction: column; align-items: start; text-align: left; flex-grow: 2; -} - -.pagination__link { - padding: 0.75rem 1rem; - - &[aria-current="page"] { - font-weight: 600; - color: var(--color-purple); - text-decoration: none; + a:hover, a:focus { + --icon-arrow-transform: translate3d(-0.5rem, 0, 0); } } - -.pagination__previous, -.pagination__next { - text-decoration: none; - - &:hover, &:focus { - text-decoration: none; - } -} - -.pagination__previous { - grid-column: 1 / 2; - text-align: left; -} - -.pagination__next { - grid-column: 2 / 3; - justify-self: end; - text-align: right; -} diff --git a/src/assets/css/components/_post-cards.scss b/src/assets/css/components/_post-cards.scss index d17d4ce89f..1426a93fa1 100644 --- a/src/assets/css/components/_post-cards.scss +++ b/src/assets/css/components/_post-cards.scss @@ -29,25 +29,15 @@ align-items: start; text-decoration: none; overflow: hidden; - cursor: pointer; - a:hover, + &:hover, &:focus { - text-decoration: underline; + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } -} -.post-cards__grid-element:hover, -.post-cards__grid-element:focus { - color: var(--color-white); - cursor: pointer; - - .post-cards__link-arrow { - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - } + a:hover { + text-decoration: underline; } } @@ -126,41 +116,19 @@ text-decoration: none; background-repeat: no-repeat; z-index: 50; + outline-offset: -0.25rem; } .post-cards__link-arrow { + --icon-arrow-size: 1.5rem; position: relative; margin-left: 0.25rem; z-index: 1; display: flex; - justify-content: center; - - .icon-arrow { - transform: translateX(0px) rotate(-90deg); - transition: color 0.3s ease; - width: 24px; - height: auto; - transition: transform 0.5s ease; - } - - &--rotate { - margin-left: 0; - margin-right: 0.5rem; - - .icon-arrow { - transform: rotate(90deg); - } - } } .post-cards__link-label a, .post-cards__author-name a { - text-decoration: none; position: relative; z-index: 100; - - &:hover, - &:focus { - cursor: pointer; - } } diff --git a/src/assets/css/components/_rte.scss b/src/assets/css/components/_rte.scss index e8e49b9ef5..4f368d6ed8 100644 --- a/src/assets/css/components/_rte.scss +++ b/src/assets/css/components/_rte.scss @@ -112,6 +112,60 @@ text-transform: uppercase; margin-top: 1.5rem; } + + strong { + font-weight: 700; + } + + em { + font-style: italic; + } + + ul, ol { + margin: 1rem 0 1rem 3.5rem; + + li { + position: relative; + padding-left: 0; + + &::before { + position: absolute; + width: 2.5rem; + transform: translateX(-3.5rem); + color: var(--color-purple); + font-weight: 700; + text-align: right; + } + } + } + + ul li::before { + content: "●"; + } + + ol { + list-style: none; + counter-reset: list; + + li { + &::before { + counter-increment: list; + content: counter(list) "."; + } + } + } + + ol ol { + counter-reset: sublist; + + li { + counter-increment: sublist; + + &::before { + content: counter(sublist, lower-alpha) '.'; + } + } + } } .rte--small { diff --git a/src/assets/css/components/_talks.scss b/src/assets/css/components/_talks.scss index 070f113659..ee5151df4a 100644 --- a/src/assets/css/components/_talks.scss +++ b/src/assets/css/components/_talks.scss @@ -28,17 +28,3 @@ text-align: right; } } - -.talks_pagination { - display: flex; - align-items: end; - margin-top: 5rem; - - & .videos:only-child { - margin-left: auto; - } - - & .videos:only-child { - margin-left: auto; - } -} diff --git a/src/assets/css/workshop-lp.scss b/src/assets/css/workshop-lp.scss index ba64f6042e..0ae5a4d9d0 100644 --- a/src/assets/css/workshop-lp.scss +++ b/src/assets/css/workshop-lp.scss @@ -129,6 +129,7 @@ button { height: 1em; background-color: var(--color-link-primary); } + span { color: var(--color-link-primary); text-decoration: none; @@ -136,53 +137,9 @@ button { cursor: pointer; } - .icon-arrow { - flex-shrink: 0; - transform: translateX(0px) rotate(-90deg); - height: 1rem; - width: 1rem; - color: var(--color-white); - margin-left: 0.5rem; - transition: transform 0.5s ease; - } - - &.btn-primary--white { - svg { - color: var(--color-purple); - } - } - &:hover, &:focus { - .line { - background-color: var(--color-white); - } - - span { - color: var(--color-white); - text-decoration: none; - font-weight: 700; - } - - .icon-arrow { - transform: translateX(0.5rem) rotate(-90deg); - transition: transform 0.5s ease; - color: var(--color-white); - } - - &.btn-primary--white { - .line { - background-color: var(--color-purple); - } - - span { - color: var(--color-purple); - } - - svg { - color: var(--color-purple); - } - } + --icon-arrow-transform: translate3d(0.5rem, 0, 0); } } diff --git a/src/blog.njk b/src/blog.njk index 62ccf958f9..5e5f7848da 100644 --- a/src/blog.njk +++ b/src/blog.njk @@ -45,7 +45,9 @@ eleventyNavigation: {% else %} {% set nextLabel = 'Next' %} {% endif %} - {{ navPagination(pagination.href.previous, pagination.href.next, nextLabel) }} + {% if pagination.href.previous %}{% set previous %}{{ pagination.href.previous }}#posts{% endset %}{% endif %} + {% if pagination.href.next %}{% set next %}{{ pagination.href.next }}#posts{% endset %}{% endif %} + {{ navPagination(previous, next, 'Previous', nextLabel) }} {% set 'content' = { diff --git a/src/calendar/2024-09-12-emberfest.md b/src/calendar/2024-09-12-emberfest.md new file mode 100644 index 0000000000..17f0b3eae0 --- /dev/null +++ b/src/calendar/2024-09-12-emberfest.md @@ -0,0 +1,15 @@ +--- +title: "EmberFest" +image: "/assets/images/calendar/2024-09-12-emberfest/event-logo.png" +location: Dublin +url: https://emberfest.eu +kind: conference +color: purple +--- + +EmberFest is the European Community Ember Conference, this year happening in +Dublin, on September 12th & 13th. If you’re looking for updates on the latest +and greatest in Ember and Glimmer this is the place to be. EmberFest is also a +great opportunity to get in touch with the European Ember Community (and friends +from abroad) and hiring Ember talent. Mainmatter is co-organizing the event and +our team will be in Dublin in full force! diff --git a/src/components/btn-secondary.njk b/src/components/btn-secondary.njk index 90ca115982..ecd25286f6 100644 --- a/src/components/btn-secondary.njk +++ b/src/components/btn-secondary.njk @@ -1,6 +1,14 @@ -{%- macro btnSecondary(link, class) -%} - - {% include 'svg/arrow.njk' %} +{%- macro btnSecondary(link, class, flip = false) -%} + + {% if flip == false %} + {% include 'svg/arrow.njk' %} + {% endif %} {{ link.label }} + {% if flip == true %} + {% include 'svg/arrow.njk' %} + {% endif %} {% endmacro %} diff --git a/src/components/global/fonts.njk b/src/components/global/fonts.njk index 90a36324a2..151833f56c 100644 --- a/src/components/global/fonts.njk +++ b/src/components/global/fonts.njk @@ -19,6 +19,13 @@ type="font/woff2" crossorigin /> + diff --git a/src/components/layouts/post.njk b/src/components/layouts/post.njk index 2bd3986b45..917319e60f 100644 --- a/src/components/layouts/post.njk +++ b/src/components/layouts/post.njk @@ -86,7 +86,10 @@ layout: base {% endif %} {% if next %}
- Next post {% include 'svg/arrow.njk' %} diff --git a/src/components/nav-pagination.njk b/src/components/nav-pagination.njk index 3731ea59cf..d80d8ca8ca 100644 --- a/src/components/nav-pagination.njk +++ b/src/components/nav-pagination.njk @@ -3,33 +3,34 @@ Previous / next pagination for within listing pages Configuration Options: previous: page object of the next page, or null. next: see above -nextLabel: string for Next button label only on first page +nextLabel: string for Previous button label +nextLabel: string for Next button label #} +{% from "btn-secondary.njk" import btnSecondary %} -{%- macro navPagination(previous, next, nextLabel) -%} +{%- macro navPagination(previous, next, previousLabel = "Previous", nextLabel = "Next") -%} {% if previous or next %} - - {% if nextLabel %} - {% set next_label = nextLabel %} - {% else %} - {% set next_label = 'Next' %} - {% endif %} - diff --git a/src/components/pagination.njk b/src/components/pagination.njk deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/src/components/post-card.njk b/src/components/post-card.njk index ba1d7ec3b8..03b60ba2f2 100644 --- a/src/components/post-card.njk +++ b/src/components/post-card.njk @@ -8,7 +8,6 @@ post: A post object #} {%- macro postCard(post) -%}
-

{{ post.date | monthDayYear }}

diff --git a/src/components/recent-posts.njk b/src/components/recent-posts.njk index 787d1b2aac..3b88e83ebb 100644 --- a/src/components/recent-posts.njk +++ b/src/components/recent-posts.njk @@ -1,6 +1,7 @@ {% from "cta-link.njk" import ctaLink %} {% from "post-banner.njk" import postBanner %} {% from "post-card.njk" import postCard %} +{% from "btn-secondary.njk" import btnSecondary %} {%- macro recentPosts(title, collection) -%}
@@ -15,12 +16,15 @@ {% endif %} {%- endfor -%} - +
{%- endmacro -%} diff --git a/src/events.njk b/src/events.njk index 0a340358ec..2b100f67ea 100644 --- a/src/events.njk +++ b/src/events.njk @@ -10,6 +10,7 @@ description: Find out about upcoming events, conferences and meetups we will be {% from "talk-card.njk" import talkCard %} {% from "cta-link.njk" import ctaLink %} {% from "btn-primary.njk" import btnPrimary %} +{% from "btn-secondary.njk" import btnSecondary %} {% from "cta-banner.njk" import ctaBanner %} {% set 'content' = { @@ -61,11 +62,14 @@ description: Find out about upcoming events, conferences and meetups we will be {% endfor %} {% if collections.appearances.length > 7 %} -
- - Load more videos - {% include 'svg/arrow.njk' %} - + {% endif %}
diff --git a/src/index.njk b/src/index.njk index 3b2ed84701..3bd11498de 100644 --- a/src/index.njk +++ b/src/index.njk @@ -128,7 +128,6 @@ title: null {% for event in collections.calendar %} {% if loop.index < 4 %}
-

{{ event.date | monthDayYear }}

diff --git a/src/tag.njk b/src/tag.njk index 4387e9a277..8d1824e3c7 100644 --- a/src/tag.njk +++ b/src/tag.njk @@ -35,10 +35,10 @@ permalink: "/blog/tag/{{ paged.tag | slug }}/{% if paged.number > 1 %}/page/{{ p
{% if paged.first != true %} - {%- set previous -%}/blog/tag/{{ paged.tag | slug }}/{% if paged.number > 2 %}page/{{ paged.number -1 }}/{% endif %}{%- endset -%} + {%- set previous -%}/blog/tag/{{ paged.tag | slug }}/{% if paged.number > 2 %}page/{{ paged.number -1 }}/{% endif %}#posts{%- endset -%} {% endif %} {% if paged.last != true %} - {%- set next -%}/blog/tag/{{ paged.tag | slug }}/page/{{ paged.number + 1 }}/{%- endset -%} + {%- set next -%}/blog/tag/{{ paged.tag | slug }}/page/{{ paged.number + 1 }}/#posts{%- endset -%} {% endif %} {{ navPagination(previous, next) }} diff --git a/static/assets/fonts/core-sans/CoreSansA45it.woff b/static/assets/fonts/core-sans/CoreSansA45it.woff new file mode 100644 index 0000000000..258c089801 Binary files /dev/null and b/static/assets/fonts/core-sans/CoreSansA45it.woff differ diff --git a/static/assets/fonts/core-sans/CoreSansA45it.woff2 b/static/assets/fonts/core-sans/CoreSansA45it.woff2 new file mode 100644 index 0000000000..6efa0d14b9 Binary files /dev/null and b/static/assets/fonts/core-sans/CoreSansA45it.woff2 differ diff --git a/static/assets/images/calendar/2024-09-12-emberfest/event-logo.png b/static/assets/images/calendar/2024-09-12-emberfest/event-logo.png new file mode 100644 index 0000000000..5243a71167 Binary files /dev/null and b/static/assets/images/calendar/2024-09-12-emberfest/event-logo.png differ diff --git a/utils/transforms/contentParser.js b/utils/transforms/contentParser.js index 3c22e5d898..bdc0c0b45f 100644 --- a/utils/transforms/contentParser.js +++ b/utils/transforms/contentParser.js @@ -13,26 +13,6 @@ module.exports = function (value, outputPath) { const DOM = new JSDOM(value); const document = DOM.window.document; - /** - * Add a span for text-animation - */ - const textAnimations = [...document.querySelectorAll(".text-animation em")]; - if (textAnimations.length) { - textAnimations.forEach(textAnimation => { - const span = document.createElement("span"); - span.classList.add("text-animation__cover"); - return textAnimation.appendChild(span); - }); - } - - const textAnimationsOffset = [...document.querySelectorAll(".text-animation-offset em")]; - if (textAnimationsOffset.length) { - textAnimationsOffset.forEach(textAnimationOffset => { - const span = document.createElement("span"); - span.classList.add("text-animation__cover-offset"); - return textAnimationOffset.appendChild(span); - }); - } /** * Get all the headings inside the post */ @@ -134,8 +114,12 @@ module.exports = function (value, outputPath) { } let formats = ["webp", imageData.fileType]; - if (imageData.fileType === "gif") { - formats = ["gif"]; + let sharpOptions = {}; + if (imageData.fileType === "gif" || imageData.fileType === "webp") { + formats = ["gif", "webp"]; + sharpOptions = { + animated: true, + }; } let url = "./static" + imageData.src; @@ -143,6 +127,7 @@ module.exports = function (value, outputPath) { svgShortCircuit: true, widths: sizes, formats, + sharpOptions, urlPath: imageData.directory, outputDir: "./dist/" + imageData.directory, filenameFormat: function (id, src, width, format) {