diff --git a/src/_includes/components/flow/README.md b/src/_includes/components/flow/README.md new file mode 100644 index 0000000..d809df1 --- /dev/null +++ b/src/_includes/components/flow/README.md @@ -0,0 +1,3 @@ +# Flow + +TODO. diff --git a/src/_includes/components/flow/flow.config.js b/src/_includes/components/flow/flow.config.js new file mode 100644 index 0000000..5d25f77 --- /dev/null +++ b/src/_includes/components/flow/flow.config.js @@ -0,0 +1,28 @@ +module.exports = { + title: "Flow", + context: { + blocks: [ + { + tag: "h1", + text: "About" + }, + { + tag: "p", + class: "subhead", + text: "About our work" + }, + { + tag: "h2", + text: "We Count Team" + }, + { + tag: "h3", + text: "Research Team" + }, + { + tag: "p", + text: "Jutta Treviranus, Principal Investigator" + } + ] + } +}; diff --git a/src/_includes/components/flow/flow.njk b/src/_includes/components/flow/flow.njk new file mode 100644 index 0000000..5b5f279 --- /dev/null +++ b/src/_includes/components/flow/flow.njk @@ -0,0 +1,5 @@ +
+{% for block in params.blocks %} + <{{ block.tag }}{% if block.class %} class="{{ block.class }}"{% endif %}>{{ block.text }} +{% endfor %} +
diff --git a/src/_includes/components/typography/typography.config.js b/src/_includes/components/typography/typography.config.js index 6980c49..29e8b4e 100644 --- a/src/_includes/components/typography/typography.config.js +++ b/src/_includes/components/typography/typography.config.js @@ -9,28 +9,21 @@ module.exports = { title: "Header Level 1", context: { level: "h1", - text: "We Count" + text: "IDRC’s Inclusive Artificial Intelligence (AI) Initiatives" } }, { title: "Header Level 2", context: { level: "h2", - text: "Challenges" + text: "IDRC’s Inclusive Artificial Intelligence (AI) Initiatives" } }, { title: "Header Level 3", context: { level: "h3", - text: "Research Team" - } - }, - { - title: "Header Level 4", - context: { - level: "h4", - text: "Participation" + text: "IDRC’s Inclusive Artificial Intelligence (AI) Initiatives" } }, { @@ -38,14 +31,14 @@ module.exports = { context: { level: "p", levelClass: "subhead", - text: "Explore We Count project activities" + text: "IDRC’s Inclusive Artificial Intelligence (AI) Initiatives" } }, { title: "Paragraph", context: { level: "p", - text: "We Count is a community-driven project to address the inherent bias against small minorities and outliers in artificial intelligence and data analytics. Disability often places you at the margins of a data set. More and more critical decisions are made and automated using data. Current artificial intelligence can automate and amplify existing discrimination." + text: "We Count is a community-driven project to address the inherent bias against small minorities and outliers in artificial intelligence (AI) and data analytics. Disability often places you at the margins of a data set. More and more critical decisions are made and automated using data. Current artificial intelligence can automate and amplify existing discrimination." } } ] diff --git a/src/_includes/design-system/previews/preview-default.njk b/src/_includes/design-system/previews/preview-default.njk index e475030..585bc0d 100644 --- a/src/_includes/design-system/previews/preview-default.njk +++ b/src/_includes/design-system/previews/preview-default.njk @@ -1,3 +1,3 @@ -
+
{{ comp | safe }} -
+ diff --git a/src/static/css/_layout.css b/src/static/css/_layout.css new file mode 100644 index 0000000..e849f99 --- /dev/null +++ b/src/static/css/_layout.css @@ -0,0 +1,12 @@ +article { + padding-block: 0 1.6875rem; + padding-inline: 1.6875rem; +} + +.flow > * + * { + margin-block-start: var(--flow-space, 1em); +} + +.p-m { + padding: 1.6875rem; +} diff --git a/src/static/css/_typography.css b/src/static/css/_typography.css new file mode 100644 index 0000000..229b2de --- /dev/null +++ b/src/static/css/_typography.css @@ -0,0 +1,179 @@ +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: normal; + font-weight: 400; + src: url("../fonts/Montserrat-Regular.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: italic; + font-weight: 400; + src: url("../fonts/Montserrat-Italic.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: normal; + font-weight: 500; + src: url("../fonts/Montserrat-Medium.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: italic; + font-weight: 500; + src: url("../fonts/Montserrat-MediumItalic.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: normal; + font-weight: 600; + src: url("../fonts/Montserrat-SemiBold.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: italic; + font-weight: 600; + src: url("../fonts/Montserrat-SemiBoldItalic.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: normal; + font-weight: 700; + src: url("../fonts/Montserrat-Bold.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: Montserrat; + font-style: italic; + font-weight: 700; + src: url("../fonts/Montserrat-BoldItalic.woff2") format("woff2"); +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: normal; + font-weight: 400; + src: url("../fonts/MontserratAlternates-Regular.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: italic; + font-weight: 400; + src: url("../fonts/MontserratAlternates-Italic.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: normal; + font-weight: 500; + src: url("../fonts/MontserratAlternates-Medium.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: italic; + font-weight: 500; + src: url("../fonts/MontserratAlternates-MediumItalic.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: normal; + font-weight: 600; + src: url("../fonts/MontserratAlternates-SemiBold.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: italic; + font-weight: 600; + src: url("../fonts/MontserratAlternates-SemiBoldItalic.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: normal; + font-weight: 700; + src: url("../fonts/MontserratAlternates-Bold.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +@font-face { + font-display: swap; + font-family: "Montserrat Alternates"; + font-style: italic; + font-weight: 700; + src: url("../fonts/MontserratAlternates-BoldItalic.woff2") format("woff2"); + unicode-range: U+0049, U+006C; +} + +body { + font-family: "Montserrat Alternates", Montserrat, sans-serif; +} + +h1 { + color: var(--fl-fgColor, #000); + font-size: clamp(1.5rem, 0.6304rem + 4.3478vw, 4rem); + font-weight: 700; + line-height: normal; +} + +h2 { + border-block-end: 0.3125rem solid #fdcc70; + color: var(--fl-fgColor, #000); + font-size: clamp(1.25rem, 0.9891rem + 1.3043vw, 2rem); + font-weight: 700; + line-height: 1.5; +} + +h3 { + color: var(--fl-fgColor, #000); + font-size: clamp(0.875rem, 0.6576rem + 1.087vw, 1.5rem); + font-weight: 600; + line-height: 1.5; +} + +p, +li, +.subhead { + color: var(--fl-fgColor, #000); + font-size: clamp(0.875rem, 0.6576rem + 1.087vw, 1.5rem); + font-style: normal; + line-height: 1.5; +} + +.subhead { + font-weight: 500; +} + +p, +li { + font-weight: 400; +} diff --git a/src/static/css/main.css b/src/static/css/main.css index dfabe67..1542fba 100644 --- a/src/static/css/main.css +++ b/src/static/css/main.css @@ -1 +1,3 @@ @import "../design-system/css/reset.css"; +@import "_typography.css"; +@import "_layout.css"; diff --git a/src/static/fonts/Montserrat-Bold.woff2 b/src/static/fonts/Montserrat-Bold.woff2 new file mode 100644 index 0000000..b556611 Binary files /dev/null and b/src/static/fonts/Montserrat-Bold.woff2 differ diff --git a/src/static/fonts/Montserrat-BoldItalic.woff2 b/src/static/fonts/Montserrat-BoldItalic.woff2 new file mode 100644 index 0000000..02b272c Binary files /dev/null and b/src/static/fonts/Montserrat-BoldItalic.woff2 differ diff --git a/src/static/fonts/Montserrat-Italic.woff2 b/src/static/fonts/Montserrat-Italic.woff2 new file mode 100644 index 0000000..66f5dc3 Binary files /dev/null and b/src/static/fonts/Montserrat-Italic.woff2 differ diff --git a/src/static/fonts/Montserrat-Medium.woff2 b/src/static/fonts/Montserrat-Medium.woff2 new file mode 100644 index 0000000..2987592 Binary files /dev/null and b/src/static/fonts/Montserrat-Medium.woff2 differ diff --git a/src/static/fonts/Montserrat-MediumItalic.woff2 b/src/static/fonts/Montserrat-MediumItalic.woff2 new file mode 100644 index 0000000..6c25694 Binary files /dev/null and b/src/static/fonts/Montserrat-MediumItalic.woff2 differ diff --git a/src/static/fonts/Montserrat-Regular.woff2 b/src/static/fonts/Montserrat-Regular.woff2 new file mode 100644 index 0000000..e26882d Binary files /dev/null and b/src/static/fonts/Montserrat-Regular.woff2 differ diff --git a/src/static/fonts/Montserrat-SemiBold.woff2 b/src/static/fonts/Montserrat-SemiBold.woff2 new file mode 100644 index 0000000..1f20ea7 Binary files /dev/null and b/src/static/fonts/Montserrat-SemiBold.woff2 differ diff --git a/src/static/fonts/Montserrat-SemiBoldItalic.woff2 b/src/static/fonts/Montserrat-SemiBoldItalic.woff2 new file mode 100644 index 0000000..866fac7 Binary files /dev/null and b/src/static/fonts/Montserrat-SemiBoldItalic.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-Bold.woff2 b/src/static/fonts/MontserratAlternates-Bold.woff2 new file mode 100644 index 0000000..d381413 Binary files /dev/null and b/src/static/fonts/MontserratAlternates-Bold.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-BoldItalic.woff2 b/src/static/fonts/MontserratAlternates-BoldItalic.woff2 new file mode 100644 index 0000000..dd6f3fa Binary files /dev/null and b/src/static/fonts/MontserratAlternates-BoldItalic.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-Italic.woff2 b/src/static/fonts/MontserratAlternates-Italic.woff2 new file mode 100644 index 0000000..2722eff Binary files /dev/null and b/src/static/fonts/MontserratAlternates-Italic.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-Medium.woff2 b/src/static/fonts/MontserratAlternates-Medium.woff2 new file mode 100644 index 0000000..34e5ca7 Binary files /dev/null and b/src/static/fonts/MontserratAlternates-Medium.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-MediumItalic.woff2 b/src/static/fonts/MontserratAlternates-MediumItalic.woff2 new file mode 100644 index 0000000..7e66b0a Binary files /dev/null and b/src/static/fonts/MontserratAlternates-MediumItalic.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-Regular.woff2 b/src/static/fonts/MontserratAlternates-Regular.woff2 new file mode 100644 index 0000000..3e676d9 Binary files /dev/null and b/src/static/fonts/MontserratAlternates-Regular.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-SemiBold.woff2 b/src/static/fonts/MontserratAlternates-SemiBold.woff2 new file mode 100644 index 0000000..5343a07 Binary files /dev/null and b/src/static/fonts/MontserratAlternates-SemiBold.woff2 differ diff --git a/src/static/fonts/MontserratAlternates-SemiBoldItalic.woff2 b/src/static/fonts/MontserratAlternates-SemiBoldItalic.woff2 new file mode 100644 index 0000000..aa43bda Binary files /dev/null and b/src/static/fonts/MontserratAlternates-SemiBoldItalic.woff2 differ diff --git a/src/static/fonts/martel-v10-latin-700.woff2 b/src/static/fonts/martel-v10-latin-700.woff2 deleted file mode 100644 index eb323e8..0000000 Binary files a/src/static/fonts/martel-v10-latin-700.woff2 and /dev/null differ diff --git a/src/static/fonts/martel-v10-latin-800.woff2 b/src/static/fonts/martel-v10-latin-800.woff2 deleted file mode 100644 index e00a97f..0000000 Binary files a/src/static/fonts/martel-v10-latin-800.woff2 and /dev/null differ diff --git a/src/static/fonts/martel-v10-latin-regular.woff2 b/src/static/fonts/martel-v10-latin-regular.woff2 deleted file mode 100644 index da820a5..0000000 Binary files a/src/static/fonts/martel-v10-latin-regular.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-500.woff2 b/src/static/fonts/mulish-v12-latin-500.woff2 deleted file mode 100644 index 425747b..0000000 Binary files a/src/static/fonts/mulish-v12-latin-500.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-700.woff2 b/src/static/fonts/mulish-v12-latin-700.woff2 deleted file mode 100644 index 612738b..0000000 Binary files a/src/static/fonts/mulish-v12-latin-700.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-800.woff2 b/src/static/fonts/mulish-v12-latin-800.woff2 deleted file mode 100644 index 9df4298..0000000 Binary files a/src/static/fonts/mulish-v12-latin-800.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-800italic.woff2 b/src/static/fonts/mulish-v12-latin-800italic.woff2 deleted file mode 100644 index 9a9d2f2..0000000 Binary files a/src/static/fonts/mulish-v12-latin-800italic.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-italic.woff2 b/src/static/fonts/mulish-v12-latin-italic.woff2 deleted file mode 100644 index 7f41ab7..0000000 Binary files a/src/static/fonts/mulish-v12-latin-italic.woff2 and /dev/null differ diff --git a/src/static/fonts/mulish-v12-latin-regular.woff2 b/src/static/fonts/mulish-v12-latin-regular.woff2 deleted file mode 100644 index 8f02533..0000000 Binary files a/src/static/fonts/mulish-v12-latin-regular.woff2 and /dev/null differ