xevion/dynamic-preauth
1
0
Fork 0
mirror of https://github.com/Xevion/dynamic-preauth.git synced 2025-12-10 16:07:08 -06:00
Code Issues Packages Projects Releases Wiki Activity

Move globals.scss into Base.astro, fix inter vs sans tailwind font definitions

Browse Source
This commit is contained in:
Xevion
2024-12-22 16:32:49 -06:00
parent 64747ff11f
commit 842ea651c4
3 changed files with 86 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
frontend/src/globals.scss
View File

@@ -1,81 +0,0 @@
@tailwind base;
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
.noise::after {
background-image: url("/noise.png");
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 50%;
content: " ";
pointer-events: none;
}
.noise-card {
@apply bg-zinc-800;
&::before {
position: absolute;
z-index: 30;
left: 0;
right: 0;
top: 0;
bottom: 0;
content: " ";
pointer-events: none;
background-image: url("/noise.png");
background-position-x: 66px;
// background-color: rgba(255, 255, 255, 6%);
opacity: 80%;
// filter: brightness(100%);
// background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("/noise.png");
// #202020;
}
}
html,
body {
@apply overflow-x-hidden;
background-color: #151413;
color: #bab1a8;
margin: 0;
width: 100%;
height: 100%;
}
@layer base {
* {
/* @apply border-border; */
}
body {
/* @apply bg-background text-foreground; */
}
ul,
ol {
list-style: revert;
}
/* NEW CODE */
/* width */
::-webkit-scrollbar {
@apply w-2 rounded-lg;
}
/* Track */
::-webkit-scrollbar-track {
@apply bg-zinc-700 rounded-lg;
}
/* Handle */
::-webkit-scrollbar-thumb {
@apply bg-zinc-500 rounded-xl;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
@apply bg-zinc-400 rounded-lg;
}
}

85
frontend/src/layouts/Base.astro
View File

@@ -6,6 +6,91 @@
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="preload" href="/notify.wav" as="audio" />
<title>Dynamic Preauth</title>
<style is:global lang="scss">
@tailwind base;
@tailwind components;
@tailwind utilities;
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
.noise::after {
background-image: url("/noise.png");
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 50%;
content: " ";
pointer-events: none;
}
.noise-card {
@apply bg-zinc-800;
&::before {
position: absolute;
z-index: 30;
left: 0;
right: 0;
top: 0;
bottom: 0;
content: " ";
pointer-events: none;
background-image: url("/noise.png");
background-position-x: 66px;
// background-color: rgba(255, 255, 255, 6%);
opacity: 80%;
// filter: brightness(100%);
// background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("/noise.png");
// #202020;
}
}
html,
body {
@apply overflow-x-hidden;
background-color: #151413;
color: #bab1a8;
margin: 0;
width: 100%;
height: 100%;
}
@layer base {
* {
/* @apply border-border; */
}
body {
/* @apply bg-background text-foreground; */
}
ul,
ol {
list-style: revert;
}
/* NEW CODE */
/* width */
::-webkit-scrollbar {
@apply w-2 rounded-lg;
}
/* Track */
::-webkit-scrollbar-track {
@apply bg-zinc-700 rounded-lg;
}
/* Handle */
::-webkit-scrollbar-thumb {
@apply bg-zinc-500 rounded-xl;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
@apply bg-zinc-400 rounded-lg;
}
}
</style>
</head>
<body class="md:noise after:opacity-70">
<slot />

3
frontend/src/pages/index.astro
View File

@@ -1,7 +1,6 @@
---
import Base from "@/layouts/Base.astro";
import StatefulDemo from "@/components/StatefulDemo.tsx";
import "@/globals.scss";
---
<Base>
@@ -13,7 +12,7 @@ import "@/globals.scss";
Math.random() * 100 + "px " + Math.random() * 100 + "px",
}}
>
<div class="px-3 pt-4 pb-5 font-sans prose prose-zinc prose-invert">
<div class="px-3 pt-4 pb-5 font-inter prose prose-zinc prose-invert">
<h1
class="text-5xl font-bebas bold text-center mb-3 text-zinc-300"
style={{ textShadow: "0 0 10px rgba(0,0,0,0.7)" }}