File manager - Edit - /home/webapp69.cm.in.th/u69319090046/02_shop/css/styles.css
Back
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Prompt:wght@300;400;500;600;700&display=swap'); :root { --font-sans: 'Plus Jakarta Sans', 'Prompt', sans-serif; } body { font-family: var(--font-sans); background-color: #0f172a; color: #f8fafc; overflow-x: hidden; } /* Custom Scrollbar */ ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: #0f172a; } ::-webkit-scrollbar-thumb { background: #334155; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #475569; } /* Custom Utilities */ .glass-panel { background: rgba(30, 41, 59, 0.7); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, 0.1); } .glass-card { background: rgba(15, 23, 42, 0.6); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.08); } .glow-emerald { box-shadow: 0 0 25px -5px rgba(16, 185, 129, 0.3); } .glow-primary { box-shadow: 0 0 30px -5px rgba(99, 102, 241, 0.35); } /* Custom Animations */ @keyframes pulseGlow { 0%, 100% { opacity: 0.8; transform: scale(1); } 50% { opacity: 1; transform: scale(1.03); } } .animate-pulse-glow { animation: pulseGlow 3s ease-in-out infinite; } @keyframes slideInRight { from { transform: translateX(100%); } to { transform: translateX(0); } } .animate-slide-in-right { animation: slideInRight 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards; } @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards; } @keyframes popBadge { 0% { transform: scale(0.8); } 50% { transform: scale(1.25); } 100% { transform: scale(1); } } .animate-pop-badge { animation: popBadge 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); } /* Touch Targets for Mobile */ .touch-target { min-height: 44px; min-width: 44px; } /* Dynamic SVG T-Shirt Transition */ .tshirt-svg-body { transition: fill 0.4s ease, filter 0.4s ease; } /* Custom Range & Checkbox Styles */ input[type="checkbox"]:checked { background-color: #10b981; border-color: #10b981; }
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0.23 |
proxy
|
phpinfo
|
Settings