54 lines
1.2 KiB
SCSS
54 lines
1.2 KiB
SCSS
body {
|
|
background: $color__background-body; // Fallback for when there is no custom background color defined.
|
|
//background-image: url(./assets/img/background-colors-02.jpg);
|
|
//background-size: cover;
|
|
//background-position: center center;
|
|
//background-repeat: no-repeat;
|
|
position: relative;
|
|
}
|
|
.liquid-bubbles {
|
|
overflow: hidden;
|
|
float: left;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: -1000;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
|
|
}
|
|
.bubbles {
|
|
--size: 40vw;
|
|
--position: -10vw;
|
|
position:absolute;
|
|
width: var(--size);
|
|
height: var(--size);
|
|
border-radius: 50%;
|
|
filter: blur(10rem);
|
|
&.bubble-01{
|
|
top: var(--position);
|
|
left: var(--position);
|
|
--bgcolor: var(--bubble-color-01);
|
|
--bgangle: to bottom right;
|
|
}
|
|
&.bubble-02{
|
|
top: var(--position);
|
|
right: var(--position);
|
|
--bgcolor: var(--bubble-color-02);
|
|
--bgangle: to bottom left;
|
|
}
|
|
&.bubble-03{
|
|
bottom: var(--position);
|
|
left: var(--position);
|
|
--bgcolor: var(--bubble-color-03);
|
|
--bgangle: to top right;
|
|
}
|
|
&.bubble-04{
|
|
bottom: var(--position);
|
|
right: var(--position);
|
|
--bgcolor: var(--bubble-color-04);
|
|
--bgangle: to top left;
|
|
}
|
|
background: linear-gradient(var(--bgangle),var(--bgcolor), transparent);
|
|
}
|