File manager - Edit - /home/webapp69.cm.in.th/u69319090053/portfolio/style.css
Back
/* Custom Global styles & Animations */ /* Nav link underline effect */ .nav-link { position: relative; padding-bottom: 2px; } .nav-link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #2563eb; transition: width 0.3s ease; } .nav-link:hover::after, .nav-link.active::after { width: 100%; } /* Custom Skill Pill */ .skill-pill { @apply flex items-center space-x-2.5 px-4 py-3 rounded-2xl bg-slate-100 hover:bg-slate-200/80 dark:bg-slate-800/50 dark:hover:bg-slate-800 border border-slate-200/40 dark:border-slate-800/80 transition-all duration-200 transform hover:-translate-y-0.5; } /* Form Input Styling */ .form-input { width: 100%; padding: 0.75rem 1rem; border-radius: 0.75rem; border-width: 1px; font-size: 0.875rem; outline: none; transition-property: all; transition-duration: 200ms; background-color: #ffffff; border-color: #e2e8f0; } .dark .form-input { background-color: #1c2541; border-color: #334155; color: #f8fafc; } .form-input:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15); } /* Filter buttons */ .filter-btn { padding: 0.5rem 1.25rem; border-radius: 9999px; font-weight: 500; font-size: 0.875rem; white-space: nowrap; border: 1px solid #e2e8f0; transition: all 0.2s ease; background-color: #ffffff; color: #475569; } .dark .filter-btn { border-color: #334155; background-color: #1c2541; color: #cbd5e1; } .filter-btn:hover { background-color: #f1f5f9; } .dark .filter-btn:hover { background-color: #1e293b; } .filter-btn.active { background-color: #2563eb; color: #ffffff; border-color: #2563eb; } .dark .filter-btn.active { background-color: #3b82f6; color: #ffffff; border-color: #3b82f6; } /* Tag style inside projects */ .tag { padding: 0.25rem 0.625rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; background-color: #f1f5f9; color: #475569; } .dark .tag { background-color: #1e293b; color: #94a3b8; } /* Custom Scrollbar */ ::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { background: #f1f5f9; } .dark ::-webkit-scrollbar-track { background: #0b132b; } ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 5px; } .dark ::-webkit-scrollbar-thumb { background: #1e293b; } ::-webkit-scrollbar-thumb:hover { background: #94a3b8; } /* Active navigation tracking indicators */ #navbar.scrolled { background-color: rgba(255, 255, 255, 0.85); backdrop-filter: blur(12px); box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.05); border-color: rgba(226, 232, 240, 0.8); } .dark #navbar.scrolled { background-color: rgba(11, 19, 43, 0.85); border-color: rgba(30, 41, 59, 0.8); box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.2); } /* Animations and Utilities */ @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .fade-in { animation: fadeIn 0.6s ease forwards; }
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0.31 |
proxy
|
phpinfo
|
Settings