From c8ab6f0ede4d59423ddaa72bcb60bfe84b1c073d Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet@mmibordeaux.com>
Date: Fri, 20 Jan 2023 15:36:46 +0100
Subject: [PATCH] fixed papers in person and volume
---
assets/sass/_theme/design-system/button.sass | 30 ++++++
assets/sass/_theme/hugo-osuny.sass | 1 +
assets/sass/_theme/sections/papers.sass | 94 ++++++++--------
assets/sass/_theme/sections/persons.sass | 3 +
assets/sass/_theme/sections/volumes.sass | 108 ++++++++-----------
layouts/papers/single.html | 4 +
layouts/partials/papers/abstract.html | 7 ++
layouts/partials/papers/document-nav.html | 41 +++----
layouts/partials/papers/paper.html | 4 +-
9 files changed, 156 insertions(+), 136 deletions(-)
create mode 100644 assets/sass/_theme/design-system/button.sass
diff --git a/assets/sass/_theme/design-system/button.sass b/assets/sass/_theme/design-system/button.sass
new file mode 100644
index 00000000..60adbd14
--- /dev/null
+++ b/assets/sass/_theme/design-system/button.sass
@@ -0,0 +1,30 @@
+.squared-button
+ @include meta
+ @include button-reset
+ align-items: center
+ cursor: pointer
+ display: flex
+ padding: 0
+ @include media-breakpoint-up(desktop)
+ width: col(2,1)
+ &:first-child
+ margin-bottom: $spacing0
+ &::before
+ background-color: white
+ border: 1px solid $color-border
+ margin-right: $spacing0
+ padding: half($spacing0)
+ transition: background 0.3s ease, border 0.3s ease
+ @include media-breakpoint-up(desktop)
+ margin-right: $spacing1
+ &:hover
+ text-decoration: none
+ &::before
+ background-color: $color-text
+ border-color: transparent
+ color: $color-background
+ text-decoration: none
+button.squared-button
+ @include icon-block(eye, before)
+a.squared-button
+ @include icon-block(download, before)
\ No newline at end of file
diff --git a/assets/sass/_theme/hugo-osuny.sass b/assets/sass/_theme/hugo-osuny.sass
index c593d1c1..2fb6caef 100644
--- a/assets/sass/_theme/hugo-osuny.sass
+++ b/assets/sass/_theme/hugo-osuny.sass
@@ -18,6 +18,7 @@
@import "design-system/layout"
@import "design-system/a11y"
@import "design-system/breadcrumb"
+@import "design-system/button"
@import "design-system/footer"
@import "design-system/header"
@import "design-system/hero"
diff --git a/assets/sass/_theme/sections/papers.sass b/assets/sass/_theme/sections/papers.sass
index 341e9da6..0977d45a 100644
--- a/assets/sass/_theme/sections/papers.sass
+++ b/assets/sass/_theme/sections/papers.sass
@@ -3,65 +3,45 @@
a
text-decoration-color: transparent
transition: color 0.3s ease
+ > div
+ &:first-of-type
+ grid-column: 1 / 7
+ &:last-of-type
+ grid-column: 8 / 12
+ align-items: start
+ display: flex
+ @include media-breakpoint-down(desktop)
+ flex-wrap: wrap
+ justify-content: space-between
+ margin-top: $spacing1
+ h3
+ a:hover
+ color: $color-accent
+ .paper-volume
+ @include meta
+ text-transform: lowercase
+ a
+ @include link($color-text)
+ text-transform: none
+ span
+ text-transform: uppercase
.papers
@include list-reset
- article
- @include media-breakpoint-up(desktop)
- @include grid
- + article
+ margin-block-start: half($spacing3)
+ li
+ + li
margin-top: $spacing2
@include media-breakpoint-up(desktop)
margin-top: $spacing3
- > div
- &:first-of-type
- grid-column: 1 / 7
- &:last-of-type
- grid-column: 7 / 12
- @include grid(2, desktop)
- @include media-breakpoint-down(desktop)
- margin-top: $spacing1
+ article
+ @include media-breakpoint-up(desktop)
+ @include grid
+ + article
+ margin-top: $spacing2
@include media-breakpoint-up(desktop)
- align-items: start
- a, button
- @include meta
- @include button-reset
- align-items: center
- cursor: pointer
- display: flex
- padding: 0
- &::before
- background-color: white
- border: 1px solid $color-border
- margin-right: $spacing0
- padding: half($spacing0)
- transition: background 0.3s ease, border 0.3s ease
- @include media-breakpoint-up(desktop)
- margin-right: $spacing1
- &:hover
- text-decoration: none
- &::before
- background-color: $color-text
- border-color: transparent
- color: $color-background
- button
- @include icon-block(eye, before)
- a
- @include icon-block(download, before)
- @include media-breakpoint-down(desktop)
- * + *
- margin-top: $spacing0
- h3
- a:hover
- color: $color-accent
- .paper-volume
- @include meta
- text-transform: lowercase
- a
- @include link($color-text)
- text-transform: none
- span
- text-transform: uppercase
+ margin-top: $spacing3
+
.papers__page
.document-content
@@ -87,3 +67,13 @@
@include h4
@include stretched-link(before)
text-decoration: none
+ .document-nav
+ @include media-breakpoint-up(desktop)
+ grid-column: 9 / 12
+ order: 2
+ dl
+ margin: 0
+ dt
+ @include meta
+ &:not(:first-of-type)
+ margin-top: $spacing2
diff --git a/assets/sass/_theme/sections/persons.sass b/assets/sass/_theme/sections/persons.sass
index 69329de4..c9271764 100644
--- a/assets/sass/_theme/sections/persons.sass
+++ b/assets/sass/_theme/sections/persons.sass
@@ -8,6 +8,9 @@
transition: transform .3s ease
&:hover::after
transform: translateX($spacing0)
+ // TODO : voir comment gérer les marges comme pour les blocs (pb footer)
+ section
+ padding-bottom: $grid-gutter
ol.programs
li
justify-content: flex-start
diff --git a/assets/sass/_theme/sections/volumes.sass b/assets/sass/_theme/sections/volumes.sass
index 24e00c86..7ee0bd0a 100644
--- a/assets/sass/_theme/sections/volumes.sass
+++ b/assets/sass/_theme/sections/volumes.sass
@@ -19,74 +19,30 @@
@include grid
.content
@include media-breakpoint-up(desktop)
- grid-column: 1 / 9
+ grid-column: 1 / 8
> div
margin-bottom: $spacing1
@include media-breakpoint-up(desktop)
margin-bottom: $spacing4
- .volume-table
- list-style: none
- margin-block-start: half($spacing3)
- li
- + li
- margin-top: $spacing3
- a
- text-decoration-color: rgba(0,0,0,0)
- &:hover
- text-decoration-color: rgba(0,0,0,1)
- .item--informations
- @include grid(2, desktop)
- margin-top: $spacing0
+ .modal
+ background-color: $body-overlay-color
+ .modal-content
+ background-color: $color-background-alt
+ padding: $spacing3
+ position: relative
@include media-breakpoint-up(desktop)
- margin-top: $spacing1
- a, button
- @include meta
- @include button-reset
- align-items: center
- cursor: pointer
- display: flex
- padding: 0
- &::before
- background-color: white
- border: 1px solid $color-border
- margin-right: $spacing0
- padding: half($spacing0)
- transition: background 0.3s ease, border 0.3s ease
- @include media-breakpoint-up(desktop)
- margin-right: $spacing1
- &:hover
- text-decoration: none
- &::before
- background-color: $color-text
- border-color: transparent
- color: $color-background
- button
- @include icon-block(eye, before)
- a
- @include icon-block(download, before)
- @include media-breakpoint-down(desktop)
- * + *
- margin-top: $spacing0
- .modal
- // display: none
- background-color: $body-overlay-color
- .modal-content
- background-color: $color-background-alt
- padding: $spacing3
- position: relative
- @include media-breakpoint-up(desktop)
- // width: col(8)
- margin: auto
- .modal-header
- margin-bottom: $spacing0
- .btn-close
- @include button-reset
- @include icon-block(close, before)
- position: absolute
- right: 0
- top: 0
- h5
- @include h3
+ // width: col(8)
+ margin: auto
+ .modal-header
+ margin-bottom: $spacing0
+ .btn-close
+ @include button-reset
+ @include icon-block(close, before)
+ position: absolute
+ right: 0
+ top: 0
+ h5
+ @include h3
.document-aside
@include media-breakpoint-up(desktop)
grid-column: 9 / 12
@@ -98,4 +54,28 @@
&:not(:first-of-type)
margin-top: $spacing2
.paper
- display: block
\ No newline at end of file
+ display: block
+ @include media-breakpoint-down(desktop)
+ > div
+ &:first-of-type
+ .paper-volume
+ display: inline-flex
+ margin-left: $spacing0
+ @include media-breakpoint-up(desktop)
+ > div
+ &:first-of-type
+ display: flex
+ flex-wrap: wrap
+ justify-content: space-between
+ h3
+ flex: 1
+ > span
+ order: 3
+ width: 100%
+ .paper-volume
+ padding-left: $spacing1
+ &:last-of-type
+ gap: $grid-gutter
+ margin-top: $spacing1
+ a, button
+ width: unset
\ No newline at end of file
diff --git a/layouts/papers/single.html b/layouts/papers/single.html
index bea5b9a6..8965c2c0 100644
--- a/layouts/papers/single.html
+++ b/layouts/papers/single.html
@@ -9,12 +9,16 @@
<meta itemprop="name" content="{{ partial "PrepareHTML" .Title }}">
<div class="container">
+
+ {{ partial "papers/document-nav.html" . }}
+
<div class="content">
{{ partial "papers/abstract.html" . }}
{{ partial "papers/authors.html" . }}
{{ partial "papers/body.html" . }}
{{ partial "papers/references.html" . }}
</div>
+
</div>
</div>
diff --git a/layouts/partials/papers/abstract.html b/layouts/partials/papers/abstract.html
index 2a7bfced..85826057 100644
--- a/layouts/partials/papers/abstract.html
+++ b/layouts/partials/papers/abstract.html
@@ -1,3 +1,10 @@
<section>
<p itemprop="abstract">{{ partial "PrepareHTML" .Params.Abstract }}</p>
+ <div role="group">
+ {{ if isset .Params "pdf" }}
+ {{- $pdf := partial "GetMedia" .Params.pdf -}}
+ <a href="{{ $pdf.url }}" download>{{ i18n "commons.download.pdf" }}</a><br>
+ {{ end }}
+ <a href="#" class="squared-button" download>PDF (435 ko)</a>
+ </div>
</section>
diff --git a/layouts/partials/papers/document-nav.html b/layouts/partials/papers/document-nav.html
index e4339574..22055dc8 100644
--- a/layouts/partials/papers/document-nav.html
+++ b/layouts/partials/papers/document-nav.html
@@ -1,14 +1,28 @@
<aside class="document-nav">
- <div role="group">
- {{ if isset .Params "pdf" }}
- {{- $pdf := partial "GetMedia" .Params.pdf -}}
- <a href="{{ $pdf.url }}" download>{{ i18n "commons.download.pdf" }}</a><br>
- {{ end }}
- {{ if .Content }}
- <a href="#full-text" class="btn-eye">{{ i18n "commons.read_online" }}</a>
- {{ end }}
- </div>
<dl>
+ {{ range .GetTerms "volumes" }}
+ <dt>{{ i18n "volumes.singular_name" }}</dt>
+ <dd itemprop="isPartOf" itemscope itemtype="https://schema.org/PublicationVolume">
+ <a href="{{ .Permalink }}" itemprop="url">
+ <span itemprop="name">{{ .Title }}</span>
+ <div class="media">
+ {{- if .Params.image -}}
+ {{- partial "commons/image.html"
+ (dict
+ "image" .Params.image
+ "alt" .Title
+ "mobile" "327x388"
+ "tablet" "208x247"
+ "desktop" "408x485"
+ ) -}}
+ {{- else if site.Params.default_image.url -}}
+ {{- partial "commons/image-default.html" (dict "class" "img-fluid") -}}
+ {{- end -}}
+ </div>
+ </a>
+ </dd>
+ {{ end }}
+
{{ if isset .Params "type" }}
<dt>{{ i18n "volumes.nature" }}</dt>
<dd>{{ partial "PrepareHTML" .Params.Type }}</dd>
@@ -26,15 +40,6 @@
<dd itemprop="inLanguage" content="{{ .Params.Lang_iso }}">{{ .Params.Lang }}</dd>
{{ end }}
- {{ range .GetTerms "volumes" }}
- <dt>{{ i18n "volumes.singular_name" }}</dt>
- <dd itemprop="isPartOf" itemscope itemtype="https://schema.org/PublicationVolume">
- <a href="{{ .Permalink }}" itemprop="url">
- <span itemprop="name">{{ .Title }}</span>
- </a>
- </dd>
- {{ end }}
-
{{ if .Date }}
<dt>{{ i18n "commons.date" }}</dt>
<dd>
diff --git a/layouts/partials/papers/paper.html b/layouts/partials/papers/paper.html
index 1143acd7..317586d2 100644
--- a/layouts/partials/papers/paper.html
+++ b/layouts/partials/papers/paper.html
@@ -26,8 +26,8 @@
</p>
</div>
<div role="group">
- <button type="button" data-bs-toggle="modal">Résumé</button>
- <a href="#" download>PDF (435 ko)</a>
+ <button class="squared-button" type="button" data-bs-toggle="modal">Résumé</button>
+ <a class="squared-button" href="#" download>PDF (435 ko)</a>
{{/* <button type="button" data-bs-toggle="modal" data-bs-target="#{{ $modalId }}">{{ i18n "volumes.abstract" }}</button>
{{ if .Params.pdf }}
{{- $pdf := partial "GetMedia" .Params.pdf -}}
--
GitLab