Skip to content

Commit cc5b0a4

Browse files
GarneaumaGarneauma
committed
Thematic AI answers: adding thematic
1 parent c98381d commit cc5b0a4

File tree

6 files changed

+154
-1
lines changed

6 files changed

+154
-1
lines changed

‎_data/méli-mélo.json‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,8 @@
2929
"th-winterlude",
3030
"th-zev",
3131
"th-empathy",
32-
"th-choose-canada"
32+
"th-choose-canada",
33+
"th-ai-answers"
3334
]
3435
}
3536
],
@@ -104,6 +105,10 @@
104105
"nom": "2024-10-datatable-utilities",
105106
"mainpage": "index-en.html"
106107
},
108+
{
109+
"nom": "th-ai-answers",
110+
"mainpage": "index-en.html"
111+
},
107112
{
108113
"nom": "th-choose-canada",
109114
"mainpage": "index.html"

‎méli-mélo/th-ai-answers/ai-answers.js‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
/**
2+
* @title WET-BOEW GC AI answers thematic
3+
* @overview AI answers thematic
4+
* @license wet-boew.github.io/wet-boew/License-en.html / wet-boew.github.io/wet-boew/Licence-fr.html
5+
* @author @garneauma
6+
*/
7+
8+
(function() {
9+
if ( document.querySelector(".aia-trigger") ) {
10+
let pageHeader = document.querySelector("header"),
11+
topBannerHTMLFR = `<aside class=\"aia-banner\">
12+
<h2 class=\"wb-inv\">Outil d'assistance</h2>
13+
<div class=\"container\">
14+
<div class=\"d-flex align-items-center\">
15+
<img src=\"https://canada.ca/content/dam/canada/ai-stars.png\"><p><strong>Besoin d'aide?</strong> <a href=\"https://reponses-ia.alpha.canada.ca\" class=\"text-white\">Essayez une version bêta de Réponses IA</a></p>
16+
</div>
17+
</div>
18+
</aside>`,
19+
topBannerHTMLEN = `<aside class=\"aia-banner\">
20+
<h2 class=\"wb-inv\">Assistance tool</h2>
21+
<div class=\"container\">
22+
<div class=\"d-flex align-items-center\">
23+
<img src=\"https://canada.ca/content/dam/canada/ai-stars.png\"><p><strong>Need help?</strong> <a href=\"https://ai-answers.alpha.canada.ca\" class=\"text-white\">Try a beta test of AI Answers</a></p>
24+
</div>
25+
</div>
26+
</aside>`;
27+
28+
if ( document.documentElement.lang == "fr" ) {
29+
pageHeader.insertAdjacentHTML("beforebegin", topBannerHTMLFR);
30+
} else {
31+
pageHeader.insertAdjacentHTML("beforebegin", topBannerHTMLEN);
32+
}
33+
}
34+
})();

‎méli-mélo/th-ai-answers/index-en.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
---
2+
title: AI answers thematic
3+
dateModified: 2025-11-24
4+
description: AI answers thematic documentation and working example
5+
lang: en
6+
altLangPage: index-fr.html
7+
css:
8+
- style.css
9+
script:
10+
- ai-answers.js
11+
---
12+
13+
<p>This page serves as an example of for AI answers beta testing top banner.</p>
14+
15+
<div class="aia-trigger"></div>
16+
17+
<h2>Intructions</h2>
18+
<p>Insert the following code snippet in your page to activate the AI Answers banner.</p>
19+
<pre><code>&lt;div class="aia-trigger">&lt;/div></code></pre>

‎méli-mélo/th-ai-answers/index-fr.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
---
2+
title: Thématique Réponses IA
3+
dateModified: 2025-11-24
4+
description: Documentation et exemple pratique de Réponses IA
5+
lang: fr
6+
altLangPage: index-en.html
7+
css:
8+
- style.css
9+
script:
10+
- ai-answers.js
11+
---
12+
13+
<p>Cette page sert d'exemple pour la bannière supérieure du test bêta de Réponses IA.</p>
14+
15+
<div class="aia-trigger"></div>
16+
17+
<h2>Intructions</h2>
18+
<p>Insérez le bout de code suivant dans votre page pour activer la bannière Réponses IA.</p>
19+
<pre><code>&lt;div class="aia-trigger">&lt;/div></code></pre>

‎méli-mélo/th-ai-answers/meta.md‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
---
2+
feature: thématique
3+
lang: en
4+
title: AI Answers theme
5+
description: Top banner for AI answers beta testing
6+
componentName: th-empathy
7+
expiry: November 30, 2026
8+
mainPage: index-en.html
9+
cssClass:
10+
- aia-banner
11+
jsFunctions:
12+
- anonymous function
13+
pages:
14+
examples:
15+
- title: AI answers thematic
16+
language: en
17+
path: index0en.html
18+
- title: Thématique réponses IA
19+
language: fr
20+
path: index-fr.html
21+
sponsor: Marc-André Garneau on behalf of Principal Publisher - ESDC
22+
23+
output: false
24+
---

‎méli-mélo/th-ai-answers/style.css‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
/* AI answers components styles */
2+
.aia-banner {
3+
background: #1a2838;
4+
color: #fff;
5+
position: relative;
6+
}
7+
8+
.aia-banner p {
9+
font-size: 1.125rem;
10+
margin: 0;
11+
padding: .75rem 0 .75rem 1rem;
12+
}
13+
14+
/*.aia-banner .aia-close {
15+
background: none;
16+
border: none;
17+
border-radius: 50%;
18+
color: white;
19+
cursor: pointer;
20+
font-family: Arial, sans-serif;
21+
font-size: 32px;
22+
font-weight: normal;
23+
height: 45px;
24+
line-height: 1;
25+
padding: 0;
26+
position: absolute;
27+
right: 2px;
28+
top: 50%;
29+
transform: translateY(-50%);
30+
transition: background-color 0.2s ease;
31+
width: 45px;
32+
}
33+
34+
.aia-banner .aia-close:hover {
35+
background-color: rgb(255, 255, 255, 0.1);
36+
}
37+
38+
.aia-banner .aia-close:focus {
39+
background-color: rgb(255, 255, 255, 0.1);
40+
box-shadow: 0 0 0 2px white;
41+
outline: none;
42+
}*/
43+
44+
@media screen and (max-width: 767px) {
45+
.aia-banner p {
46+
font-size: 1rem;
47+
}
48+
49+
.aia-banner p a {
50+
display: block;
51+
}
52+
}

0 commit comments

Comments
 (0)