mirror of
https://github.com/danog/sass-site.git
synced 2024-12-14 02:17:36 +01:00
65 lines
1.2 KiB
SCSS
65 lines
1.2 KiB
SCSS
@use 'sass:color';
|
|
@use '../functions';
|
|
@use '../visual-design/theme';
|
|
@use '../visual-design/typography';
|
|
|
|
.sl-c-alert {
|
|
background: var(
|
|
--alert-bg,
|
|
color.adjust(theme.$sl-color--hopbush, $lightness: -10%)
|
|
);
|
|
color: theme.$sl-color--white;
|
|
font-size: typography.$sl-font-size--small;
|
|
padding-bottom: var(--alert-padding-block, var(--gutter-minus));
|
|
padding-top: var(--alert-padding-block, var(--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 {
|
|
border-bottom-color: rgba(theme.$sl-color--white, 0.5);
|
|
color: theme.$sl-color--white;
|
|
font-weight: typography.$sl-font-weight--bold;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
background: rgba(black, 0.0625);
|
|
border-bottom-color: rgba(theme.$sl-color--white, 0.75);
|
|
}
|
|
|
|
&:active {
|
|
border-bottom-color: theme.$sl-color--white;
|
|
}
|
|
}
|
|
}
|
|
|
|
.sl-c-alert--info {
|
|
--alert-bg: theme.$sl-color--midnight-blue;
|
|
}
|
|
|
|
.sl-c-alert--special {
|
|
--alert-align: left;
|
|
--alert-bg: black;
|
|
--alert-padding-block: var(--gutter-triple);
|
|
}
|
|
|
|
.sl-c-alert-title {
|
|
margin-top: 0;
|
|
}
|