ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Message highlight.

Browse source
This commit is contained in:
Fredrik Jonsson 2023-04-26 14:24:53 +02:00
commit 0459743880
2 changed files with 16 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

1
assets/sass/_colors.scss
View file

@ -80,7 +80,6 @@ $colors: (
status: $green,
status-bg: lighten($green, 62%),
status-highlight: $black,
warning: $black,
warning-bg: lighten($yellow, 45%),
warning-border: $yellow,

22
assets/sass/components/messages/_messages.scss
View file

@ -2,26 +2,36 @@
.message,
%message {
padding: 10px;
border-width: 1px;
border-style: solid;
padding: .5rem;
outline-width: 2px;
outline-style: solid;
width: 95%;
&.status {
background-color: var(--color-status-bg);
color: var(--color-status);
border-color: var(--color-status);
outline-color: var(--color-status);
}
&.warning {
background-color: var(--color-warning-bg);
color: var(--color-warning);
border-color: var(--color-warning);
outline-color: var(--color-warning-border);
}
&.error {
background-color: var(--color-error-bg);
color: var(--color-error);
border-color: var(--color-error);
outline-color: var(--color-error);
}
&--highlight {
animation: 2s linear infinite outline-highlight;
}
@keyframes outline-highlight {
50% {
outline-width: .3rem;
}
}
}