39f38d19ad
UI Enhancements: - Add Export button to header with download icon - Export modal with 4 format options: PDF, Markdown, JSON, Plain Text - Settings modal with Personality DNA toggle and API configuration - Privacy mode (Off the Record) toggle in header - Improved header layout with proper button spacing Backend: - Add Claude API server for backend integration - Add RAG-enabled variant for future document retrieval Technical: - Add data-testid for Export button for testing - Update dependencies for deployment compatibility Deployed to Proxmox container 200 at 85.239.243.227 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
110 lines
No EOL
3.8 KiB
HTML
110 lines
No EOL
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>if.emotion</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script src="https://unpkg.com/@tailwindcss/typography@0.5.10/dist/typography.min.js"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
sergio: {
|
|
50: '#FFF8DC', // Cornsilk (lightest background)
|
|
100: '#FAF0E6', // Linen (surface)
|
|
200: '#F5DEB3', // Wheat (user messages)
|
|
300: '#FFE4B5', // Moccasin (AI messages)
|
|
400: '#CD853F', // Peru (accent)
|
|
500: '#D2691E', // Chocolate (secondary)
|
|
600: '#8B4513', // Saddle brown (primary)
|
|
700: '#654321', // Dark brown
|
|
800: '#2F4F4F', // Dark slate gray (text)
|
|
900: '#1C1C1C', // Almost black (emphasis)
|
|
},
|
|
privacy: {
|
|
active: '#8B0000', // Dark red (off-the-record indicator)
|
|
muted: '#A9A9A9', // Gray (inactive state)
|
|
}
|
|
},
|
|
fontFamily: {
|
|
'spanish': ['Merriweather', 'serif'], // Emotional warmth
|
|
'english': ['Inter', 'sans-serif'], // Technical clarity
|
|
'mono': ['JetBrains Mono', 'monospace'],
|
|
},
|
|
spacing: {
|
|
'conversation': '1.5rem',
|
|
'message': '1rem 1.5rem',
|
|
},
|
|
borderRadius: {
|
|
'message': '1.25rem',
|
|
},
|
|
animation: {
|
|
'fade-in': 'fadeIn 0.5s ease-out forwards',
|
|
'slide-up': 'slideUp 0.3s ease-out forwards',
|
|
},
|
|
keyframes: {
|
|
fadeIn: {
|
|
'0%': { opacity: '0' },
|
|
'100%': { opacity: '1' },
|
|
},
|
|
slideUp: {
|
|
'0%': { opacity: '0', transform: 'translateY(10px)' },
|
|
'100%': { opacity: '1', transform: 'translateY(0)' },
|
|
}
|
|
}
|
|
}
|
|
},
|
|
plugins: [
|
|
function({ addBase, theme }) {
|
|
addBase({
|
|
'body': {
|
|
backgroundColor: theme('colors.sergio.50'),
|
|
color: theme('colors.sergio.800'),
|
|
fontFamily: theme('fontFamily.english'),
|
|
},
|
|
})
|
|
}
|
|
]
|
|
}
|
|
</script>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Merriweather:ital,wght@0,300;0,400;0,700;1,300;1,400&family=JetBrains+Mono&display=swap" rel="stylesheet">
|
|
<script type="importmap">
|
|
{
|
|
"imports": {
|
|
"react-dom/client": "https://aistudiocdn.com/react-dom@^19.2.0/client",
|
|
"react-dom": "https://aistudiocdn.com/react-dom@^19.2.0",
|
|
"react": "https://aistudiocdn.com/react@^19.2.0",
|
|
"react/jsx-runtime": "https://aistudiocdn.com/react@^19.2.0/jsx-runtime",
|
|
"react-markdown": "https://aistudiocdn.com/react-markdown@^9.0.1",
|
|
"lucide-react": "https://aistudiocdn.com/lucide-react@^0.344.0",
|
|
"jspdf": "https://aistudiocdn.com/jspdf@^2.5.1",
|
|
"react-dom/": "https://aistudiocdn.com/react-dom@^19.2.0/",
|
|
"react/": "https://aistudiocdn.com/react@^19.2.0/"
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
/* Custom scrollbar for minimalist look */
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: #D2691E; /* sergio-500 */
|
|
border-radius: 4px;
|
|
opacity: 0.5;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #8B4513;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/index.tsx"></script>
|
|
</body>
|
|
</html> |