136 lines
6.5 KiB
HTML
136 lines
6.5 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="en" class="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
|
<title>Project Rudraksha</title>
|
|
<!-- Favicon: Rudraksha Logo -->
|
|
<link rel="icon" href="https://iili.io/fgyxLsn.md.png">
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
darkMode: 'class',
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
rudra: {
|
|
50: '#fff7ed',
|
|
100: '#ffedd5',
|
|
200: '#fed7aa',
|
|
300: '#fdba74',
|
|
400: '#fb923c',
|
|
500: '#f97316',
|
|
600: '#ea580c',
|
|
700: '#c2410c',
|
|
800: '#9a3412',
|
|
900: '#7c2d12',
|
|
},
|
|
red: {
|
|
50: 'var(--color-red-50)',
|
|
100: 'var(--color-red-100)',
|
|
200: 'var(--color-red-200)',
|
|
300: 'var(--color-red-300)',
|
|
400: 'var(--color-red-400)',
|
|
500: 'var(--color-red-500)',
|
|
600: 'var(--color-red-600)',
|
|
700: 'var(--color-red-700)',
|
|
800: 'var(--color-red-800)',
|
|
900: 'var(--color-red-900)',
|
|
},
|
|
orange: {
|
|
50: 'var(--color-orange-50)',
|
|
100: 'var(--color-orange-100)',
|
|
200: 'var(--color-orange-200)',
|
|
300: 'var(--color-orange-300)',
|
|
400: 'var(--color-orange-400)',
|
|
500: 'var(--color-orange-500)',
|
|
600: 'var(--color-orange-600)',
|
|
700: 'var(--color-orange-700)',
|
|
800: 'var(--color-orange-800)',
|
|
900: 'var(--color-orange-900)',
|
|
}
|
|
},
|
|
animation: {
|
|
'fade-in': 'fadeIn 0.5s ease-out',
|
|
'slide-up': 'slideUp 0.5s ease-out',
|
|
'pulse-slow': 'pulse 3s infinite',
|
|
'dial-enter': 'dialEnter 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)',
|
|
'float': 'float 3s ease-in-out infinite',
|
|
'pop': 'pop 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275)',
|
|
'wave': 'wave 2s linear infinite',
|
|
'neon-flow': 'neonFlow 10s ease infinite',
|
|
},
|
|
keyframes: {
|
|
fadeIn: { '0%': { opacity: '0' }, '100%': { opacity: '1' } },
|
|
slideUp: { '0%': { transform: 'translateY(20px)', opacity: '0' }, '100%': { transform: 'translateY(0)', opacity: '1' } },
|
|
dialEnter: { '0%': { transform: 'scale(0) rotate(-90deg)', opacity: '0' }, '100%': { transform: 'scale(1) rotate(0deg)', opacity: '1' } },
|
|
float: { '0%, 100%': { transform: 'translateY(0)' }, '50%': { transform: 'translateY(-10px)' } },
|
|
pop: { '0%': { transform: 'scale(0.9)' }, '100%': { transform: 'scale(1)' } },
|
|
wave: { '0%': { transform: 'translateX(0)' }, '100%': { transform: 'translateX(-50%)' } },
|
|
neonFlow: { '0%, 100%': { backgroundPosition: '0% 50%' }, '50%': { backgroundPosition: '100% 50%' } }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
|
|
|
<!-- Leaflet CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
|
|
|
|
<!-- MarkerCluster CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.css" />
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.Default.css" />
|
|
|
|
<!-- Leaflet JS -->
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
|
|
|
<!-- MarkerCluster JS -->
|
|
<script src="https://unpkg.com/leaflet.markercluster@1.4.1/dist/leaflet.markercluster.js"></script>
|
|
|
|
<style>
|
|
:root {
|
|
--color-red-50: #fef2f2; --color-red-100: #fee2e2; --color-red-200: #fecaca; --color-red-300: #fca5a5; --color-red-400: #f87171; --color-red-500: #ef4444; --color-red-600: #dc2626; --color-red-700: #b91c1c; --color-red-800: #991b1b; --color-red-900: #7f1d1d;
|
|
--color-orange-50: #fff7ed; --color-orange-100: #ffedd5; --color-orange-200: #fed7aa; --color-orange-300: #fdba74; --color-orange-400: #fb923c; --color-orange-500: #f97316; --color-orange-600: #ea580c; --color-orange-700: #c2410c; --color-orange-800: #9a3412; --color-orange-900: #7c2d12;
|
|
}
|
|
body {
|
|
font-family: 'Inter', sans-serif;
|
|
transition: background-color 0.5s ease, color 0.5s ease, background-image 0.5s ease;
|
|
min-height: 100vh;
|
|
-webkit-user-select: none; user-select: none;
|
|
-webkit-tap-highlight-color: transparent;
|
|
overscroll-behavior-y: none;
|
|
}
|
|
.dark body { color: #f3f4f6; }
|
|
input, textarea, [contenteditable="true"] { -webkit-user-select: text; user-select: text; }
|
|
::-webkit-scrollbar { width: 8px; height: 8px; }
|
|
::-webkit-scrollbar-track { background: transparent; }
|
|
::-webkit-scrollbar-thumb { background: var(--color-orange-300); border-radius: 4px; }
|
|
.dark ::-webkit-scrollbar-thumb { background: var(--color-orange-800); }
|
|
.animate-neon-flow { background-size: 200% 200% !important; animation: neonFlow 10s ease infinite !important; }
|
|
@keyframes neonFlow { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
|
|
</style>
|
|
<script type="importmap">
|
|
{
|
|
"imports": {
|
|
"react/": "https://aistudiocdn.com/react@^19.2.1/",
|
|
"react": "https://aistudiocdn.com/react@^19.2.1",
|
|
"@google/genai": "https://aistudiocdn.com/@google/genai@^1.32.0",
|
|
"react-dom/": "https://aistudiocdn.com/react-dom@^19.2.1/",
|
|
"recharts": "https://aistudiocdn.com/recharts@^3.5.1",
|
|
"lucide-react": "https://aistudiocdn.com/lucide-react@^0.559.0",
|
|
"react-router-dom": "https://aistudiocdn.com/react-router-dom@^7.10.1",
|
|
"canvas-confetti": "https://aistudiocdn.com/canvas-confetti@^1.9.4",
|
|
"framer-motion": "https://esm.sh/framer-motion@11.11.11?external=react,react-dom"
|
|
}
|
|
}
|
|
</script>
|
|
<link rel="stylesheet" href="/index.css">
|
|
</head>
|
|
<body class="transition-colors duration-500">
|
|
<div id="root"></div>
|
|
<script type="module" src="./index.tsx"></script>
|
|
<script type="module" src="/index.tsx"></script>
|
|
</body>
|
|
</html> |