Files
todo/frontend/src/index.css
almazlar 281004434d
All checks were successful
Release and Build Docker Images / release-and-build (push) Successful in 1m29s
feat: Implement responsive styling for various screen sizes and refactor the main todo list container class.
2026-02-21 11:03:18 +03:00

58 lines
1.2 KiB
CSS

:root {
--bg-color: #0f172a;
--panel-bg: rgba(30, 41, 59, 0.7);
--text-main: #f8fafc;
--text-muted: #94a3b8;
--accent-primary: #8b5cf6;
--accent-secondary: #ec4899;
--success: #10b981;
--danger: #ef4444;
--border-color: rgba(255, 255, 255, 0.1);
--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
--font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: var(--font-family);
background-color: var(--bg-color);
background-image: radial-gradient(circle at top right, rgba(139, 92, 246, 0.15), transparent 40%),
radial-gradient(circle at bottom left, rgba(236, 72, 153, 0.15), transparent 40%);
color: var(--text-main);
min-height: 100vh;
display: flex;
justify-content: center;
align-items: flex-start;
padding: 4rem 1rem;
}
@media (max-width: 768px) {
body {
padding: 2rem 1rem;
}
}
@media (max-width: 480px) {
body {
padding: 0;
align-items: flex-start;
}
}
button {
cursor: pointer;
font-family: inherit;
border: none;
outline: none;
transition: all 0.3s ease;
}
input {
font-family: inherit;
outline: none;
}