4a6b5e5498
- Fixed group emoji icons in DB (💼🛒📚🗺️🏃✨🏠🌿) - Added TaskModal component for + button - Czech status labels (Čeká, Probíhá, Hotovo, Zrušeno) - Improved TaskCard, GroupSelector, Header, StatusBadge - Better dark/light mode transitions Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
90 lines
1.5 KiB
CSS
90 lines
1.5 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
--background: #ffffff;
|
|
--foreground: #171717;
|
|
--card: #f9fafb;
|
|
--card-border: #e5e7eb;
|
|
--muted: #6b7280;
|
|
--primary: #3b82f6;
|
|
}
|
|
|
|
.dark {
|
|
--background: #0a0a0a;
|
|
--foreground: #ededed;
|
|
--card: #1a1a2e;
|
|
--card-border: #2d2d44;
|
|
--muted: #9ca3af;
|
|
--primary: #60a5fa;
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: system-ui, -apple-system, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 16px; /* prevent auto-zoom on iOS */
|
|
max-width: 100vw;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
/* Mobile-first base */
|
|
* {
|
|
box-sizing: border-box;
|
|
-webkit-tap-highlight-color: transparent;
|
|
}
|
|
|
|
input[type="text"],
|
|
input[type="email"],
|
|
input[type="password"],
|
|
input[type="datetime-local"],
|
|
textarea,
|
|
select {
|
|
font-size: 16px; /* Prevent zoom on iOS */
|
|
}
|
|
|
|
@layer utilities {
|
|
.scrollbar-hide {
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.scrollbar-hide::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.text-muted {
|
|
color: var(--muted);
|
|
}
|
|
}
|
|
|
|
/* Smooth page transitions */
|
|
main {
|
|
animation: fadeIn 0.15s ease-out;
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(4px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
/* Mobile overscroll behavior */
|
|
@media (max-width: 640px) {
|
|
html {
|
|
overscroll-behavior-y: contain;
|
|
}
|
|
}
|
|
|
|
/* Selection color */
|
|
::selection {
|
|
background: rgba(59, 130, 246, 0.3);
|
|
}
|