From 1a3bd907e9b65a0e4f2d46413d0e8ebda031c129 Mon Sep 17 00:00:00 2001 From: Matt Batchelder Date: Tue, 12 May 2026 16:27:37 -0400 Subject: [PATCH] animations --- theme/assets/css/main.css | 43 +-------------------------------------- 1 file changed, 1 insertion(+), 42 deletions(-) diff --git a/theme/assets/css/main.css b/theme/assets/css/main.css index 96c2b82..ec953d7 100644 --- a/theme/assets/css/main.css +++ b/theme/assets/css/main.css @@ -130,48 +130,7 @@ a:hover { color: var(--color-primary); } animation: icon-pop 0.4s ease-out backwards; } -/* ── Ambient feature-icon animations ────────────────────────── - Continuous "alive" motion inside feature cards, inspired by - the design page platform-row visual animations. Combines a - gentle float with a sonar-pulse ring on the icon. */ -@keyframes icon-float { - 0%, 100% { transform: translateY(0); } - 50% { transform: translateY(-5px); } -} -@keyframes icon-ring { - 0% { box-shadow: 0 0 0 0 rgba(var(--color-primary-rgb), 0.35); } - 60% { box-shadow: 0 0 0 10px rgba(var(--color-primary-rgb), 0); } - 100% { box-shadow: 0 0 0 0 rgba(var(--color-primary-rgb), 0); } -} -@keyframes icon-cog-spin { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } -} -/* Float + ring on all feature/value icons (but only once the card has - scroll-revealed — the .is-animated class is set by demo-animator.js). */ -.oribi-card.is-animated .feature-icon, -.oribi-card.is-animated .value-icon { - animation: icon-float 3.6s ease-in-out infinite, - icon-ring 3.6s ease-out infinite; -} -/* Pause ambient animation during hover so the scale transform - from .oribi-card:hover .feature-icon / .value-icon takes over cleanly. */ -.oribi-card:hover .feature-icon, -.oribi-card:hover .value-icon { - animation: none; -} -/* Cog icons spin slowly — contextually appropriate regardless of card. */ -.feature-icon .fa-cog, -.feature-icon .fa-users-cog { - animation: icon-cog-spin 8s linear infinite; -} -/* Respect reduced-motion preference. */ -@media (prefers-reduced-motion: reduce) { - .oribi-card.is-animated .feature-icon, - .oribi-card.is-animated .value-icon { animation: none; } - .feature-icon .fa-cog, - .feature-icon .fa-users-cog { animation: none; } -} + /* Smooth theme transition */ body,