Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

synchronization #429

Merged
merged 7 commits into from
Mar 19, 2024
Merged

synchronization #429

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
5513493
Update latest changes (Design system)
prycrane Mar 5, 2024
a224e9e
go
Mar 5, 2024
b3094a1
go
Mar 5, 2024
609d135
Merge pull request #427 from canada-ca/ds-latest-changes
donohuech Mar 5, 2024
8a25988
Style Guide: make sure links work
prycrane Mar 7, 2024
f75cfb7
Update index.md
prycrane Mar 7, 2024
a16f61b
Merge pull request #428 from canada-ca/sg-links-work-en
donohuech Mar 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion about/latest-changes.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
altLangPage: "https://conception.canada.ca/a-propos/derniers-changements.html"
date: 2017-10-05
dateModified: 2023-11-07
dateModified: 2024-02-19
description: "Latest changes to the Canada.ca design system"
layout: default
title: "Latest changes to the Canada.ca design system"
Expand All @@ -14,6 +14,10 @@ title: "Latest changes to the Canada.ca design system"
</div>
<div id="expand-collapse">
<details open="open">
<summary>February 19, 2024</summary>
<p>Updated the <a href="{{ site.url }}/styles/typography.html">Typography style</a> to include design specifications for the new main page title (h1) style.</p>
</details>
<details>
<summary>November 7, 2023</summary>
<p>Updated the <a href="{{ site.url }}/common-design-patterns/report-problem.html">Report a problem pattern</a> to inform users that it is being decommissioned. Stabilized the <a href="{{ site.url }}/common-design-patterns/page-feedback.html">Page feedback tool pattern</a> and added content specifications and updated implementation instructions.</p>
</details>
Expand Down
16 changes: 14 additions & 2 deletions style-guide/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
altLangPage: "https://conception.canada.ca/guide-redaction"
date: 2017-10-05
dateModified: 2024-02-14
dateModified: 2024-03-07
description: "The Canada.ca Content Style Guide provides the rules to create web content that can be easily found, understood and used."
title: "Canada.ca Content Style Guide"
---
Expand Down Expand Up @@ -2314,7 +2314,19 @@ title: "Canada.ca Content Style Guide"
</section>
<section id="wp7-3">
<h3>7.3 Make sure that links work</h3>
<p>Make sure that your links work. Check that they take people to the correct page, which contains up-to-date information, in the appropriate official language. Links that don't work frustrate people and hurt the credibility of your content.</p>
<p>Make sure that your links work and point to the correct information. Broken or outdated links are frustrating. They can cause people to lose confidence in your content.</p>
<p>You should check your links and update them as part of your regular content maintenance schedule:</p>
<ul>
<li>fix links that are broken (links that point to a 404 message "Page not found", for example)</li>
<li>make sure that link destinations are correct and have relevant, up-to-date information</li>
<li>evaluate your URL redirects:
<ul>
<li>make sure they are current, redirecting people to the correct page</li>
<li>update your site links so they to point to current links, not to the URLs that are being redirected</li>
</ul>
</li>
<li>verify that links point to the appropriate official language</li>
</ul>
<h4>See how the rule for verifying links applies in French</h4>
<ul>
<li><span lang="fr"><a href="{{ site.urlconception }}/guide-redaction/#wp7-3">7.3 Vérifier que les liens fonctionnent</a></span></li>
Expand Down
143 changes: 40 additions & 103 deletions styles/typography.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,108 +1,45 @@
---
altLangPage: https://conception.canada.ca/styles/typographie.html
date: null
dateModified: '2018-10-01'
date: 2018-10-01
dateModified: 2024-02-19
description: null
title: Typography style
---


<div>

<section>
<p>
<span class="label label-danger">
Mandatory
</span>
</p>
<p>
The typography guidance is mandatory on all pages.
</p>
<p>
<a href="{{ site.url }}/architecture/mandatory-elements.html">
Mandatory elements of the design system
</a>
</p>
<p>
Fonts must be consistent across Canada.ca pages, and should be easily readable across devices. Use a combination of Lato for headings, and Noto sans for body text.
</p>
<h2>
Desktop and tablet default font specification
</h2>
<ul>
<li>
H1: Lato, 38px, bold
</li>
<li>
H2: Lato, 36px, bold
</li>
<li>
H3: Lato, 24px, bold
</li>
<li>
H4: Lato, 22px, bold
</li>
<li>
H5: Lato, 20px, bold
</li>
<li>
H6: Lato, 19px, plain text
</li>
<li>
Body: Noto sans, 20px, plain text
</li>
</ul>
<h2>
Smaller device default font specification
</h2>
<ul>
<li>
H1: Lato, 34px, bold
</li>
<li>
H2: Lato, 32px, bold
</li>
<li>
H3: Lato, 24px, bold
</li>
<li>
H4: Lato, 22px, bold
</li>
<li>
H5: Lato, 20px, bold
</li>
<li>
H6: Lato, 19px, plain text
</li>
<li>
Body: Noto sans, 20px, plain text
</li>
</ul>
<h2>Main page title</h2>
<p>When the H1 is the main title of a page, it includes a red bar as part of the Canada.ca brand.</p>
<p>Specifications for the red bar (formerly known as gc-thickline):</p>
<ul>
<li>alignment: left</li>
<li>colour: #AF3C43</li>
<li>position: 8px or 0.4em underneath the H1 (body is set to 20px)</li>
<li>size: 71px by 3.6px or 3.55em by 0.18em (body is set to 20px)</li>
</ul>
<h2>
Line length
</h2>
<p>
Constrain text line length to 65 characters. This ensures that no lines extend beyond a comfortable reading length.
</p>
<p>
Page layouts may be wider than 65 characters. The line length restriction applies only to lines of text.
</p>
<h2>
Links
</h2>
<p>
Underline links in an underline style that skips descenders.
</p>
</section>
</div>


<p><span class="label label-danger">Mandatory</span></p>
<p>The typography guidance is mandatory on all pages.</p>
<p><a href="{{ site.url }}/architecture/mandatory-elements.html"> Mandatory elements of the design system</a></p>
<p>Fonts must be consistent across Canada.ca pages, and should be easily readable across devices. Use a combination of Lato for headings, and Noto sans for body text.</p>
<h2> Desktop and tablet default font specification</h2>
<ul>
<li>H1: Lato, 38px, bold</li>
<li>H2: Lato, 36px, bold</li>
<li>H3: Lato, 24px, bold</li>
<li>H4: Lato, 22px, bold</li>
<li>H5: Lato, 20px, bold</li>
<li>H6: Lato, 19px, plain text</li>
<li>Body: Noto sans, 20px, plain text</li>
</ul>
<h2> Smaller device default font specification </h2>
<ul>
<li>H1: Lato, 34px, bold</li>
<li>H2: Lato, 32px, bold</li>
<li>H3: Lato, 24px, bold</li>
<li>H4: Lato, 22px, bold</li>
<li>H5: Lato, 20px, bold</li>
<li>H6: Lato, 19px, plain text</li>
<li>Body: Noto sans, 20px, plain text</li>
</ul>
<h2>Main page title</h2>
<p>When the H1 is the main title of a page, it includes a red bar as part of the Canada.ca brand.</p>
<p>Specifications for the red bar (formerly known as gc-thickline):</p>
<ul>
<li>alignment: left</li>
<li>colour: #AF3C43</li>
<li>position: 8px or 0.4em underneath the H1 (body is set to 20px)</li>
<li>size: 71px by 3.6px or 3.55em by 0.18em (body is set to 20px)</li>
</ul>
<h2>Line length</h2>
<p>Constrain text line length to 65 characters. This ensures that no lines extend beyond a comfortable reading length.</p>
<p>Page layouts may be wider than 65 characters. The line length restriction applies only to lines of text.</p>
<h2>Links </h2>
<p>Underline links in an underline style that skips descenders.</p>
Loading