added top gradient

This commit is contained in:
Fedor Katurov 2022-11-16 02:36:43 +06:00
parent 93624c55f2
commit 509e2b9406
3 changed files with 30 additions and 1 deletions

View file

@ -186,6 +186,15 @@ blockquote {
--color-rating-5: #87deaa;
--color-highlight-color: var(--color-text);
--color-highlight-background: #254e50;
// top gradient
$primary_dimmed: mix(#e84a72, #16161c, 70%);
--top-gradient: linear-gradient(
90deg,
#{$primary_dimmed},
#{adjust-hue($primary_dimmed, 120deg)},
#{adjust-hue($primary_dimmed, 240deg)}
);
}
:root.light {
@ -221,4 +230,13 @@ blockquote {
--color-rating-5: #{adjust-hue($rating, -40deg)};
--color-highlight-color: var(--color-text);
--color-highlight-background: #fab795;
// top gradient
$primary_dimmed: mix(#e84a72, #fce9e4, 70%);
--top-gradient: linear-gradient(
90deg,
#{$primary_dimmed},
#{adjust-hue($primary_dimmed, 120deg)},
#{adjust-hue($primary_dimmed, 240deg)}
);
}

View file

@ -11,7 +11,7 @@
<style lang="scss" module>
.header {
text-align: left;
padding: 22px 0;
padding: 22px 0 20px;
a {
color: var(--color-text);

View file

@ -28,6 +28,17 @@
z-index: 10;
backdrop-filter: blur(5px);
&::before {
content: " ";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: var(--top-gradient);
z-index: 2;
}
&::after {
content: "";
position: absolute;