Philip
7cdd75ea83
This commit sets up the foundational structure for the QuizMaster Live application. It includes: - Initializing a new Vite project with React and TypeScript. - Configuring project dependencies and build tools (Vite, TypeScript). - Defining core application types for game state, players, questions, etc. - Setting up basic Tailwind CSS for styling and defining custom animations. - Integrating with the Google Gemini API for AI-powered question generation. - Configuring environment variables for API keys and defining the application's metadata. - Adding a README with setup instructions and local development guide.
58 lines
1.6 KiB
HTML
58 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>QuizMaster Live</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
animation: {
|
|
'bounce-in': 'bounceIn 0.5s cubic-bezier(0.8, 0, 1, 1)',
|
|
'fade-in': 'fadeIn 0.5s ease-out',
|
|
'fade-in-up': 'fadeInUp 0.5s ease-out',
|
|
},
|
|
keyframes: {
|
|
bounceIn: {
|
|
'0%, 100%': { transform: 'scale(1)' },
|
|
'50%': { transform: 'scale(1.1)' },
|
|
},
|
|
fadeIn: {
|
|
'0%': { opacity: '0' },
|
|
'100%': { opacity: '1' },
|
|
},
|
|
fadeInUp: {
|
|
'0%': { opacity: '0', transform: 'translateY(20px)' },
|
|
'100%': { opacity: '1', transform: 'translateY(0)' },
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
/* Custom utility for full-screen text handling */
|
|
body {
|
|
overscroll-behavior: none;
|
|
}
|
|
</style>
|
|
<script type="importmap">
|
|
{
|
|
"imports": {
|
|
"react-dom/": "https://esm.sh/react-dom@^19.2.4/",
|
|
"@google/genai": "https://esm.sh/@google/genai@^1.38.0",
|
|
"react/": "https://esm.sh/react@^19.2.4/",
|
|
"react": "https://esm.sh/react@^19.2.4",
|
|
"lucide-react": "https://esm.sh/lucide-react@^0.563.0",
|
|
"recharts": "https://esm.sh/recharts@^3.7.0"
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
</body>
|
|
</html>
|