Skip to content
Snippets Groups Projects
Unverified Commit 090cd33b authored by Olivia Simonet's avatar Olivia Simonet Committed by GitHub
Browse files

Merge pull request #401 from osunyorg/portfolio-layouts 

Layouts des projets
parents 4ea6f65e 55128316
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 351 additions and 151 deletions
assets/sass/_theme/blocks/pages.sass
+ 14
− 22
View file @ 090cd33b
......@@ -229,32 +229,24 @@
&--alternate
.top
@include top-flex
.grid
article .media img
aspect-ratio: unset
@include media-breakpoint-up(desktop)
article
width: columns(4)
&:not(:first-child)
margin-top: -5%
&:nth-child(even)
margin-left: auto
&.image-portrait
+ .image-portrait
margin-top: -30%
+ .image-square,
+ .image-landscape
margin-top: -15%
.alternate
@include alternate
article
position: relative
display: flex
flex-direction: column
a
@include stretched-link
.media
margin-bottom: $spacing-2
order: -1
img
aspect-ratio: unset
@include in-page-without-sidebar
.top
.description
@include body-text
.grid
width: columns(10)
margin-left: auto
margin-right: auto
article
width: columns(4)
&--large
.top
@include top-flex
......
assets/sass/_theme/blocks/posts.sass
+ 1
− 26
View file @ 090cd33b
......@@ -261,22 +261,8 @@
margin-top: 0
&--alternate .alternate
.post .media img
aspect-ratio: unset
@include alternate
@include media-breakpoint-up(desktop)
&:not(.without-images)
.post
&.right
margin-left: auto
&.portrait
+ .portrait
margin-top: -30%
+ .square,
+ .landscape
margin-top: -15%
+ .post:not(.portrait, .square, .landscape)
margin-top: -5%
&.without-images
.right
margin-left: auto
......@@ -288,7 +274,6 @@
margin-top: -5%
+ .post:not(.portrait, .square, .landscape)
margin-top: -3%
@include media-breakpoint-down(desktop)
.post
.post-meta
......@@ -298,16 +283,6 @@
+ .post
margin-top: $spacing-5
@include in-page-with-sidebar
.post
width: columns(4)
@include in-page-without-sidebar
width: columns(10)
margin-left: auto
margin-right: auto
.post
width: columns(4)
&--carousel
@include draggable-block
.container
......
assets/sass/_theme/blocks/projects.sass
+ 103
− 1
View file @ 090cd33b
.block-projects
.list
.project-title
@include hover-translate-icon
display: flex
align-items: center
text-decoration: none
padding-bottom: $spacing-3
padding-top: $spacing-3
gap: $spacing-3
border-bottom: 1px solid var(--color-border)
@include icon(arrow-right, after)
margin-left: auto
display: inline
opacity: 0
margin-right: $spacing-1
a
flex: 1
text-decoration: none
&:hover
&,
a
color: $color-accent
&::after
opacity: 1
@include in-page-without-sidebar
@include h2
.grid
@include grid(2, md)
\ No newline at end of file
@include grid(2, md)
@include media-breakpoint-down(desktop)
.project + .project
margin-top: $spacing-4
.project-content
align-items: baseline
&--alternate
.alternate
@include media-breakpoint-down(desktop)
.project + .project
margin-top: $spacing-4
@include media-breakpoint-up(desktop)
article
+ article
margin-top: $spacing-6
&:nth-child(odd)
margin-left: auto
@include in-page-with-sidebar
article
width: columns(5)
@include in-page-without-sidebar
.top
.description
@include body-text
article
width: columns(7)
.large
.project
.project-meta
line-height: $body-size
margin-bottom: $spacing-2
margin-top: $spacing-2
time::after
content: ' —'
margin-right: $spacing-1
time,
ul.project-categories
align-self: baseline
display: inline
.project-categories
li
display: inline
+ .project
margin-top: $spacing-4
.more
@include icon(arrow-right, after)
margin-left: $spacing-1
transition: transform 0.55s $arrow-ease-transition
&:hover
.more::after
transform: translateX(5px)
@include media-breakpoint-up(desktop)
.project
align-items: flex-end
flex-direction: row
gap: var(--grid-gutter)
.media
margin-bottom: 0
@include in-page-with-sidebar
.project
&-title
@include h2
margin-bottom: $spacing-1
&-content
flex: 1
.media
flex: 1
@include in-page-without-sidebar
.project
&-title
@include lead
margin-bottom: space(4)
&-content
width: columns(5)
.media
width: columns(7)
\ No newline at end of file
assets/sass/_theme/design-system/backlinks.sass
+ 5
− 1
View file @ 090cd33b
......@@ -6,4 +6,8 @@
.top
display: block
.block-title
width: auto
\ No newline at end of file
width: auto
.block-projects
.project-content
.media img
width: 100%
\ No newline at end of file
assets/sass/_theme/sections/projects.sass
+ 13
− 2
View file @ 090cd33b
.project
@include article(auto)
.project-title
@include article-title
.project-content
p
line-height: $small-line-height
.project-title
@include article-title
.media img
width: 100%
@include media-breakpoint-up(desktop)
.project-content
display: flex
gap: $spacing-2
.project-description
flex: 1
.projects__section,
.projects_categories__term
......
assets/sass/_theme/utils/blocks.sass
+ 26
− 1
View file @ 090cd33b
......@@ -40,4 +40,29 @@
@include icon-block(arrow-next, before)
&:disabled
cursor: default
opacity: 0.3
\ No newline at end of file
opacity: 0.3
@mixin alternate
article
.media img
aspect-ratio: unset
@include media-breakpoint-up(desktop)
width: columns(4)
&:not(:first-child, .without-image)
margin-top: -5%
&:nth-child(odd)
margin-left: auto
&.portrait
+ .portrait
margin-top: -30%
+ .square,
+ .landscape
margin-top: -15%
+ article:not(.portrait, .square, .landscape)
margin-top: -5%
&.square + .square
margin-top: -10%
@include in-page-without-sidebar
width: columns(10)
margin-left: auto
margin-right: auto
\ No newline at end of file
config.yaml
+ 2
− 0
View file @ 090cd33b
......@@ -113,6 +113,8 @@ params:
programs:
related_posts:
quantity: 4
related_events:
quantity: 4
volumes:
default_image: false
......
layouts/partials/blocks/templates/pages/alternate.html
+ 3
− 3
View file @ 090cd33b
......@@ -7,16 +7,16 @@
"attributes" "class='page-title'"
)}}
<div class="grid">
<div class="alternate">
{{ range .pages }}
{{ $page := site.GetPage .file }}
{{ with $page }}
{{ if .Params.image }}
{{ $image_class = printf "image-%s" (partial "GetImageDirection" .Params.image) }}
{{ $image_class = printf (partial "GetImageDirection" .Params.image) }}
{{ else }}
{{ $image_class = "" }}
{{ end }}
<article class="{{ $image_class }}">
<article class="{{ $image_class }} {{- if (not (isset .Params "image")) -}} without-image {{- end -}}">
{{ $heading_tag.open }}
<a href="{{- .Permalink -}}">
{{- partial "PrepareHTML" .Title -}}
......
layouts/partials/blocks/templates/posts.html
+ 1
− 0
View file @ 090cd33b
......@@ -3,6 +3,7 @@
{{- $term := false -}}
{{- $layout := .block.data.layout | default "grid" -}}
{{- with .block.data }}
{{- $options := dict
"hide_image" .hide_image
......
layouts/partials/blocks/templates/posts/highlight.html
+ 3
− 3
View file @ 090cd33b
......@@ -32,10 +32,10 @@
<a href="{{ .Permalink }}" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ if and site.Params.posts.index.show_categories (eq $options.hide_cathegory false) }}
{{ if eq $options.hide_category false }}
{{- partial "posts/categories" . -}}
{{ end }}
{{ if and site.Params.posts.index.show_description (eq $options.hide_summary false) }}
{{ if eq $options.hide_summary false }}
{{- if (partial "GetTextFromHTML" .Params.summary) -}}
<p itemprop="articleBody">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
......@@ -48,7 +48,7 @@
{{- if eq $options.hide_date false -}}
<time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format site.Params.posts.date_format }}</time>
{{ end }}
{{ if and site.Params.posts.index.show_author (eq $options.hide_author false) }}
{{ if eq $options.hide_author false }}
{{- partial "posts/author" . -}}
{{ end }}
</div>
......
layouts/partials/blocks/templates/posts/large.html
+ 3
− 3
View file @ 090cd33b
......@@ -25,19 +25,19 @@
{{ $heading_tag.close }}
<div class="post-meta">
{{ if and site.Params.posts.index.show_author (eq $options.hide_author false) }}
{{ if eq $options.hide_author false }}
{{- partial "posts/author" . -}}
{{ end }}
{{ if eq $options.hide_date false }}
<time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format site.Params.posts.date_format }}</time>
{{ end }}
{{ if and site.Params.posts.index.show_categories (eq $options.hide_cathegory false) }}
{{ if eq $options.hide_category false }}
{{- partial "posts/categories" . -}}
{{ end }}
</div>
{{ if and site.Params.posts.index.show_description (eq $options.hide_summary false) }}
{{ if eq $options.hide_summary false }}
{{- if (partial "GetTextFromHTML" .Params.summary) -}}
<p itemprop="articleBody">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
......
layouts/partials/blocks/templates/projects.html
+ 1
− 1
View file @ 090cd33b
{{- $block := .block -}}
{{- $block_title := .block.title -}}
{{- $block_class := partial "GetBlockClass" .block -}}
{{- $layout := "grid" -}}
{{- $layout := .block.data.layout | default "grid" -}}
{{- with .block.data -}}
<div class="{{ $block_class }}">
......
layouts/partials/blocks/templates/projects/alternate.html 0 → 100644
+ 15
− 0
View file @ 090cd33b
{{ $heading_level := .heading_level | default 3 }}
{{ $heading := printf "h%d" $heading_level }}
<div class="alternate">
{{ range $i, $project := .projects -}}
{{ with site.GetPage .file }}
{{ partial "projects/project.html" (dict
"project" .
"heading" $heading
"alternate" true
"index" $i
) }}
{{ end }}
{{ end }}
</div>
layouts/partials/blocks/templates/projects/large.html 0 → 100644
+ 56
− 0
View file @ 090cd33b
{{ $heading_level := .heading_level | default 3 }}
{{ $heading := printf "h%d" $heading_level }}
<div class="large">
{{ range $project := .projects -}}
{{ with site.GetPage .file }}
{{ $heading_tag := (dict
"open" ((printf "<%s class='project-title' itemprop='name'>" $heading) | safeHTML)
"close" ((printf "</%s>" $heading) | safeHTML)
) }}
<article class="project" itemscope itemtype="https://schema.org/CreativeWork">
<div class="project-content">
<div class="project-description">
{{- $title := partial "PrepareHTML" .Title -}}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" itemprop="url" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ if and site.Params.projects.index.show_description (partial "GetTextFromHTML" .Params.summary) }}
<p itemprop="abstract">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
"length" site.Params.projects.index.truncate_description
) }}
</p>
{{ end }}
<div class="project-meta">
{{ if and site.Params.projects.index.show_year .Params.year }}
<time itemprop="datePublished" datetime="{{ .Params.year }}">{{ .Params.year }}</time>
{{ end }}
{{ if site.Params.projects.index.show_categories }}
{{- partial "projects/categories" . -}}
{{ end }}
</div>
<p class="more meta" aria-hidden="true">{{- i18n "commons.more" -}}</p>
</div>
</div>
<div class="media">
{{- if .Params.image -}}
{{- partial "commons/image.html"
(dict
"image" .Params.image
"sizes" site.Params.image_sizes.sections.projects.item
) -}}
{{- else -}}
{{- partial "commons/image-default.html" "projects" -}}
{{- end -}}
</div>
</article>
{{ end }}
{{ end }}
</div>
layouts/partials/blocks/templates/projects/list.html
+ 12
− 3
View file @ 090cd33b
{{ $heading_level := .heading_level | default 3 }}
{{ $heading := printf "h%d" $heading_level }}
<div class="list">
{{ range $project := .projects -}}
{{ with site.GetPage .file }}
{{ partial "projects/project.html" (dict
"project" .
"heading" $heading
{{ $heading_tag := (dict
"open" ((printf "<%s class='project-title' itemprop='name'>" $heading) | safeHTML)
"close" ((printf "</%s>" $heading) | safeHTML)
) }}
<article class="project" itemscope itemtype="https://schema.org/CreativeWork">
{{- $title := partial "PrepareHTML" .Title -}}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" itemprop="url" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
</article>
{{ end }}
{{ end }}
</div>
layouts/partials/posts/post.html
+ 44
− 46
View file @ 090cd33b
......@@ -15,56 +15,54 @@
{{ with $post }}
{{ if .Params.image }}
{{- $direction = partial "GetImageDirection" .Params.image -}}
{{ end }}
{{ if .Params.image }}
{{- $direction = partial "GetImageDirection" .Params.image -}}
{{ end }}
<article class='post {{ if $alternate }}{{ $direction }} {{if not (modBool $index 2)}}left{{ else}}right{{end}}{{end}}' itemprop="blogPosts" itemscope itemtype="http://schema.org/BlogPosting">
<div class="post-content">
{{- $title := partial "PrepareHTML" .Title -}}
<article class='post {{ if $alternate }} {{- if (not (isset .Params "image")) -}} without-image {{- end -}}{{ $direction }} {{if not (modBool $index 2)}}left{{ else}}right{{end}}{{end}}' itemprop="blogPosts" itemscope itemtype="http://schema.org/BlogPosting">
<div class="post-content">
{{- $title := partial "PrepareHTML" .Title -}}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ if and site.Params.posts.index.show_categories $show_category }}
{{- partial "posts/categories" . -}}
{{ end }}
{{ if $show_category }}
{{- partial "posts/categories" . -}}
{{ end }}
{{ if and site.Params.posts.index.show_description $show_summary }}
{{- if (partial "GetTextFromHTML" .Params.summary) -}}
<p itemprop="articleBody">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
"length" site.Params.posts.index.truncate_description
) }}</p>
{{- end -}}
{{- end -}}
{{ if or $show_author $show_date }}
<div class="post-meta">
{{ if $show_date }}
<time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format site.Params.posts.date_format }}</time>
{{ end }}
{{ if and site.Params.posts.index.show_author $show_author }}
{{- partial "posts/author" . -}}
{{ end }}
</div>
{{ end }}
</div>
{{ if $show_image }}
<div class="media">
{{- if and .Params.image -}}
{{- partial "commons/image.html"
(dict
"image" .Params.image
"sizes" site.Params.image_sizes.sections.posts.item
) -}}
{{- else -}}
{{- partial "commons/image-default.html" "posts" -}}
{{ if $show_summary }}
{{- if (partial "GetTextFromHTML" .Params.summary) -}}
<p itemprop="articleBody">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
"length" site.Params.posts.index.truncate_description
) }}</p>
{{- end -}}
{{- end -}}
{{ if or $show_author $show_date }}
<div class="post-meta">
{{ if $show_date }}
<time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format site.Params.posts.date_format }}</time>
{{ end }}
{{ if $show_author }}
{{- partial "posts/author" . -}}
{{ end }}
</div>
{{ end }}
</div>
{{- end -}}
</article>
{{ if $show_image }}
<div class="media">
{{- if and .Params.image -}}
{{- partial "commons/image.html"
(dict
"image" .Params.image
"sizes" site.Params.image_sizes.sections.posts.item
) -}}
{{- else -}}
{{- partial "commons/image-default.html" "posts" -}}
{{- end -}}
</div>
{{- end -}}
</article>
{{ end }}
\ No newline at end of file
layouts/partials/projects/project.html
+ 49
− 39
View file @ 090cd33b
{{ $project := .project }}
{{ $heading := .heading | default "h2" }}
{{- $direction := "" -}}
{{ $index := .index}}
{{ $heading_tag := (dict
"open" ((printf "<%s class='project-title' itemprop='name'>" $heading) | safeHTML)
"close" ((printf "</%s>" $heading) | safeHTML)
) }}
{{ with $project }}
<article class="project" itemscope itemtype="https://schema.org/CreativeWork">
<div class="project-content">
{{- $title := partial "PrepareHTML" .Title -}}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" itemprop="url" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ $alternate := .alternate | default false }}
{{ if and site.Params.projects.index.show_description (partial "GetTextFromHTML" .Params.summary) }}
<p itemprop="abstract">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
"length" site.Params.projects.index.truncate_description
) }}</p>
{{ end }}
{{ if site.Params.projects.index.show_categories }}
{{- partial "projects/categories" . -}}
{{ end }}
{{ with $project }}
{{ if and site.Params.projects.index.show_year .Params.year }}
<div class="project-meta">
<time itemprop="datePublished" datetime="{{ .Params.year }}">{{ .Params.year }}</time>
{{ if .Params.image }}
{{- $direction = partial "GetImageDirection" .Params.image -}}
{{ end }}
<article class="project {{ if $alternate }}{{ $direction }} {{if not (modBool $index 2)}}left{{ else}}right{{end}}{{end}}" itemscope itemtype="https://schema.org/CreativeWork">
<div class="project-content">
<div class="project-description">
{{- $title := partial "PrepareHTML" .Title -}}
{{ $heading_tag.open }}
<a href="{{ .Permalink }}" itemprop="url" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a>
{{ $heading_tag.close }}
{{ if and site.Params.projects.index.show_description (partial "GetTextFromHTML" .Params.summary) }}
<p itemprop="abstract">{{ partial "GetTruncateContent" ( dict
"text" .Params.summary
"length" site.Params.projects.index.truncate_description
) }}
</p>
{{ end }}
{{ if site.Params.projects.index.show_categories }}
{{- partial "projects/categories" . -}}
{{ end }}
</div>
{{ end }}
</div>
<div class="media">
{{- if .Params.image -}}
{{- partial "commons/image.html"
(dict
"image" .Params.image
"sizes" site.Params.image_sizes.sections.projects.item
) -}}
{{- else -}}
{{- partial "commons/image-default.html" "projects" -}}
{{- end -}}
</div>
</article>
{{ if and site.Params.projects.index.show_year .Params.year }}
<div class="project-meta">
<time itemprop="datePublished" datetime="{{ .Params.year }}">{{ .Params.year }}</time>
</div>
{{ end }}
</div>
<div class="media">
{{- if .Params.image -}}
{{- partial "commons/image.html"
(dict
"image" .Params.image
"sizes" site.Params.image_sizes.sections.projects.item
) -}}
{{- else -}}
{{- partial "commons/image-default.html" "projects" -}}
{{- end -}}
</div>
</article>
{{ end }}
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment