Spaces:
Sleeping
Sleeping
| /* Banner styling -- improve readability with better contrast */ | |
| #banner { | |
| background: #f1f5f9 ; | |
| color: #1e293b ; | |
| font-size: 0.95rem ; | |
| font-weight: 600 ; | |
| padding-top: 12px ; | |
| padding-bottom: 12px ; | |
| position: relative ; | |
| overflow: hidden ; | |
| } | |
| #banner::before { | |
| content: ""; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: linear-gradient( | |
| 90deg, | |
| rgba(6, 182, 212, 0.25) 0%, | |
| rgba(6, 182, 212, 0.05) 25%, | |
| rgba(6, 182, 212, 0.35) 50%, | |
| rgba(6, 182, 212, 0.08) 75%, | |
| rgba(6, 182, 212, 0.28) 100% | |
| ); | |
| background-size: 300% 100%; | |
| animation: colorWave 14s ease-in-out infinite alternate; | |
| pointer-events: none; | |
| } | |
| .dark #banner { | |
| background: #475569 ; | |
| color: #f1f5f9 ; | |
| } | |
| .dark #banner::before { | |
| background: linear-gradient( | |
| 90deg, | |
| rgba(247, 37, 133, 0.35) 0%, | |
| rgba(247, 37, 133, 0.08) 25%, | |
| rgba(247, 37, 133, 0.45) 50%, | |
| rgba(247, 37, 133, 0.12) 75%, | |
| rgba(247, 37, 133, 0.38) 100% | |
| ); | |
| background-size: 300% 100%; | |
| } | |
| @keyframes colorWave { | |
| 0% { | |
| background-position: 0% 0%; | |
| } | |
| 100% { | |
| background-position: 100% 0%; | |
| } | |
| } | |
| #banner * { | |
| color: #1e293b ; | |
| margin: 0 ; | |
| } | |
| .dark #banner * { | |
| color: #f1f5f9 ; | |
| } | |