95eff42dfe
Co-authored-by: Lala, Shahd <Shahd.Lala@sybit.de> Co-authored-by: shahdlala66 <shahd.lala66@gmail.com> Reviewed-on: #8
90 lines
3.1 KiB
HTML
90 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>NowChess — Auth Dialog</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<style>
|
|
:root {
|
|
--sans: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
--mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;
|
|
--neon: #ff45c8;
|
|
--neon-soft: rgba(255, 69, 200, 0.55);
|
|
}
|
|
* { box-sizing: border-box; }
|
|
html, body {
|
|
margin: 0;
|
|
padding: 0;
|
|
background: #06060d;
|
|
font-family: var(--sans);
|
|
color: #fff;
|
|
overflow: hidden;
|
|
min-height: 100vh;
|
|
}
|
|
button, input { font-family: var(--sans); }
|
|
input { color: #fff; }
|
|
input:-webkit-autofill,
|
|
input:-webkit-autofill:hover,
|
|
input:-webkit-autofill:focus {
|
|
-webkit-text-fill-color: #fff;
|
|
-webkit-box-shadow: 0 0 0px 1000px rgba(8,5,20,0) inset;
|
|
transition: background-color 5000s ease-in-out 0s;
|
|
}
|
|
::-webkit-scrollbar { width: 8px; height: 8px; }
|
|
::-webkit-scrollbar-track { background: transparent; }
|
|
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 4px; }
|
|
::-webkit-scrollbar-thumb:hover { background: rgba(255,69,200,0.3); }
|
|
|
|
@keyframes scanline {
|
|
0% { transform: translateY(-100%); }
|
|
100% { transform: translateY(100%); }
|
|
}
|
|
@keyframes pulse-glow {
|
|
0%, 100% { opacity: 0.85; }
|
|
50% { opacity: 1; }
|
|
}
|
|
@keyframes dialog-in {
|
|
from { opacity: 0; transform: translate(-50%, -48%) scale(0.96); }
|
|
to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
|
|
}
|
|
@keyframes backdrop-in {
|
|
from { opacity: 0; }
|
|
to { opacity: 1; }
|
|
}
|
|
@keyframes shake {
|
|
0%, 100% { transform: translateX(0); }
|
|
20%, 60% { transform: translateX(-4px); }
|
|
40%, 80% { transform: translateX(4px); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
|
|
<script
|
|
src="https://unpkg.com/react@18.3.1/umd/react.development.js"
|
|
integrity="sha384-hD6/rw4ppMLGNu3tX5cjIb+uRZ7UkRJ6BPkLpg4hAu/6onKUg4lLsHAs9EBPT82L"
|
|
crossorigin="anonymous"
|
|
></script>
|
|
<script
|
|
src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.development.js"
|
|
integrity="sha384-u6aeetuaXnQ38mYT8rp6sbXaQe3NL9t+IBXmnYxwkUI2Hw4bsp2Wvmx4yRQF1uAm"
|
|
crossorigin="anonymous"
|
|
></script>
|
|
<script
|
|
src="https://unpkg.com/@babel/standalone@7.29.0/babel.min.js"
|
|
integrity="sha384-m08KidiNqLdpJqLq95G/LEi8Qvjl/xUYll3QILypMoQ65QorJ9Lvtp2RXYGBFj1y"
|
|
crossorigin="anonymous"
|
|
></script>
|
|
|
|
<script type="text/babel" src="tweaks-panel.jsx"></script>
|
|
<script type="text/babel" src="auth-dialog.jsx"></script>
|
|
</body>
|
|
</html>
|