`frontend/public/index.html`

81 lines
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Dear Bubbe Admin Dashboard - Real-time Monitoring and Alert System"
    />
    <title>Dear Bubbe Admin Dashboard</title>
    <style>
      body {
        margin: 0;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
          'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
          sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        background-color: #f8fafc;
      }
      code {
        font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
          monospace;
      }
      
      /* Loading spinner */
      .loading-spinner {
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 3px solid #f3f3f3;
        border-top: 3px solid #3498db;
        border-radius: 50%;
        animation: spin 1s linear infinite;
      }
      
      @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
      }
      
      /* Alert styles */
      .alert {
        padding: 12px 16px;
        margin: 8px 0;
        border-radius: 4px;
        border-left: 4px solid;
      }
      
      .alert-critical {
        background-color: #fee;
        border-left-color: #dc2626;
        color: #dc2626;
      }
      
      .alert-high {
        background-color: #fef3cd;
        border-left-color: #f59e0b;
        color: #f59e0b;
      }
      
      .alert-medium {
        background-color: #e1f5fe;
        border-left-color: #3b82f6;
        color: #3b82f6;
      }
      
      .alert-low {
        background-color: #f0f9ff;
        border-left-color: #6b7280;
        color: #6b7280;
      }
    </style>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>