diff --git a/public/css/main.css b/public/css/main.css index 9c632e6..faa1f9d 100644 --- a/public/css/main.css +++ b/public/css/main.css @@ -5499,7 +5499,7 @@ body.content-edit-shift-active.content-edit-mode-active .content-edit-fab-stack .marquee-grid__cell { margin: 0; flex: 0 0 auto; - opacity: 0.1; + opacity: 0.2; animation: tagFlicker var(--tag-cycle, 15s) ease-in-out infinite; } .marquee-grid__cell .hero__tag { @@ -5516,29 +5516,30 @@ body.content-edit-shift-active.content-edit-mode-active .content-edit-fab-stack line-height: 1.4; } -/* Flicker: теги держим на базовом уровне 10%, по очереди (по 3 за раз) вспыхивают до 100%. - Цикл 15s, шаг 1s; яркими (≈100%) одновременно ≤3 тега, остальные тускло видны (10%). */ -.marquee-grid__cell:nth-child(1) { animation-delay: -1s; } -.marquee-grid__cell:nth-child(2) { animation-delay: -2s; } -.marquee-grid__cell:nth-child(3) { animation-delay: -3s; } -.marquee-grid__cell:nth-child(4) { animation-delay: -4s; } +/* Flicker: теги держим на базовом уровне 20%, по очереди (по 3 за раз, вразнобой) вспыхивают до 100%. + Задержки — перестановка со шагом 7 (взаимно просто с 15), чтобы горели не соседние, а разбросанные теги. + Цикл 15s, шаг 1s; яркими (≈100%) одновременно ≤3 тега, остальные тускло видны (20%). */ +.marquee-grid__cell:nth-child(1) { animation-delay: -7s; } +.marquee-grid__cell:nth-child(2) { animation-delay: -14s; } +.marquee-grid__cell:nth-child(3) { animation-delay: -6s; } +.marquee-grid__cell:nth-child(4) { animation-delay: -13s; } .marquee-grid__cell:nth-child(5) { animation-delay: -5s; } -.marquee-grid__cell:nth-child(6) { animation-delay: -6s; } -.marquee-grid__cell:nth-child(7) { animation-delay: -7s; } -.marquee-grid__cell:nth-child(8) { animation-delay: -8s; } -.marquee-grid__cell:nth-child(9) { animation-delay: -9s; } +.marquee-grid__cell:nth-child(6) { animation-delay: -12s; } +.marquee-grid__cell:nth-child(7) { animation-delay: -4s; } +.marquee-grid__cell:nth-child(8) { animation-delay: -11s; } +.marquee-grid__cell:nth-child(9) { animation-delay: -3s; } .marquee-grid__cell:nth-child(10) { animation-delay: -10s; } -.marquee-grid__cell:nth-child(11) { animation-delay: -11s; } -.marquee-grid__cell:nth-child(12) { animation-delay: -12s; } -.marquee-grid__cell:nth-child(13) { animation-delay: -13s; } -.marquee-grid__cell:nth-child(14) { animation-delay: -14s; } -.marquee-grid__cell:nth-child(15) { animation-delay: -15s; } +.marquee-grid__cell:nth-child(11) { animation-delay: -2s; } +.marquee-grid__cell:nth-child(12) { animation-delay: -9s; } +.marquee-grid__cell:nth-child(13) { animation-delay: -1s; } +.marquee-grid__cell:nth-child(14) { animation-delay: -8s; } +.marquee-grid__cell:nth-child(15) { animation-delay: 0s; } @keyframes tagFlicker { 0% { opacity: 1; } 8% { opacity: 1; } - 10% { opacity: 0.1; } - 90% { opacity: 0.1; } + 10% { opacity: 0.2; } + 90% { opacity: 0.2; } 92% { opacity: 1; } 100% { opacity: 1; } }