From 73e09e19bebcae10afc3587b942efc4e2995ce29 Mon Sep 17 00:00:00 2001 From: Tixie Date: Wed, 9 Oct 2024 07:05:11 +0200 Subject: [PATCH] Website: Add a banner for the announcement about the project's state --- src/_includes/ico-info.svg | 5 ++++ src/_includes/layouts/base.njk | 5 +++- src/sass/2-helpers/_alignment.scss | 8 ++++- src/sass/3-components/_notifications.scss | 36 +++++++++++++++++++++-- src/sass/4-base/_06-header.scss | 2 +- src/sass/style.scss | 3 +- 6 files changed, 53 insertions(+), 6 deletions(-) create mode 100644 src/_includes/ico-info.svg diff --git a/src/_includes/ico-info.svg b/src/_includes/ico-info.svg new file mode 100644 index 0000000..137ff54 --- /dev/null +++ b/src/_includes/ico-info.svg @@ -0,0 +1,5 @@ + diff --git a/src/_includes/layouts/base.njk b/src/_includes/layouts/base.njk index 6b94b78..f54fee4 100755 --- a/src/_includes/layouts/base.njk +++ b/src/_includes/layouts/base.njk @@ -20,6 +20,9 @@
+ {# Announcements #} +
{% include 'ico-info.svg' %}: An update about the state of the project have been published
+ {# Logo #}
{% include 'picto.svg' %}
{% if page.fileSlug === '' %} @@ -32,7 +35,7 @@

{{ title }}

{% endif %}

Because lighter plugins mean lighter sites

- + {# Search #}
diff --git a/src/sass/2-helpers/_alignment.scss b/src/sass/2-helpers/_alignment.scss index c6ccc57..29e89c4 100755 --- a/src/sass/2-helpers/_alignment.scss +++ b/src/sass/2-helpers/_alignment.scss @@ -1,8 +1,14 @@ // ----------------------------------------------------------- // == alignment -// -----------------------------------------------------------// block +// ----------------------------------------------------------- + +// block // -------------------------------------------------------------- +.inline-block { + display: inline-block; +} + .left { float: left; } diff --git a/src/sass/3-components/_notifications.scss b/src/sass/3-components/_notifications.scss index 3b484ca..cf58010 100755 --- a/src/sass/3-components/_notifications.scss +++ b/src/sass/3-components/_notifications.scss @@ -7,8 +7,40 @@ $notif-warning: #ffdd57; $notif-error: #ff3860; .notif { - padding: 1em; - border-radius: 4px; + padding: .6em 1em; + border-radius: .3em; +} + +.notif a, +.notif a:is(:visited,:hover,:active,:focus) { + color: currentcolor; + cursor: pointer; +} + +.notif svg { + width: 1.5em; + width: 2cap; + height: 1.5em; + height: 2cap; + vertical-align: -.35em; +} + +.notif a[href*="//"]::after { + font-size: .9em; + font-family: system-ui, -apple-system, sans-serif; + vertical-align: 6%; + content: "↗"; + content: "↗" / ""; +} + +.notif--small { + font-size: .85em; +} + +.notif--info { + color: darken($color-info, 20); + background-color: lighten($color-info, 42); + border: .1rem solid lighten($color-info, 20); } .notif--success { diff --git a/src/sass/4-base/_06-header.scss b/src/sass/4-base/_06-header.scss index 3352e8f..e68957a 100755 --- a/src/sass/4-base/_06-header.scss +++ b/src/sass/4-base/_06-header.scss @@ -43,5 +43,5 @@ // -------------------------------------------------------------- .header__search { - margin-top: 6rem; + margin-top: 4rem; } diff --git a/src/sass/style.scss b/src/sass/style.scss index a7e85cd..7e2196a 100755 --- a/src/sass/style.scss +++ b/src/sass/style.scss @@ -39,7 +39,7 @@ @import "3-components/_pagination"; // @import '3-components/_tables'; // @import '3-components/_tooltips'; -// @import '3-components/_notifications'; +@import "3-components/_notifications"; // -------------------------------------------------------------- // == base */ @@ -86,4 +86,5 @@ // @import '8-rwd/_rwd-medium'; // @import '8-rwd/_rwd-small'; @import "8-rwd/_rwd-xsmall"; + // @import '8-rwd/_rwd';