mirror of
https://github.com/danog/sass-site.git
synced 2024-12-12 17:37:36 +01:00
66 lines
1.2 KiB
SCSS
66 lines
1.2 KiB
SCSS
@use 'sass:color';
|
|
@use '../functions';
|
|
@use '../config/color/brand';
|
|
@use '../visual-design/typography';
|
|
|
|
.sl-c-alert {
|
|
background: var(--sl-background--alert, var(--sl-color--highlight));
|
|
color: var(--sl-color--white);
|
|
font-size: var(--sl-font-size--small);
|
|
padding-bottom: var(--sl-padding-block--alert, var(--sl-gutter--minus));
|
|
padding-top: var(--sl-padding-block--alert, var(--sl-gutter--minus));
|
|
text-align: var(--sl-align--alert, center);
|
|
|
|
p,
|
|
ul,
|
|
dl {
|
|
&:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
p,
|
|
li,
|
|
dd {
|
|
max-width: none;
|
|
}
|
|
|
|
a {
|
|
--sl-color--link: var(--sl-color--white);
|
|
--sl-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 {
|
|
--sl-background--alert: var(--sl-color--midnight-blue);
|
|
}
|
|
|
|
.sl-c-alert--special {
|
|
--sl-align--alert: left;
|
|
--sl-background--alert: black;
|
|
--sl-padding-block--alert: var(--sl-gutter--triple);
|
|
}
|
|
|
|
.sl-c-alert-title {
|
|
margin-top: 0;
|
|
}
|