Files
qlockify-frontend-deployment/src/index.css

131 lines
2.4 KiB
CSS

@import "tailwindcss";
@font-face {
font-family: "AppSans";
src: url("/fonts/Vazirmatn[wght].woff2") format("woff2");
font-weight: 100 900;
font-style: normal;
font-display: swap;
/* Arabic + Persian Unicode blocks */
unicode-range:
U+0600-06FF,
U+0750-077F,
U+08A0-08FF,
U+FB50-FDFF,
U+FE70-FEFF;
}
@font-face {
font-family: "AppSans";
src: local("Inter");
font-weight: 100 900;
font-style: normal;
font-display: swap;
/* Latin */
unicode-range:
U+0000-00FF,
U+0100-024F,
U+1E00-1EFF;
}
@custom-variant dark (&:is(.dark *));
@theme {
--color-quera-blue: #2563eb;
--font-sans: "AppSans", ui-sans-serif, system-ui, sans-serif;
}
:root {
font-family: "AppSans", system-ui, sans-serif;
}
:lang(fa) {
font-family: "Vazirmatn", system-ui, Avenir, Helvetica, Arial, sans-serif;
}
@layer base {
* {
border-color: var(--color-border);
}
button:not(:disabled),
[role="button"]:not([aria-disabled="true"]),
a[href],
summary {
cursor: pointer;
}
button:disabled,
[aria-disabled="true"] {
cursor: not-allowed;
}
body {
background-color: var(--color-background);
color: var(--color-foreground);
}
}
@layer utilities {
@media (min-width: 1024px) {
.text-xs {
font-size: 0.875rem !important; /* Bumps 12px to 14px */
line-height: 1.25rem !important;
}
.text-sm {
font-size: 1rem !important; /* Bumps 14px to 16px */
line-height: 1.5rem !important;
}
.text-base {
font-size: 1.125rem !important; /* Bumps 16px to 18px */
line-height: 1.75rem !important;
}
.text-lg {
font-size: 1.25rem !important; /* Bumps 18px to 20px */
line-height: 1.75rem !important;
}
}
}
/* Global Scrollbar Styles */
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background-color: #cbd5e1; /* Tailwind slate-300 */
border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
background-color: #94a3b8; /* Tailwind slate-400 */
}
/* Dark mode support */
.dark ::-webkit-scrollbar-thumb {
background-color: #334155; /* Tailwind slate-700 */
}
.dark ::-webkit-scrollbar-thumb:hover {
background-color: #475569; /* Tailwind slate-600 */
}
/* For Firefox */
* {
scrollbar-width: thin;
scrollbar-color: #cbd5e1 transparent;
}
.dark * {
scrollbar-color: #334155 transparent;
}