Seregon/zftpd

Zero-copy FTP/HTTP Daemon compatible with all POSIX systems

C/11.0 KB/No license
web/css/base.css
zftpd / web / css / base.css
1/* ══ RESET & BASE ═════════════════════════════════════════════════════════
2 * Global reset, typography, scrollbar styling.
3 * ═════════════════════════════════════════════════════════════════════════ */
4 
5*, *::before, *::after {
6 margin: 0;
7 padding: 0;
8 box-sizing: border-box;
9}
10 
11html {
12 scroll-behavior: smooth;
13}
14 
15body {
16 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', sans-serif;
17 background: var(--bg);
18 color: var(--tx);
19 min-height: 100vh;
20 overflow-x: hidden;
21 line-height: 1.5;
22 -webkit-font-smoothing: antialiased;
23 -moz-osx-font-smoothing: grayscale;
24}
25 
26::-webkit-scrollbar {
27 width: 5px;
28 height: 5px;
29}
30 
31::-webkit-scrollbar-track {
32 background: var(--bg);
33}
34 
35::-webkit-scrollbar-thumb {
36 background: var(--bd2);
37 border-radius: 3px;
38}
39 
40::-webkit-scrollbar-thumb:hover {
41 background: var(--ac);
42}
43 
44svg {
45 display: inline-block;
46 vertical-align: middle;
47 flex-shrink: 0;
48}
49 
50a {
51 color: var(--ac);
52 text-decoration: none;
53}
54 
55a:hover {
56 text-decoration: underline;
57}
58 
59img {
60 max-width: 100%;
61 height: auto;
62}
63 
64button, input, select, textarea {
65 font-family: inherit;
66}
67 
68/* ══ UTILITY CLASSES ═════════════════════════════════════════════════════ */
69 
70.hidden { display: none !important; }
71.sr-only {
72 position: absolute;
73 width: 1px;
74 height: 1px;
75 padding: 0;
76 margin: -1px;
77 overflow: hidden;
78 clip: rect(0,0,0,0);
79 white-space: nowrap;
80 border: 0;
81}
82 
83/* ══ ANIMATIONS ══════════════════════════════════════════════════════════ */
84 
85@keyframes fadeIn {
86 from { opacity: 0; }
87 to { opacity: 1; }
88}
89 
90@keyframes fadeOut {
91 from { opacity: 1; }
92 to { opacity: 0; }
93}
94 
95@keyframes slideUp {
96 from { opacity: 0; transform: translateY(20px); }
97 to { opacity: 1; transform: translateY(0); }
98}
99 
100@keyframes slideDown {
101 from { opacity: 0; transform: translateY(-20px); }
102 to { opacity: 1; transform: translateY(0); }
103}
104 
105@keyframes popIn {
106 from { opacity: 0; transform: scale(.95) translateY(-4px); }
107 to { opacity: 1; transform: none; }
108}
109 
110@keyframes spin {
111 to { transform: rotate(360deg); }
112}
113 
114@keyframes pulse {
115 0%, 100% { opacity: 1; }
116 50% { opacity: .4; }
117}
118 
119@keyframes shimmer {
120 0% { background-position: -200% 0; }
121 100% { background-position: 200% 0; }
122}
123 
124.loader {
125 width: 22px;
126 height: 22px;
127 border-radius: 50%;
128 border: 2px solid var(--bd2);
129 border-top-color: var(--ac);
130 animation: spin .7s linear infinite;
131}
132