Skip to content
Snippets Groups Projects
Commit 64155783 authored by Olivia206's avatar Olivia206
Browse files

fixed style

parent 45a778e9
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 123 additions and 57 deletions
assets/js/theme/design-system/dropdowns.js
+ 1
− 1
View file @ 64155783
......@@ -29,7 +29,7 @@ class Dropdown {
}
// Selectors
['.diplomas-select', '.dropdown-share'].map(selector => {
['.diplomas-select', '.dropdown-share', '.footer-i18n'].map(selector => {
if (document.querySelector(selector)) {
new Dropdown(selector);
}
......
assets/js/theme/design-system/search.js
+ 3
− 1
View file @ 64155783
......@@ -28,7 +28,9 @@ class Search {
}
});
this.closeButton.addEventListener('click', () => {
this.searchInstance.triggerSearch(' ');
this.input = this.element.querySelector('input');
this.input.value = "";
this.searchInstance.triggerSearch(" ");
this.toggle(false);
});
......
assets/sass/_theme/_utils.sass
+ 22
− 0
View file @ 64155783
......@@ -389,6 +389,28 @@
figcaption .credit-content
display: block
@mixin dropdown-i18n
position: relative
.dropdown-menu
margin-top: $header-nav-padding-y
padding-left: $spacing1
padding-bottom: $spacing0
padding-top: $spacing0
padding-right: $spacing1
right: 0
li a
padding-bottom: half($spacing0)
padding-top: half($spacing0)
display: block
&.is-checked
display: flex
justify-content: space-between
align-items: center
gap: $spacing2
text-decoration: none !important
@include icon(caret, after)
transform: rotate(-14deg) skewX(-30deg)
// https://gist.github.com/jonathantneal/d0460e5c2d5d7f9bc5e6
@function str-replace($string, $search, $replace: "")
$index: str-index($string, $search)
......
assets/sass/_theme/design-system/footer.sass
+ 45
− 0
View file @ 64155783
......@@ -31,6 +31,51 @@ footer#document-footer
&-credit
display: block
margin-top: $spacing0
&-search
padding-top: $spacing0 !important
&-i18n
@include dropdown-i18n
button
@include button-reset
@include icon(caret-bottom, after)
@include meta
align-items: center
cursor: pointer
display: flex
justify-content: start
padding-left: 0
text-align: left
&:focus,
&:focus-visible
box-shadow: none
&[aria-expanded="true"]
background: $color-background
justify-content: space-between
width: 100%
+ .dropdown-menu
animation-duration: unset
&::after
transform: rotate(-180deg)
&::before
margin-right: $spacing0
&::after
margin-left: $spacing0
button[aria-expanded="true"],
.dropdown-menu
outline: px2rem(10) solid $color-background
min-width: $spacing4
.dropdown-menu
@include meta
background: $color-background
@include media-breakpoint-up(desktop)
left: 0
margin-top: px2rem(17)
max-height: calc(100vh - var(--header-height))
overflow: auto
padding: 0
position: absolute
width: fit-content
@if $footer-icons-enabled
&-social
.nav-social + .site-links
......
assets/sass/_theme/design-system/header.sass
+ 3
− 3
View file @ 64155783
......@@ -105,9 +105,6 @@ header#document-header
position: relative
text-transform: uppercase
line-height: 1
@include media-breakpoint-down(desktop)
display: flex
align-items: center
&:focus
box-shadow: none
&:focus-visible
......@@ -115,6 +112,9 @@ header#document-header
outline-offset: 5px
outline-style: dashed
outline-width: 1px
@include media-breakpoint-down(desktop)
display: flex
align-items: center
span:first-of-type
@include meta
font-size: 14px
......
assets/sass/_theme/design-system/nav.sass
+ 2
− 21
View file @ 64155783
......@@ -131,31 +131,12 @@
margin-top: $spacing1
.header-i18n
position: relative
[role="button"]
@include dropdown-i18n
[role="button"],
@include icon(globe, after)
&[aria-expanded][aria-expanded="true"]
&::after
transform: none
.dropdown-menu
margin-top: $header-nav-padding-y
padding-left: $spacing1
padding-bottom: $spacing0
padding-top: $spacing0
padding-right: $spacing1
right: 0
li a
padding-bottom: half($spacing0)
padding-top: half($spacing0)
display: block
&.is-checked
display: flex
justify-content: space-between
align-items: center
gap: $spacing2
text-decoration: none !important
@include icon(caret, after)
transform: rotate(-14deg) skewX(-30deg)
@include media-breakpoint-down(desktop)
&.is-opened
......
assets/sass/_theme/design-system/search.sass
+ 4
− 8
View file @ 64155783
......@@ -13,7 +13,7 @@
font-size: $body-size-desktop
line-height: inherit
margin-left: px2rem(8)
@include media-breakpoint-down(md)
@include media-breakpoint-down(desktop)
&.pagefind-menu
border-bottom: 1px solid #adb5bd
padding: $spacing1 0
......@@ -68,12 +68,12 @@
&::after
align-items: center
display: flex
height: half($spacing3)
padding-right: px2rem(2)
position: absolute
pointer-events: none
right: 0
top: 0
top: half($spacing0)
transform: translate(0,20%)
z-index: 7
@include media-breakpoint-down(md)
right: $spacing1
......@@ -166,8 +166,4 @@
bottom: px2rem(44)
.pagefind-footer
padding: 0
margin-bottom: calc(#{$spacing3} + #{half($spacing3)})
@include media-breakpoint-down(md)
margin-bottom: $spacing3
padding: 0
\ No newline at end of file
layouts/partials/footer/footer-simple.html
+ 10
− 8
View file @ 64155783
......@@ -7,19 +7,21 @@
</div>
</div>
{{ partial "footer/i18n.html" . }}
{{ if and (site.Params.search.active) (eq site.Params.search.position "footer")}}
<div class="container footer-search">
{{ partial "header/search.html"
(dict
"position" "footer"
"context" .
)
}}
</div>
{{ end }}
<div class="container">
<div class="footer-social">
{{ partial "footer/social.html" }}
</div>
<div class="footer-legals">
{{ if and (site.Params.search.active) (eq site.Params.search.position "footer")}}
{{ partial "header/search.html"
(dict
"position" "footer"
"context" .
)
}}
{{ end }}
{{ partial "footer/legals.html" }}
</div>
</div>
layouts/partials/footer/i18n.html
+ 33
− 15
View file @ 64155783
......@@ -3,22 +3,40 @@
{{ $siteLang := "" }}
{{ $url := "" }}
{{ if gt (len site.Languages) 1 }}
<div class="container">
<div class="footer-i18n">
{{ with site.Languages }}
<ul class="small">
{{ range site.Languages }}
{{ $siteLang := . }}
{{ $url = printf "/%s/" .Lang }}
{{ range $pageWithTranslations }}
{{ if eq .Lang $siteLang.Lang }}
{{ $url = .Permalink }}
<div class="container">
<div class="footer-i18n">
<button
aria-haspopup="menu"
aria-expanded="false"
aria-label="{{ i18n "commons.accessibility.menu_lang" }}"
tabindex="0">
{{- site.Language.LanguageName -}}
</button>
<div class="dropdown-menu dropdown-languages">
<ul>
{{ range site.Languages }}
{{ $siteLang := . }}
{{ $url = printf "/%s/" .Lang }}
{{ range $pageWithTranslations }}
{{ if eq .Lang $siteLang.Lang }}
{{ $url = .Permalink }}
{{ end }}
{{ end }}
<li>
<a
href="{{ $url }}"
lang="{{ $siteLang }}"
hreflang="{{ $siteLang }}"
{{ if eq $siteLang site.Language }}
class="is-checked"
{{ end }}
>
{{- $siteLang.LanguageName -}}
</a>
</li>
{{ end }}
<li><a href="{{ $url }}" lang="{{ $siteLang }}" hreflang="{{ $siteLang }}">{{ $siteLang.LanguageName }}</a></li>
{{ end }}
</ul>
{{ end }}
</ul>
</div>
</div>
</div>
</div>
{{ 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