mirror of
https://github.com/danog/sass-site.git
synced 2024-12-12 09:29:58 +01:00
62 lines
1.2 KiB
SCSS
62 lines
1.2 KiB
SCSS
@use 'sass:color';
|
|
@use '../functions';
|
|
@use '../config/color/brand';
|
|
@use '../visual-design/typography';
|
|
|
|
.sl-c-alert {
|
|
background: var(--alert-bg, var(--sl-color--highlight));
|
|
color: var(--sl-color--white);
|
|
font-size: var(--sl-font-size--small);
|
|
padding-bottom: var(--alert-padding-block, var(--sl-gutter--minus));
|
|
padding-top: var(--alert-padding-block, var(--sl-gutter--minus));
|
|
text-align: var(--alert-align, center);
|
|
|
|
p,
|
|
ul,
|
|
dl {
|
|
&:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
p,
|
|
li,
|
|
dd {
|
|
max-width: none;
|
|
}
|
|
|
|
a {
|
|
--sl-color-text--link: var(--sl-color--white);
|
|
--sl-color-background--link-state: rgba(0, 0, 0, 6.25%);
|
|
--sl-border-color--link: #{rgba(brand.$sl-color--white, var(--opacity-border, 0.5))};
|
|
font-weight: typography.$sl-font-weight--bold;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
--opacity-border: 0.75;
|
|
}
|
|
|
|
&:active {
|
|
--opacity-border: 1;
|
|
}
|
|
}
|
|
}
|
|
|
|
.sl-c-alert--info {
|
|
--alert-bg: var(--sl-color--midnight-blue);
|
|
}
|
|
|
|
.sl-c-alert--special {
|
|
--alert-align: left;
|
|
--alert-bg: black;
|
|
--alert-padding-block: var(--sl-gutter--triple);
|
|
}
|
|
|
|
.sl-c-alert-title {
|
|
margin-top: 0;
|
|
}
|