Files
api/assets/main.css
2023-08-07 17:51:30 -07:00

91 lines
1.6 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
/*
darkTheme
alpha: '#1c1b1b',
beta: '#f2f2f2',
gamma: '#999999',
lightTheme
alpha: '#f2f2f2',
beta: '#1c1b1b',
gamma: '#999999',
*/
body {
--color-alpha: #1c1b1b;
--color-beta: #f2f2f2;
--color-gamma: #999999;
--color-customgradient-start: rgba(242, 242, 242, .0);
--color-customgradient-end: rgba(242, 242, 242, .85);
--shadow-beta: 0 25px 50px -12px rgba(242, 242, 242, .15);
--ring-offset-shadow: 0 0 --var(--color-beta);
--ring-shadow: 0 0 --var(--color-beta);
}
.DropdownWrapper_blip {
box-shadow: var(--ring-offset-shadow), var(--ring-shadow), var(--shadow-beta);
&::before {
@apply absolute z-20 block;
content: '';
width: 0;
height: 0;
top: -10px;
right: 42px;
border-right: 11px solid transparent;
border-bottom: 11px solid var(--color-alpha);
border-left: 11px solid transparent;
}
}
.BrandLoading_2,
.BrandLoading_4 {
animation: mark_2 1.5s ease infinite;
}
.BrandLoading_3 {
animation: mark_3 1.5s ease infinite;
}
.BrandLoading_6,
.BrandLoading_8 {
animation: mark_6 1.5s ease infinite;
}
.BrandLoading_7 {
animation: mark_7 1.5s ease infinite;
}
@keyframes mark_2 {
50% {
transform: translateY(-40px);
}
100% {
transform: translateY(0);
}
}
@keyframes mark_3 {
50% {
transform: translateY(-62px);
}
100% {
transform: translateY(0);
}
}
@keyframes mark_6 {
50% {
transform: translateY(40px);
}
100% {
transform: translateY(0);
}
}
@keyframes mark_7 {
50% {
transform: translateY(62px);
}
100% {
transform: translateY(0);
}
}