mirror of
https://github.com/leonvanzyl/autocoder.git
synced 2026-01-30 06:12:06 +00:00
YOLO mode effects
This commit is contained in:
@@ -163,21 +163,29 @@
|
||||
transform: none;
|
||||
}
|
||||
|
||||
/* YOLO Mode Button - Fiery gradient for when YOLO mode is enabled */
|
||||
/* Uses darker orange colors for better contrast with white text (WCAG AA) */
|
||||
/* YOLO Mode Button - Animated fire effect for when YOLO mode is enabled */
|
||||
.neo-btn-yolo {
|
||||
background: linear-gradient(135deg, #d64500, #e65c00);
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
#8b0000 0%,
|
||||
#d64500 30%,
|
||||
#ff6a00 60%,
|
||||
#ffa500 100%
|
||||
);
|
||||
background-size: 100% 200%;
|
||||
color: #ffffff;
|
||||
box-shadow:
|
||||
4px 4px 0 var(--color-neo-border),
|
||||
0 0 12px rgba(255, 84, 0, 0.4);
|
||||
animation: fireGlow 0.8s ease-in-out infinite, fireGradient 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.neo-btn-yolo:hover {
|
||||
background: linear-gradient(135deg, #ff5400, #ff6a00);
|
||||
box-shadow:
|
||||
6px 6px 0 var(--color-neo-border),
|
||||
0 0 16px rgba(255, 84, 0, 0.5);
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
#a00000 0%,
|
||||
#e65c00 30%,
|
||||
#ff7800 60%,
|
||||
#ffb700 100%
|
||||
);
|
||||
background-size: 100% 200%;
|
||||
}
|
||||
|
||||
/* Inputs */
|
||||
@@ -371,6 +379,42 @@
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fireGlow {
|
||||
0%, 100% {
|
||||
box-shadow:
|
||||
4px 4px 0 var(--color-neo-border),
|
||||
0 0 10px rgba(255, 100, 0, 0.5),
|
||||
0 0 20px rgba(255, 60, 0, 0.3);
|
||||
}
|
||||
25% {
|
||||
box-shadow:
|
||||
4px 4px 0 var(--color-neo-border),
|
||||
0 0 15px rgba(255, 80, 0, 0.6),
|
||||
0 0 30px rgba(255, 40, 0, 0.4);
|
||||
}
|
||||
50% {
|
||||
box-shadow:
|
||||
4px 4px 0 var(--color-neo-border),
|
||||
0 0 12px rgba(255, 120, 0, 0.7),
|
||||
0 0 25px rgba(255, 50, 0, 0.5);
|
||||
}
|
||||
75% {
|
||||
box-shadow:
|
||||
4px 4px 0 var(--color-neo-border),
|
||||
0 0 18px rgba(255, 70, 0, 0.55),
|
||||
0 0 35px rgba(255, 30, 0, 0.35);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fireGradient {
|
||||
0%, 100% {
|
||||
background-position: 0% 100%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 0%;
|
||||
}
|
||||
}
|
||||
|
||||
/* ============================================================================
|
||||
Utilities Layer
|
||||
============================================================================ */
|
||||
|
||||
Reference in New Issue
Block a user