solverforge-ui 0.5.0

Frontend component library for SolverForge constraint-optimization applications
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>solverforge-ui demos</title>
  <link rel="stylesheet" href="../static/sf/vendor/fontawesome/css/fontawesome.min.css">
  <link rel="stylesheet" href="../static/sf/vendor/fontawesome/css/solid.min.css">
  <link rel="stylesheet" href="../static/sf/sf.css">
  <style>
    body { margin: 0; }
    .demo-shell { max-width: 960px; margin: 0 auto; padding: 48px 24px 72px; }
    .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
    .demo-card { background: white; border: 1px solid var(--sf-gray-200); border-radius: 12px; padding: 20px; box-shadow: var(--sf-shadow-base); }
    .demo-card h2 { margin: 0 0 10px; font-size: 20px; }
    .demo-card p { margin: 0 0 16px; color: var(--sf-gray-600); line-height: 1.6; }
    .demo-card a { color: var(--sf-emerald-700); font-weight: 600; text-decoration: none; }
  </style>
</head>
<body class="sf-app">
  <main class="sf-main">
    <div class="demo-shell">
      <h1>solverforge-ui demo fixtures</h1>
      <p>These fixtures exercise the shipped component surface using the bundled assets from this repository.</p>
      <div class="demo-grid">
        <section class="demo-card">
          <h2>Full Surface</h2>
          <p>Header, status bar, tabs, table, modal, toast, API guide, the canonical scheduling timeline, footer, and Gantt in one runnable fixture.</p>
          <a href="./full-surface.html">Open full-surface demo</a>
        </section>
        <section class="demo-card">
          <h2>Scheduling Timeline</h2>
          <p>A focused 28-day hospital-like scheduling example built with <code>SF.rail.createTimeline()</code>, including additive overview summaries and inline expansion.</p>
          <a href="./timeline.html">Open timeline demo</a>
        </section>
        <section class="demo-card">
          <h2>Dense Timeline</h2>
          <p>The repeatable 28-day, 100-lane, 1500-item validation fixture used for dense schedule acceptance and screenshot capture.</p>
          <a href="./timeline-dense.html">Open dense timeline demo</a>
        </section>
        <section class="demo-card">
          <h2>Rail Primitives</h2>
          <p>A smaller advanced fixture for validating low-level resource cards, gauges, changeovers, and positioned blocks.</p>
          <a href="./rail.html">Open rail demo</a>
        </section>
      </div>
    </div>
  </main>
</body>
</html>