mirror of
https://github.com/zarfadev/MobaXterm-Keygen.git
synced 2026-08-28 22:00:51 +00:00
99 lines
2.0 KiB
CSS
99 lines
2.0 KiB
CSS
/*
|
|
NOTE: This is just an experiment and
|
|
could use some changes to improve performance:
|
|
|
|
https://x.com/actualTimWilson/status/1730753841795158313
|
|
|
|
See a production optimized version here: https://charmui.com
|
|
*/
|
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
|
|
|
|
body {
|
|
font-family: Inter, sans-serif;
|
|
}
|
|
|
|
@keyframes jumbo {
|
|
from {
|
|
background-position: 50% 50%, 50% 50%;
|
|
}
|
|
to {
|
|
background-position: 350% 50%, 350% 50%;
|
|
}
|
|
}
|
|
|
|
/* New Styles for Form Isolation */
|
|
.box-main {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.jumbo {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 0;
|
|
}
|
|
|
|
.jumbo {
|
|
--stripes: repeating-linear-gradient(
|
|
100deg,
|
|
#fff 0%,
|
|
#fff 7%,
|
|
transparent 10%,
|
|
transparent 12%,
|
|
#fff 16%
|
|
);
|
|
--stripesDark: repeating-linear-gradient(
|
|
100deg,
|
|
#000 0%,
|
|
#000 7%,
|
|
transparent 10%,
|
|
transparent 12%,
|
|
#000 16%
|
|
);
|
|
--rainbow: repeating-linear-gradient(
|
|
100deg,
|
|
#60a5fa 10%,
|
|
#e879f9 15%,
|
|
#60a5fa 20%,
|
|
#5eead4 25%,
|
|
#60a5fa 30%
|
|
);
|
|
background-image: var(--stripes), var(--rainbow);
|
|
background-size: 300%, 200%;
|
|
background-position: 50% 50%, 50% 50%;
|
|
|
|
filter: blur(10px) invert(100%);
|
|
|
|
mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
|
|
|
|
pointer-events: none;
|
|
}
|
|
|
|
.jumbo::after {
|
|
content: "";
|
|
position: absolute;
|
|
inset: 0;
|
|
background-image: var(--stripes), var(--rainbow);
|
|
background-size: 200%, 100%;
|
|
animation: jumbo 60s linear infinite;
|
|
background-attachment: fixed;
|
|
mix-blend-mode: difference;
|
|
}
|
|
|
|
.dark .jumbo {
|
|
background-image: var(--stripesDark), var(--rainbow);
|
|
filter: blur(10px) opacity(50%) saturate(200%);
|
|
}
|
|
.dark .jumbo::after {
|
|
background-image: var(--stripesDark), var(--rainbow);
|
|
}
|
|
|
|
.bg-white {
|
|
--tw-bg-opacity: 1;
|
|
background-color: rgb(255 255 255);
|
|
}
|