Files
spacedrive/apps/web/src/index.css
2026-04-10 16:58:43 -07:00

79 lines
2.0 KiB
CSS

@import "tailwindcss";
@import "@spacedrive/tokens/src/css/theme.css";
@import "@spacedrive/tokens/src/css/base.css";
@import "@spacedrive/tokens/src/css/themes/light.css";
@import "@spacedrive/tokens/src/css/themes/midnight.css";
@import "@spacedrive/tokens/src/css/themes/noir.css";
@import "@spacedrive/tokens/src/css/themes/slate.css";
@import "@spacedrive/tokens/src/css/themes/nord.css";
@import "@spacedrive/tokens/src/css/themes/mocha.css";
/* Tell Tailwind v4 where to scan for utility classes */
@source "../../../packages/interface/src";
@source "../../../../spaceui/packages/primitives/src";
@source "../../../../spaceui/packages/ai/src";
@source "../../../../spaceui/packages/explorer/src";
@source "../../../../spaceui/packages/forms/src";
@plugin "@tailwindcss/forms";
@plugin "tailwindcss-animate";
@plugin "@headlessui/tailwindcss";
@plugin "tailwindcss-radix";
@plugin "@tailwindcss/typography";
@custom-variant dark (&:where(.dark, .dark *));
@utility top-bar-blur {
@apply border-app-line/50;
backdrop-filter: saturate(120%) blur(18px);
}
@utility frame {
&::before {
content: "";
pointer-events: none;
user-select: none;
position: absolute;
inset: 0px;
border-radius: inherit;
padding: 1px;
background: var(--color-app-frame);
mask:
linear-gradient(black, black) content-box content-box,
linear-gradient(black, black);
mask-composite: xor;
-webkit-mask-composite: xor;
z-index: 9999;
}
}
@utility no-scrollbar {
&::-webkit-scrollbar {
display: none;
}
-ms-overflow-style: none;
scrollbar-width: none;
}
@utility mask-fade-out {
mask-image: linear-gradient(
to bottom,
black calc(100% - 40px),
transparent 100%
);
-webkit-mask-image: linear-gradient(
to bottom,
black calc(100% - 40px),
transparent 100%
);
}
body {
margin: 0;
font-family:
-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu",
"Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}