From aaf47fe6d7fe53c06caa22bf3a035d0da22935b8 Mon Sep 17 00:00:00 2001 From: Robert McGovern Date: Mon, 20 Feb 2023 01:07:15 +0000 Subject: [PATCH] Playing with colors for notices --- src/_drafts/swiftui.md | 32 ++++++++++++++++++++++------ src/assets/css/my-vars.scss | 4 ++-- src/assets/css/override-notices.scss | 2 +- 3 files changed, 28 insertions(+), 10 deletions(-) diff --git a/src/_drafts/swiftui.md b/src/_drafts/swiftui.md index e64aa8e..e8a3e4f 100644 --- a/src/_drafts/swiftui.md +++ b/src/_drafts/swiftui.md @@ -179,15 +179,33 @@ $(document).ready(function() { } ``` -

notice

{: .notice} -

primary

{: .notice--primary} -

info

{: .notice--info} -

warning

{: .notice--warning} -

success

{: .notice--success} -

danger

{: .notice--danger} +notice +{: .notice} + +primary +{: .notice--primary} + +info +{: .notice--info} + +warning +{: .notice--warning} + +success +{: .notice--success} + +danger +{: .notice--danger} + +TIP: Unless you are wed to the theme, don't try porting it. Really. Headaches await. 🤯 +{: .notice--warning} + +**success** +{: .notice--success} +
- # Headline for the Notice +

Headline for the Notice


Text for the notice
\ No newline at end of file diff --git a/src/assets/css/my-vars.scss b/src/assets/css/my-vars.scss index 2e0e9e7..9cd372c 100644 --- a/src/assets/css/my-vars.scss +++ b/src/assets/css/my-vars.scss @@ -17,9 +17,9 @@ $code-background-color-dark: mix(rgb(59, 54, 54), $background-color, 20%) !defau /* Notices */ -$success-color: #3fa63f !default; +$success-color: #02d702 !default; $warning-color: #d67f05 !default; -$danger-color: #ff0000 !default; +$danger-color: #d90404 !default; $info-color: #3b9cba !default; // section not needed under 11ty diff --git a/src/assets/css/override-notices.scss b/src/assets/css/override-notices.scss index 3b63553..b965ce6 100644 --- a/src/assets/css/override-notices.scss +++ b/src/assets/css/override-notices.scss @@ -17,7 +17,7 @@ font-family: $global-font-family; font-size: $type-size-6 !important; text-indent: initial; /* override*/ - background-color: mix(#fff, $notice-color, 55%); //original percentage was 90 + background-color: mix(#fff, $notice-color, 65%); //original percentage was 90 border-radius: $border-radius; box-shadow: 0 1px 1px rgba($notice-color, 0.25);