59 lines
1018 B
SCSS
Executable File
59 lines
1018 B
SCSS
Executable File
// Background Gradient Utilities
|
|
|
|
@each $color, $value in $theme-colors {
|
|
.bg-gradient-#{$color} {
|
|
background-color: $value;
|
|
background-image: linear-gradient(
|
|
180deg,
|
|
$value 10%,
|
|
darken($value, 15%) 100%
|
|
);
|
|
background-size: cover;
|
|
}
|
|
}
|
|
|
|
// Grayscale Background Utilities
|
|
|
|
@each $level, $value in $grays {
|
|
.bg-gray-#{$level} {
|
|
background-color: $value !important;
|
|
}
|
|
}
|
|
|
|
#home_intro {
|
|
overflow: hidden;
|
|
position: relative;
|
|
background: linear-gradient(145deg, #f3f4f6, #ffffff);
|
|
|
|
.background-shape {
|
|
position: absolute;
|
|
width: 180px;
|
|
height: 180px;
|
|
background: rgba(0, 123, 255, 0.2);
|
|
border-radius: 50%;
|
|
filter: blur(60px);
|
|
animation: float 5s ease-in-out infinite;
|
|
|
|
&.shape-1 {
|
|
top: -40px;
|
|
left: -40px;
|
|
}
|
|
|
|
&.shape-2 {
|
|
bottom: -40px;
|
|
right: -40px;
|
|
animation-delay: 2s;
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes float {
|
|
0%,
|
|
100% {
|
|
transform: translateY(0);
|
|
}
|
|
50% {
|
|
transform: translateY(15px);
|
|
}
|
|
}
|