Playing with colors for notices
This commit is contained in:
parent
d4978ee0f1
commit
aaf47fe6d7
|
@ -179,15 +179,33 @@ $(document).ready(function() {
|
|||
}
|
||||
```
|
||||
|
||||
<p>notice</p>{: .notice}
|
||||
<p>primary</p>{: .notice--primary}
|
||||
<p>info</p>{: .notice--info}
|
||||
<p>warning</p>{: .notice--warning}
|
||||
<p>success</p>{: .notice--success}
|
||||
<p>danger</p>{: .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}
|
||||
|
||||
|
||||
<div class="notice--success" markdown="1">
|
||||
# Headline for the Notice
|
||||
<h3> Headline for the Notice</h3>
|
||||
<br>
|
||||
Text for the notice
|
||||
</div>
|
|
@ -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
|
||||
|
|
|
@ -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);
|
||||
|
||||
|
|
Loading…
Reference in New Issue