From 2e80898b0dad6139b6bef465388a6e24db55724c Mon Sep 17 00:00:00 2001 From: Jennifer Mealing Date: Mon, 15 Apr 2024 10:55:01 -0400 Subject: [PATCH] Minor - Gc intro block (#2229) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * intro block * Update gc-intro-block-en.html * Update gc-intro-block-en.html * run html formatter, add property, etc to h1 * manually fix indents * add fr to json file * add available FR content * create and link demo page * move to folder * fr text available * Create ip-cover-image-1200x726.jpg * Update design-patterns/gc-intro/gc-intro-block-demos-en.html Co-authored-by: Garneauma Update design-patterns/gc-intro/gc-intro-block-demos-en.html Co-authored-by: Garneauma Update design-patterns/gc-intro/gc-intro-block-demos-fr.html Co-authored-by: Garneauma Update design-patterns/gc-intro/gc-intro-block-demos-fr.html Co-authored-by: Garneauma * Intro block: converting to data-first documentation * Intro block: new doc template, small doc edits --------- Co-authored-by: Garneauma Co-authored-by: Marc-André Garneau --- _data/design-patterns.json | 2 +- .../gc-intro/gc-intro-image.html | 11 + .../design-patterns/gc-intro/gc-intro.html | 3 + design-patterns/gc-intro/gc-intro-doc-en.html | 9 + design-patterns/gc-intro/gc-intro-doc-fr.html | 9 + design-patterns/gc-intro/gc-intro-en.html | 20 ++ design-patterns/gc-intro/gc-intro-fr.html | 20 ++ .../gc-intro/gc-intro-image-en.html | 20 ++ .../gc-intro/gc-intro-image-fr.html | 21 ++ .../gc-intro/img/ip-cover-image-1200x726.jpg | Bin 0 -> 20702 bytes design-patterns/gc-intro/index.json-ld | 220 ++++++++++++++++++ .../gc-intro/samples/gc-intro-image.html | 11 + .../gc-intro/samples/gc-intro.html | 3 + 13 files changed, 348 insertions(+), 1 deletion(-) create mode 100644 _includes/design-patterns/gc-intro/gc-intro-image.html create mode 100644 _includes/design-patterns/gc-intro/gc-intro.html create mode 100644 design-patterns/gc-intro/gc-intro-doc-en.html create mode 100644 design-patterns/gc-intro/gc-intro-doc-fr.html create mode 100644 design-patterns/gc-intro/gc-intro-en.html create mode 100644 design-patterns/gc-intro/gc-intro-fr.html create mode 100644 design-patterns/gc-intro/gc-intro-image-en.html create mode 100644 design-patterns/gc-intro/gc-intro-image-fr.html create mode 100644 design-patterns/gc-intro/img/ip-cover-image-1200x726.jpg create mode 100644 design-patterns/gc-intro/index.json-ld create mode 100644 design-patterns/gc-intro/samples/gc-intro-image.html create mode 100644 design-patterns/gc-intro/samples/gc-intro.html diff --git a/_data/design-patterns.json b/_data/design-patterns.json index 7bb16d6a74..640dd4e0d0 100644 --- a/_data/design-patterns.json +++ b/_data/design-patterns.json @@ -113,4 +113,4 @@ } ] } -] +] \ No newline at end of file diff --git a/_includes/design-patterns/gc-intro/gc-intro-image.html b/_includes/design-patterns/gc-intro/gc-intro-image.html new file mode 100644 index 0000000000..2fddb5f8e6 --- /dev/null +++ b/_includes/design-patterns/gc-intro/gc-intro-image.html @@ -0,0 +1,11 @@ +
+
+
+
+

{{ page.title }}

+

{% if page.language == "en" %}The introduction block pattern introduces the content of a landing page.{% else %}La configuration de conception du bloc d'introduction introduit le contenu d'une page de destination.{% endif %}

+

{% if page.language == "en" %}Supertask button{% else %}Bouton de super-tâche{% endif %}

+
+
+
+
diff --git a/_includes/design-patterns/gc-intro/gc-intro.html b/_includes/design-patterns/gc-intro/gc-intro.html new file mode 100644 index 0000000000..40434a06ea --- /dev/null +++ b/_includes/design-patterns/gc-intro/gc-intro.html @@ -0,0 +1,3 @@ +

{{ page.title }}

+

{% if page.language == "en" %}The introduction block pattern introduces the content of a landing page.{% else %}La configuration de conception du bloc d'introduction introduit le contenu d'une page de destination.{% endif %}

+

{% if page.language == "en" %}Supertask button{% else %}Bouton de super-tâche{% endif %}

diff --git a/design-patterns/gc-intro/gc-intro-doc-en.html b/design-patterns/gc-intro/gc-intro-doc-en.html new file mode 100644 index 0000000000..e857f19897 --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-doc-en.html @@ -0,0 +1,9 @@ +--- +title: Introduction block +description: Documentation for the introduction block design pattern. +language: en +altLangPage: gc-intro-doc-fr.html +dateModified: 2024-03-14 +layout: documentation_pattern +index_json: index.json-ld +--- diff --git a/design-patterns/gc-intro/gc-intro-doc-fr.html b/design-patterns/gc-intro/gc-intro-doc-fr.html new file mode 100644 index 0000000000..0af014ea83 --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-doc-fr.html @@ -0,0 +1,9 @@ +--- +title: Bloc d’introduction +description: Documentation de la configuration de conception du bloc d’introduction. +language: fr +altLangPage: gc-intro-doc-en.html +dateModified: 2024-03-14 +layout: documentation_pattern +index_json: index.json-ld +--- diff --git a/design-patterns/gc-intro/gc-intro-en.html b/design-patterns/gc-intro/gc-intro-en.html new file mode 100644 index 0000000000..91aefb69bc --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-en.html @@ -0,0 +1,20 @@ +--- +{ + "title": "Introduction block", + "language": "en", + "altLangPage": "gc-intro-fr.html", + "dateModified": "2024-03-14", + "breadcrumbs": [ + { "title": "Introduction block - documentation", "link": "design-patterns/gc-intro/gc-intro-doc-en.html" } + ], + "layout": "without-h1", +} +--- +
+ +
+ {% include_relative samples/gc-intro.html %} + +

Code sample

+ {% highlight html %}{% include_relative samples/gc-intro.html %}{% endhighlight %} +
diff --git a/design-patterns/gc-intro/gc-intro-fr.html b/design-patterns/gc-intro/gc-intro-fr.html new file mode 100644 index 0000000000..d8b784a768 --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-fr.html @@ -0,0 +1,20 @@ +--- +{ + "title": "Bloc d'introduction", + "language": "fr", + "altLangPage": "gc-intro-en.html", + "dateModified": "2024-03-14", + "breadcrumbs": [ + { "title": "Bloc d'introduction - documentation", "link": "design-patterns/gc-intro/gc-intro-doc-fr.html" } + ], + "layout": "without-h1", +} +--- +
+ +
+ {% include_relative samples/gc-intro.html %} + +

Code

+ {% highlight html %}{% include_relative samples/gc-intro.html %}{% endhighlight %} +
diff --git a/design-patterns/gc-intro/gc-intro-image-en.html b/design-patterns/gc-intro/gc-intro-image-en.html new file mode 100644 index 0000000000..9340af1070 --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-image-en.html @@ -0,0 +1,20 @@ +--- +{ + "title": "Introduction block with image", + "language": "en", + "altLangPage": "gc-intro-image-fr.html", + "dateModified": "2024-03-14", + "breadcrumbs": [ + { "title": "Introduction block - documentation", "link": "design-patterns/gc-intro/gc-intro-doc-en.html" } + ], + "layout": "no-container" +} +--- +
+ +{% include_relative samples/gc-intro-image.html %} + +
+

Code sample

+ {% highlight html %}{% include_relative samples/gc-intro-image.html %}{% endhighlight %} +
diff --git a/design-patterns/gc-intro/gc-intro-image-fr.html b/design-patterns/gc-intro/gc-intro-image-fr.html new file mode 100644 index 0000000000..4751dcc3c1 --- /dev/null +++ b/design-patterns/gc-intro/gc-intro-image-fr.html @@ -0,0 +1,21 @@ +--- +{ + "title": "Bloc d'introduction avec image", + "language": "fr", + "altLangPage": "gc-intro-image-en.html", + "layout": "no-container", + "dateModified": "2024-03-14", + "breadcrumbs": [ + { "title": "Bloc d'introduction - documentation", "link": "design-patterns/gc-intro/gc-intro-doc-fr.html" } + ], + "layout": "no-container" +} +--- +
+ +{% include_relative samples/gc-intro-image.html %} + +
+

Code

+ {% highlight html %}{% include_relative samples/gc-intro-image.html %}{% endhighlight %} +
diff --git a/design-patterns/gc-intro/img/ip-cover-image-1200x726.jpg b/design-patterns/gc-intro/img/ip-cover-image-1200x726.jpg new file mode 100644 index 0000000000000000000000000000000000000000..a1e1f75fea32d018e0459dbce7e830fa253d25e2 GIT binary patch literal 20702 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 WX(tt{qm;I|UfpE>qw)4~*M9&h#m*c6 literal 0 HcmV?d00001 diff --git a/design-patterns/gc-intro/index.json-ld b/design-patterns/gc-intro/index.json-ld new file mode 100644 index 0000000000..661eeba6ac --- /dev/null +++ b/design-patterns/gc-intro/index.json-ld @@ -0,0 +1,220 @@ +{ + "@context": { + "@version": 1.1, + "dct": "http://purl.org/dc/terms/", + "title": { "@id": "dct:title", "@container": "@language" }, + "description": { "@id": "dct:description", "@container": "@language" }, + "modified": "dct:modified" + }, + "title": { + "en": "Introduction block - Documentation and working example", + "fr": "Bloc d’introduction - Documentation et example pratique" + }, + "description": { + "en": "Guidance about using the introduction block pattern on Canada.ca.", + "fr": "Orientation sur l’utilisation de la configuration de conception du bloc d’introduction sur Canada.ca." + }, + "modified": "2023-08-16", + "componentName": "gc-intro", + "pages": { + "docs": [ + { + "title": "Introduction block", + "language": "en", + "path": "gc-intro-doc-en.html" + }, + { + "title": "Bloc d’introduction", + "language": "fr", + "path": "gc-intro-doc-fr.html" + } + ], + "examples": [ + { + "title": "Introduction block", + "language": "en", + "path": "gc-intro-en.html" + }, + { + "title": "Bloc d’introduction", + "language": "fr", + "path": "gc-intro-fr.html" + }, + { + "title": "Introduction block with image", + "language": "en", + "path": "gc-intro-image-en.html" + }, + { + "title": "Bloc d’introduction avec image", + "language": "fr", + "path": "gc-intro-image-fr.html" + } + ] + }, + "dependencies": [ + "bgimg" + ], + "a11yGuidance": "No accessibility guidance.", + "variations": [ + { + "name": { + "en": "Introduction block - default", + "fr": "Bloc d'introduction - par défaut" + }, + "description": { + "en": "The introduction block pattern introduces the content of a landing page.", + "fr": "La configuration de conception du bloc d’introduction introduit le contenu d’une page d’accueil." + }, + "guidance": { + "en": "https://design.canada.ca/common-design-patterns/intro-block.html", + "fr": "https://conception.canada.ca/configurations-conception-communes/block-introduction.html" + }, + "iteration": "_:iteration_intro_1", + "example": [ + { + "en": { "href": "gc-intro-en.html", "text": "Introduction block" }, + "fr": { "href": "gc-intro-fr.html", "text": "Bloc d'introduction" } + } + ], + "implementation": [ + "_:implement_intro" + ], + "history": [ + { + "en": "March 2024 - Initial implementation of the variation.", + "fr": "Mars 2024 - Implémentation initiale de la variante." + } + ] + }, + { + "name": { + "en": "Introduction block with image", + "fr": "Bloc d'introduction avec image" + }, + "description": { + "en": "The introduction block pattern introduces the content of a landing page. This variation can contain an image and a super task button.", + "fr": "La configuration de conception du bloc d’introduction introduit le contenu d’une page d’accueil. Cette variation peur contenir une image." + }, + "guidance": { + "en": "https://design.canada.ca/common-design-patterns/intro-block.html", + "fr": "https://conception.canada.ca/configurations-conception-communes/block-introduction.html" + }, + "example": [ + { + "en": { "href": "gc-intro-image-en.html", "text": "Introduction block with image" }, + "fr": { "href": "gc-intro-image-fr.html", "text": "Bloc d'introduction avec image" } + } + ], + "implementation": [ + "_:implement_intro_image" + ], + "history": [ + { + "en": "March 2024 - Initial implementation of the variation.", + "fr": "Mars 2024 - Implémentation initiale de la variante." + } + ] + } + ], + "implementation": [ + { + "@id": "_:implement_intro", + "iteration": "_:iteration_intro_1", + "name": { + "en": "Standard", + "fr": "Standard" + }, + "introduction": { + "en": "This implementation is meant for developers/publishers adding the component manually.", + "fr": "Cette implémentation est destinée aux développeurs/éditeurs qui ajoutent le composant manuellement." + }, + "instructions": { + "en": [ + "The introduction block pattern is a mandatory element for institutional landing pages and topic pages. It’s optional for other landing pages.", + "According to the Canada.ca design system guidance, the introduction block with image contains the following elements:
  • title (mandatory)
  • short description (mandatory)
  • supertask button (optional)
", + "Refer to the code sample below." + ], + "fr": [ + "La configuration de conception du bloc d’introduction est un élément obligatoire pour les pages d’accueil institutionnelles et les pages de sujet. Elle est facultative pour les autres pages d’accueil.", + "Selon les directives du système de conception Canada.ca, le bloc d'introduction avec image contient les éléments suivants :
  • titre (obligatoire)
  • description courte (obligatoire)
  • bouton de super-tâche (facultatif)
", + "Référez-vous au code qui suit." + ] + }, + "sample": { + "en": [ + { + "@type": "source-code", + "description": "Code sample:", + "code": "

Introduction block

\n

The introduction block pattern introduces the content of a landing page.

\n

Super task button

" + } + ], + "fr": [ + { + "@type": "source-code", + "description": "Exemple de code :", + "code": "

Bloc d'introduction

\n

La configuration de conception du bloc d’introduction introduit le contenu d’une page d’accueil.

\n

Bouton de super-tâche

" + } + ] + } + }, + { + "@id": "_:implement_intro_image", + "iteration": "_:iteration_intro_image_1", + "name": { + "en": "Standard", + "fr": "Standard" + }, + "introduction": { + "en": "This implementation is meant for developers/publishers adding the component manually.", + "fr": "Cette implémentation est destinée aux développeurs/éditeurs qui ajoutent le composant manuellement." + }, + "instructions": { + "en": [ + "The introduction block pattern is a mandatory element for institutional landing pages and topic pages. It’s optional for other landing pages.", + "According to the Canada.ca design system guidance, the introduction block with image contains the following elements:
  • title (mandatory)
  • short description (mandatory)
  • image (mandatory)
  • supertask button (optional)
", + "Refer to the code sample below." + ], + "fr": [ + "La configuration de conception du bloc d’introduction est un élément obligatoire pour les pages d’accueil institutionnelles et les pages de sujet. Elle est facultative pour les autres pages d’accueil.", + "Selon les directives du système de conception Canada.ca, le bloc d'introduction avec image contient les éléments suivants :
  • titre (obligatoire)
  • description courte (obligatoire)
  • image (obligatoire)
  • bouton de super-tâche (facultatif)
", + "Référez-vous au code qui suit." + ] + }, + "techConsiderations": { + "en": [ + "It is the responsibility of the author to make sure the whole text has a minimum contrast ratio of 4:1 with the background image on every breakpoint and with a zoom of up to 400%.", + "The background image size recommended is 1200px by 726px. For more information on the background image, please consult the official guidelines." + ], + "fr": [ + "Il est de la responsabilité de l'auteur de s'assurer que l'ensemble du texte présente un rapport de contraste minimum de 4:1 avec l'image d'arrière-plan sur chaque point d'arrêt et avec un zoom allant jusqu'à 400 %.", + "La taille de l’image d’arrière-plan recommandée est de 1200px par 726px. Pour plus d'information sur l'image d'arrière-plan, veuillez consulter les directives officielles." + ] + }, + "notes": { + "en": [ + "The introduction block pattern with image must be located outside of the default page container (or any element with the class .container)." + ], + "fr": [ + "La configuration de conception du bloc d’introduction avec image doit être située en dehors du conteneur de page par défaut (ou de tout élément avec la classe .container)." + ] + }, + "sample": { + "en": [ + { + "@type": "source-code", + "description": "Code sample:", + "code": "
\n\t
\n\t\t
\n\t\t\t
\n\t\t\t\t

[Institution name]

\n\t\t\t\t

Short description of the institution’s mandate.

\n\t\t\t\t

Super task button

\n\t\t\t
\n\t\t
\n\t
\n
" + } + ], + "fr": [ + { + "@type": "source-code", + "description": "Exemple de code :", + "code": "
\n\t
\n\t\t
\n\t\t\t
\n\t\t\t\t

[Nom de l’institution]

\n\t\t\t\t

Description courte du mandat de d’institution.

\n\t\t\t\t

Bouton de super-tâche

\n\t\t\t
\n\t\t
\n\t
\n
" + } + ] + } + } + ] +} diff --git a/design-patterns/gc-intro/samples/gc-intro-image.html b/design-patterns/gc-intro/samples/gc-intro-image.html new file mode 100644 index 0000000000..2fddb5f8e6 --- /dev/null +++ b/design-patterns/gc-intro/samples/gc-intro-image.html @@ -0,0 +1,11 @@ +
+
+
+
+

{{ page.title }}

+

{% if page.language == "en" %}The introduction block pattern introduces the content of a landing page.{% else %}La configuration de conception du bloc d'introduction introduit le contenu d'une page de destination.{% endif %}

+

{% if page.language == "en" %}Supertask button{% else %}Bouton de super-tâche{% endif %}

+
+
+
+
diff --git a/design-patterns/gc-intro/samples/gc-intro.html b/design-patterns/gc-intro/samples/gc-intro.html new file mode 100644 index 0000000000..40434a06ea --- /dev/null +++ b/design-patterns/gc-intro/samples/gc-intro.html @@ -0,0 +1,3 @@ +

{{ page.title }}

+

{% if page.language == "en" %}The introduction block pattern introduces the content of a landing page.{% else %}La configuration de conception du bloc d'introduction introduit le contenu d'une page de destination.{% endif %}

+

{% if page.language == "en" %}Supertask button{% else %}Bouton de super-tâche{% endif %}