1import fs from 'fs';2import path from 'path';34// HTML template with the necessary scripts and styles5const html = `<!DOCTYPE html>6<html lang="en">7<head>8  <meta charset="UTF-8">9  <meta name="viewport" content="width=device-width, initial-scale=1.0">10  <title>Twemco World Clock</title>11  <script src="https://unpkg.com/react@18/umd/react.production.min.js"></script>12  <script src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>13  <script src="https://unpkg.com/lucide-react@latest/dist/umd/lucide-react.min.js"></script>14  <style>15    body {16      margin: 0;17      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;18    }19    20    /* Add the flip animation styles */21    @keyframes flipTop {22      0% {23        transform: rotateX(0deg);24        z-index: 2;25      }26      100% {27        transform: rotateX(-180deg);28        z-index: 1;29      }30    }31    32    .flip-card {33      perspective: 1000px;34    }35    36    .flip-top {37      transform-origin: bottom center;38      animation: flipTop 0.3s ease-in forwards;39    }40    41    .card-face {42      backface-visibility: hidden;43      -webkit-backface-visibility: hidden;44    }45    46    /* Add your additional styles here */47    /* ... */48  </style>49</head>50<body>51  <div id="root"></div>52  <script src="world-clock.js"></script>53</body>54</html>`;5556// Write the HTML file57fs.writeFileSync('index.html', html);5859console.log('Standalone files created successfully!');60console.log('Upload these files to your server at hinzandkunz.com/twemco/');