diff --git a/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css b/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css index 83e4407..ffd6e5e 100644 --- a/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css +++ b/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css @@ -174,6 +174,9 @@ header { padding-left: 40px; } header .header_left_container #block-quartiers-de-demain-logoepau-2 { height: 150px; } + header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain { + margin-left: auto; + padding-right: 50px; } header .header_left_container img { width: auto; height: 150px; } @@ -432,7 +435,7 @@ header { float: inline-start; padding-right: 0.5rem; } #presentation .layout-content .content_container article.node-type-static .field_field_textes .field_field_picto img { - width: 50px; + width: 40px; height: auto; } #presentation aside { position: relative; @@ -452,12 +455,31 @@ header { #presentation aside .sidebar_first_container { position: -webkit-sticky; position: sticky; - top: 10rem; } + top: 10rem; + font-weight: 300; } + #presentation aside .sidebar_first_container .field-content { + margin-bottom: 0.7rem; } @media (max-width: 810px) { #presentation aside .sidebar_first_container { display: none; } } - #presentation aside .views-field-field-pieces-jointes .field-content .file--application-pdf::before { - content: url(../images/noun-arrow-download.png); } + #presentation aside .views-field-field-pieces-jointes .field-content { + display: flex; + flex-direction: column; } + #presentation aside .views-field-field-pieces-jointes .field-content .file--application-pdf { + display: inline-flex; } + #presentation aside .views-field-field-pieces-jointes .field-content .file--application-pdf a { + display: block; + font-size: small; + font-weight: 500; } + #presentation aside .views-field-field-pieces-jointes .field-content .file--application-pdf::before { + content: url(../images/noun-arrow-download.svg); + margin: auto; + padding-right: 00.5rem; } + #presentation aside .views-field-field-pieces-jointes .field-content span { + font-size: small; + font-weight: 500; } + #presentation aside .views-field-field-pieces-jointes .field-content span:nth-child(2) { + margin-left: 50px; } .node-type-static .layout-content .content_container #block-quartiers-de-demain-titredepage { grid-column: 3 /span 9; diff --git a/web/themes/custom/quartiers_de_demain/images/noun-arrow-download.svg b/web/themes/custom/quartiers_de_demain/images/noun-arrow-download.svg index 6aa4b7e..895e351 100644 --- a/web/themes/custom/quartiers_de_demain/images/noun-arrow-download.svg +++ b/web/themes/custom/quartiers_de_demain/images/noun-arrow-download.svg @@ -2,16 +2,44 @@ + 0) { + $('html, body').stop().animate({scrollTop: $anchor.offset().top - fixedElementHeight }, 0); + } + }; + + $(window).on('hashchange', function() { + adjustAnchor(); + }); + +})(jQuery, window); \ No newline at end of file diff --git a/web/themes/custom/quartiers_de_demain/scss/pages/_presentation.scss b/web/themes/custom/quartiers_de_demain/scss/pages/_presentation.scss index 9cfeb2d..152ffdd 100644 --- a/web/themes/custom/quartiers_de_demain/scss/pages/_presentation.scss +++ b/web/themes/custom/quartiers_de_demain/scss/pages/_presentation.scss @@ -106,7 +106,7 @@ float: inline-start; padding-right: 0.5rem; img{ - width: 50px; + width: 40px; height: auto; } } @@ -119,11 +119,8 @@ grid-column: 1 /span 2; grid-row: 1; z-index: 100; - // width: 80%; order: 1; margin-top: 5rem; - // margin-left: 10%; - // margin-right: 1rem; @media(max-width:891px){ margin-left: 5%; margin-top: 9rem; @@ -133,20 +130,39 @@ margin-top: 3rem; } .sidebar_first_container{ - // display: flex; - // justify-content: flex-end; position: -webkit-sticky; position: sticky; top: 10rem; + font-weight: 300; + .field-content{ + margin-bottom: 0.7rem; + } @media (max-width: 810px){ display: none; } } .views-field-field-pieces-jointes{ .field-content{ + display: flex; + flex-direction: column; .file--application-pdf{ + display: inline-flex; + a{ + display: block; + font-size: small; + font-weight: 500; + } &::before{ - content: url(../images/noun-arrow-download.png); + content: url(../images/noun-arrow-download.svg); + margin: auto; + padding-right: 00.5rem; + } + } + span{ + font-size: small; + font-weight: 500; + &:nth-child(2){ + margin-left: 50px; } } } diff --git a/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss b/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss index 1f8d59c..121fc70 100644 --- a/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss +++ b/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss @@ -33,6 +33,10 @@ header{ #block-quartiers-de-demain-logoepau-2{ height: $header-height; } + #block-quartiers-de-demain-logoquartiersdedemain{ + margin-left: auto; + padding-right: 50px; + } img{ width: auto; height: $header-height; diff --git a/web/themes/custom/quartiers_de_demain/scss/quartiers_de_demain.scss b/web/themes/custom/quartiers_de_demain/scss/quartiers_de_demain.scss index 227327c..4477c63 100644 --- a/web/themes/custom/quartiers_de_demain/scss/quartiers_de_demain.scss +++ b/web/themes/custom/quartiers_de_demain/scss/quartiers_de_demain.scss @@ -28,6 +28,6 @@ /*pages*/ @import "pages/partenaires"; -@import "pages/presentation"; +@import "pages/_presentation"; @import "pages/static"; diff --git a/web/themes/custom/quartiers_de_demain/templates/field.html.twig b/web/themes/custom/quartiers_de_demain/templates/field.html.twig index 83606e3..40a0edd 100644 --- a/web/themes/custom/quartiers_de_demain/templates/field.html.twig +++ b/web/themes/custom/quartiers_de_demain/templates/field.html.twig @@ -47,7 +47,9 @@ label_display == 'visually_hidden' ? 'visually-hidden', ] %} - +{% + set ancre_href = '#paragraph-id--' ~ paragraph.id() +%} {% if label_hidden %} {% if multiple %} diff --git a/web/themes/custom/quartiers_de_demain/templates/paragraph--texte--textes-toc.html.twig b/web/themes/custom/quartiers_de_demain/templates/paragraph--texte--textes-toc.html.twig deleted file mode 100644 index 3f6182d..0000000 --- a/web/themes/custom/quartiers_de_demain/templates/paragraph--texte--textes-toc.html.twig +++ /dev/null @@ -1,61 +0,0 @@ -{# -/** - * @file - * Default theme implementation to display a paragraph. - * - * Available variables: - * - paragraph: Full paragraph entity. - * Only method names starting with "get", "has", or "is" and a few common - * methods such as "id", "label", and "bundle" are available. For example: - * - paragraph.getCreatedTime() will return the paragraph creation timestamp. - * - paragraph.id(): The paragraph ID. - * - paragraph.bundle(): The type of the paragraph, for example, "image" or "text". - * - paragraph.getOwnerId(): The user ID of the paragraph author. - * See Drupal\paragraphs\Entity\Paragraph for a full list of public properties - * and methods for the paragraph object. - * - content: All paragraph items. Use {{ content }} to print them all, - * or print a subset such as {{ content.field_example }}. Use - * {{ content|without('field_example') }} to temporarily suppress the printing - * of a given child element. - * - attributes: HTML attributes for the containing element. - * The attributes.class element may contain one or more of the following - * classes: - * - paragraphs: The current template type (also known as a "theming hook"). - * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an - * "Image" it would result in "paragraphs--type--image". Note that the machine - * name will often be in a short form of the human readable label. - * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a - * preview would result in: "paragraphs--view-mode--preview", and - * default: "paragraphs--view-mode--default". - * - view_mode: View mode; for example, "preview" or "full". - * - logged_in: Flag for authenticated user status. Will be true when the - * current user is a logged-in member. - * - is_admin: Flag for admin user status. Will be true when the current user - * is an administrator. - * - * @see template_preprocess_paragraph() - * - * @ingroup themeable - */ -#} -{% - set classes = [ - 'paragraph', - 'paragraph--type--' ~ paragraph.bundle|clean_class, - view_mode ? 'paragraph--view-mode--' ~ view_mode|clean_class, - not paragraph.isPublished() ? 'paragraph--unpublished', - ] -%} -{% - set ancre_href = '#paragraph-id--' ~ paragraph.id() -%} -{% block paragraph %} - {# #} - - - {% block content %} - {{ content }} - {% endblock %} - - -{% endblock paragraph %} diff --git a/web/themes/custom/quartiers_de_demain/templates/paragraph.html.twig b/web/themes/custom/quartiers_de_demain/templates/paragraph.html.twig index 3becf0f..cff8fa5 100644 --- a/web/themes/custom/quartiers_de_demain/templates/paragraph.html.twig +++ b/web/themes/custom/quartiers_de_demain/templates/paragraph.html.twig @@ -46,10 +46,13 @@ not paragraph.isPublished() ? 'paragraph--unpublished' ] %} + {% block paragraph %} {# #} - {% block content %} + +{% block content %} + {{ content }} {% endblock %}