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.

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

A11y/headings #77

Merged
merged 6 commits into from
Jan 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
2 changes: 1 addition & 1 deletion assets/sass/_theme/_utils.sass
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@
overflow: hidden
img
object-fit: cover
h1, h2, h3, h4
h2, h3
@include h3
a
display: block
Expand Down
10 changes: 6 additions & 4 deletions assets/sass/_theme/blocks/base.sass
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,19 @@
padding-top: $spacing3
padding-bottom: $spacing3
// Mobile & full-width
h2, h3
h2
@include h2
// Desktop with sidebar
@include media-breakpoint-up(desktop)
@include in-page-without-sidebar
h2, h3
h2
@include h5
.top
h2, h3
h2:not(.hidden)
+ .description
margin-top: $spacing2
margin-top: $spacing1
@include media-breakpoint-up(desktop)
margin-top: $spacing2

// Specific
$backgrounded_blocks: ".block-call_to_action, .block-chapter--accent_background, .block-chapter--alt_background, .block-timeline--horizontal, .block-pages--cards"
Expand Down
56 changes: 34 additions & 22 deletions assets/sass/_theme/blocks/image.sass
Original file line number Diff line number Diff line change
Expand Up @@ -27,29 +27,41 @@
width: auto
@include in-page-without-sidebar
@include media-breakpoint-up(desktop)
.block-content
position: relative
.top
position: absolute
width: col(5)
figure
display: flex
align-items: flex-end
> a
width: col(7)
margin-left: half($grid-gutter)
display: block
order: 2
img
max-height: $block-image-max-height-without-sidebar
// max-height: calc(100vh - var(--header-height))
width: auto
max-width: 100%
&.image-portrait
.block-content
position: relative
.top
position: absolute
width: col(5)
figure
display: flex
align-items: flex-end
> a
width: col(7)
margin-left: half($grid-gutter)
display: block
order: 2
picture
margin-left: 0
margin-right: -$grid-gutter
figcaption
width: calc(#{col(5)} + #{$grid-gutter} / 2)
order: 1
display: block
text-align: right
&.image-landscape
picture
margin-left: 0
margin-right: -$grid-gutter
img
max-height: $block-image-max-height-without-sidebar
margin-right: 0
figcaption
width: calc(#{col(5)} + #{$grid-gutter} / 2)
order: 1
display: block
text-align: right
img
max-height: calc(100vh - var(--header-height))
width: auto
display: flex
justify-content: space-between
align-items: baseline
.credit
margin-top: 0
2 changes: 1 addition & 1 deletion assets/sass/_theme/blocks/key_figures.sass
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
@include grid(4, desktop)
&.odd-items
@include grid(3, desktop)
.top + ul
.top:not(.hidden) + ul
margin-top: $spacing2
dl
margin-bottom: 0
Expand Down
9 changes: 4 additions & 5 deletions assets/sass/_theme/blocks/pages.sass
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
aspect-ratio: 16/9
object-fit: cover
width: 100%
h1
h3
@include h3
a
text-decoration: none
Expand All @@ -33,7 +33,7 @@

@include media-breakpoint-down(desktop)
.top
h2, h3
h2
@include h5
.description
@include h2
Expand All @@ -44,7 +44,7 @@
@include media-breakpoint-up(desktop)
.top
@include grid
h2, h3
h2
grid-column: 1 / 5
a
text-decoration: none
Expand Down Expand Up @@ -140,7 +140,6 @@
@include meta
@include icon(arrow, before, true)
padding-right: $spacing0

@include hover-translate-icon(before, 5)
@include link
text-decoration-color: rgba(0,0,0,0)
Expand Down Expand Up @@ -173,7 +172,7 @@
display: block
grid-column: 1 / 8
margin-bottom: 0
.top + .description
.top:not(.hidden) + .description
grid-column: 1 / 8
grid-row: 2 / 3
// Default behavior (without page description)
Expand Down
19 changes: 6 additions & 13 deletions assets/sass/_theme/blocks/posts.sass
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
@include grid(1)
@include grid($block-posts-grid-columns, desktop)
article
h1
h3
a
@include stretched-link
text-decoration: none
Expand Down Expand Up @@ -48,24 +48,17 @@
display: flex
flex-direction: column
// width: 70%
h1
h3
margin-bottom: 0
time
margin-top: half($spacing0)
order: 2
p
margin-top: half($spacing0)
order: 4
// h1, time, p
// padding-right: calc(30% + #{$spacing1})
.media
display: none
order: 3
// position: absolute
// width: 30%

// top: 0
// right: 0

@include in-page-with-sidebar
article
Expand Down Expand Up @@ -102,7 +95,7 @@
margin-top: 0.3em
&--highlight
.highlight-post
h1
h3
margin-bottom: $spacing0
.media
margin-bottom: $spacing0
Expand Down Expand Up @@ -134,7 +127,7 @@
.list
article
@include grid(8, desktop, 0, 0)
h1
h3
grid-column: 1 / 7
.post-categories
grid-column: 1 / 7
Expand All @@ -154,11 +147,11 @@

@include media-breakpoint-up(desktop)
.highlight
h1
h3
@include h2
.list
article
h1
h3
@include h4
@include in-page-without-sidebar
.highlight
Expand Down
3 changes: 2 additions & 1 deletion assets/sass/_theme/blocks/timeline.sass
Original file line number Diff line number Diff line change
Expand Up @@ -111,8 +111,9 @@
width: 50%

.title
display: block
min-height: var(--min-title-height)
margin-bottom: $spacing1
padding-bottom: $spacing1
@include signature
.description
@include small
Expand Down
3 changes: 3 additions & 0 deletions assets/sass/_theme/design-system/layout.sass
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,9 @@ iframe
.hero + &
margin-top: $spacing3

.hidden
display: none

ul,
ol
// https://since1979.dev/aligning-your-lists-with-your-text/
Expand Down
2 changes: 1 addition & 1 deletion assets/sass/_theme/sections/organizations.sass
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
.organization
@include article
position: relative
h1
h2
@include meta
a
@include stretched-link
Expand Down
4 changes: 2 additions & 2 deletions assets/sass/_theme/sections/posts.sass
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
margin-bottom: $spacing1
padding-bottom: $spacing1
flex-direction: row
h1 + p
h2 + p, h3 + p
margin-top: $spacing0
@include media-breakpoint-up(desktop)
@include grid
Expand Down Expand Up @@ -58,7 +58,7 @@
right: 0
top: 0
div:not(.media)
h1, h2, h3,
h2, h3,
p
max-width: col(6, 9)
.posts--grid
Expand Down
6 changes: 4 additions & 2 deletions assets/sass/_theme/sections/programs.sass
Original file line number Diff line number Diff line change
Expand Up @@ -103,11 +103,13 @@ ol.programs
.blocks
section > * + *
margin-top: 0
h3
h2
@include h3
@include media-breakpoint-down(desktop)
padding-top: $spacing3
margin-left: half(-$grid-gutter-sm)
margin-right: half(-$grid-gutter-sm)

@include media-breakpoint-up(desktop)
.container
padding-left: 0
Expand All @@ -117,7 +119,7 @@ ol.programs
@include media-breakpoint-down(desktop)
.document-content
.content
h2
> h2
margin-bottom: $spacing2
section:not(:first-child):not(.block)
margin-top: $spacing3
Expand Down
39 changes: 39 additions & 0 deletions i18n/en.yml
Original file line number Diff line number Diff line change
@@ -1,3 +1,42 @@
blocks:
call_to_action:
title: Call to action
chapter:
title: Chapter
contact:
title: Contact
datatable:
title: Table
definitions:
title: Definitions
embed:
title: HTML embed
files:
title: Files
gallery:
title: Gallery
image:
title: Image
key_figures:
title: Key figures
organization_chart:
title: People
pages:
title: Pages
partners:
title: Organizations
posts:
title: Posts
programs:
title: Programs
testimonials:
title: Testimonials
timeline:
title: Timeline
next: Next element
previous: Previous element
video:
title: Video
categories:
no_post: No post in this category
see_more:
Expand Down
45 changes: 40 additions & 5 deletions i18n/fr.yml
Original file line number Diff line number Diff line change
@@ -1,3 +1,42 @@
blocks:
call_to_action:
title: Appel à actions
chapter:
title: Chapitre
contact:
title: Contact
datatable:
title: Tableau
definitions:
title: Définitions
embed:
title: Intégration HTML
files:
title: Fichiers
gallery:
title: Galerie
image:
title: Image
key_figures:
title: Chiffres-clés
organization_chart:
title: Personnes
pages:
title: Pages
partners:
title: Organisations
posts:
title: Actualités
programs:
title: Formations
testimonials:
title: Témoignages
timeline:
title: Frise chronologique
next: Élément suivant
previous: Élément précédent
video:
title: Vidéo
categories:
no_post: Aucun article dans cette catégorie
see_more:
Expand Down Expand Up @@ -178,8 +217,4 @@ volumes:
plural_name: Volumes
singular_name: Volume
table_contents: Table des matières
volume_number: Volume {{ .Number }}
blocks:
timeline:
next: Élément suivant
previous: Élément précédent
volume_number: Volume {{ .Number }}
1 change: 1 addition & 0 deletions layouts/partials/blocks/default_title.html
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<h2 class="hidden">{{- i18n (printf "blocks.%s.title" . ) -}}</h2>
Loading