DamageBDD · Onkar-0-9 · Apr 8, 2025
diff --git a/# Dependencies.md b/# Dependencies.md
@@ -0,0 +1,10 @@
+# Dependencies
+node_modules/
+
+# IDE specific files
+.vscode/
+.idea/
+
+# OS generated files
+.DS_Store
+Thumbs.db
diff --git a/about.html b/about.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>About - DamageBDD</title>
+    <link rel="stylesheet" href="./assets/css/style.css">
+    <link rel="stylesheet" href="./assets/css/base.css">
+    <link rel="stylesheet" href="./assets/css/about.css">
+</head>
+<body>
+    <nav class="navbar">
+        <ul class="nav-links">
+            <li><a href="./index.html">Home</a></li>
+            <li><a href="./manual.html">Get Started!</a></li>
+            <li><a href="./pricing.html">Pricing</a></li>
+            <li><a href="./articles/">Articles</a></li>
+            <li><a href="./about.html">About</a></li>
+        </ul>
+    </nav>
+
+    <button id="theme-toggle" class="theme-toggle" aria-label="Toggle dark mode">
+        <svg class="sun-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+            <circle cx="12" cy="12" r="5"></circle>
+            <line x1="12" y1="1" x2="12" y2="3"></line>
+            <line x1="12" y1="21" x2="12" y2="23"></line>
+            <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+            <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+            <line x1="1" y1="12" x2="3" y2="12"></line>
+            <line x1="21" y1="12" x2="23" y2="12"></line>
+            <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+            <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+        </svg>
+        <svg class="moon-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+            <path d="M21 12.79A9 9 0 1 1 11.21 3 A7 7 0 0 0 21 12.79z"></path>
+        </svg>
+    </button>
+
+    <header>
+        <!-- Navigation will be included here -->
+    </header>
+
+    <main>
+        <article class="about-content">
+            <h1>About DamageBDD</h1>
+
+            <section class="intro">
+                <p>Welcome to DamageBDD! We are a cutting-edge technology company founded by Steven, an experienced developer and a passionate solopreneur. Steven's expertise lies in using Behavior-Driven Development (BDD) to ensure the performance and quality of server-side applications.</p>
+            </section>
+
+            <section class="journey">
+                <p>At the beginning of his journey, Steven started using Behave BDD to verify the behavior of his applications. However, he soon encountered limitations and complexities in managing the entire infrastructure required to support a BDD workflow. This led him on a quest to find a better solution in the market. However, most available options were subscription-based or required additional software installations to manage tests or was just clunky.</p>
+            </section>
+
+            <section class="solution">
+                <p>Steven envisioned a tool that would integrate seamlessly with CI/CD workflow, making it exceptionally user-friendly for him and his team. This is when DamageBDD was born. With DamageBDD, managing your tests is as simple as running a curl command. No special software installations required.</p>
+            </section>
+
+            <section class="vision">
+                <p>After successfully completing his own startup journey, Steven was determined to productize DamageBDD and share the efficiency gains he experienced with the wider industry. He firmly believes that DamageBDD can effectively maintain high-quality, highly available software. Its simplicity and versatility make it applicable to a wide range of use cases.</p>
+            </section>
+
+            <section class="call-to-action">
+                <p>Join us on this exciting journey as we revolutionize the way software is developed and maintained. With DamageBDD, you can ensure the highest standards of performance, quality, and availability for your applications. Experience the power of BDD without the complexity—it's just a command away!</p>
+                <p class="tagline">Welcome to DamageBDD - where simplicity meets power!</p>
+            </section>
+        </article>
+    </main>
+
+    <footer>
+        <!-- Footer content will be included here -->
+    </footer>
+    <script src="./assets/js/theme.js"></script>
+</body>
+</html>
+
diff --git a/about.org b/about.org
diff --git a/accounts.html b/accounts.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Create Account - DamageBDD</title>
+    <link rel="stylesheet" href="./assets/css/style.css">
+    <link rel="stylesheet" href="./assets/css/base.css">
+</head>
+<body>
+    <main class="account-page">
+        <div class="form-container">
+            <h1>Create an Account</h1>
+            <p class="intro-text">To fully utilize the capabilities of DamageBDD, you need to create an account.</p>
+
+            <form id="kycForm" action="/accounts/create" method="post" class="signup-form">
+                <input type="hidden" name="csrf_token" value="your_csrf_token_here">
+
+                <div class="form-group">
+                    <label for="full_name">Full Name</label>
+                    <input type="text" id="full_name" name="full_name">
+                </div>
+
+                <div class="form-group">
+                    <label for="email">Email<span class="required">*</span></label>
+                    <input type="email" id="email" name="email" required>
+                </div>
+
+                <div class="terms-agreement">
+                    <p>By clicking submit you are agreeing to the <a href="/tac.html">terms & conditions</a>.</p>
+                </div>
+
+                <button type="submit" class="submit-btn">Create Account</button>
+            </form>
+
+            <div class="post-submit-info">
+                <p>After submitting the form, you will receive a confirmation link in your email. 
+                Click on the link to set your password.</p>
+                <p>See our <a href="manual.html">Getting Started</a> guide for steps to get an AUTH_TOKEN and use the API.</p>
+            </div>
+        </div>
+    </main>
+</body>
+</html>
+
diff --git a/accounts.org b/accounts.org
diff --git a/assets/css/about.css b/assets/css/about.css
@@ -0,0 +1,120 @@
+.about-content {
+    max-width: 800px;
+    margin: 6rem auto 4rem;
+    padding: 0 2rem;
+}
+
+.about-content h1 {
+    font-size: 2.5rem;
+    color: var(--heading-color);
+    margin-bottom: 2rem;
+    text-align: center;
+    background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+.about-content section {
+    margin: 2.5rem 0;
+}
+
+.about-content p {
+    font-size: 1.1rem;
+    line-height: 1.8;
+    color: var(--text-color);
+    margin-bottom: 1.5rem;
+}
+
+.intro p {
+    font-size: 1.2rem;
+    font-weight: 500;
+}
+
+.journey, .solution, .vision {
+    background: var(--card-bg);
+    padding: 2rem;
+    border-radius: 1rem;
+    box-shadow: var(--card-shadow);
+    border: 1px solid var(--border-color);
+    transition: transform 0.2s ease;
+}
+
+.journey:hover, .solution:hover, .vision:hover {
+    transform: translateY(-5px);
+}
+
+.call-to-action {
+    text-align: center;
+    padding: 3rem 2rem;
+    background: linear-gradient(to right, var(--primary-color), var(--secondary-color));
+    border-radius: 1rem;
+    margin: 4rem 0;
+}
+
+.call-to-action p {
+    color: white;
+    margin-bottom: 1rem;
+}
+
+.tagline {
+    font-size: 1.4rem;
+    font-weight: 600;
+    margin-top: 2rem;
+}
+
+/* Add navigation from index page */
+.navbar {
+    position: fixed;
+    top: 0;
+    right: 4rem;
+    padding: 1.5rem 2rem;
+    z-index: 1000;
+    display: flex;
+    align-items: center;
+}
+
+.nav-links {
+    display: flex;
+    gap: 2rem;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.nav-links a {
+    color: var(--text-color);
+    text-decoration: none;
+    font-weight: 500;
+    font-size: 1rem;
+    padding: 0.5rem 0;
+    transition: all 0.2s ease;
+}
+
+.nav-links a:hover {
+    color: var(--primary-color);
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+    .about-content {
+        margin: 4rem auto 2rem;
+        padding: 0 1rem;
+    }
+
+    .about-content h1 {
+        font-size: 2rem;
+    }
+
+    .journey, .solution, .vision {
+        padding: 1.5rem;
+    }
+
+    .call-to-action {
+        padding: 2rem 1rem;
+        margin: 2rem 0;
+    }
+
+    .tagline {
+        font-size: 1.2rem;
+    }
+}
diff --git a/assets/css/base.css b/assets/css/base.css
@@ -0,0 +1,33 @@
+:root {
+    --primary-color: #6366f1;
+    --secondary-color: #4f46e5;
+    --bg-color: #ffffff;
+    --text-color: #334155;
+    --heading-color: #1e293b;
+    --border-color: #e2e8f0;
+    --card-bg: #ffffff;
+    --card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+    --code-bg: #f8fafc;
+}
+
+[data-theme="dark"] {
+    --primary-color: #818cf8;
+    --secondary-color: #6366f1;
+    --bg-color: #0f172a;
+    --text-color: #e2e8f0;
+    --heading-color: #f8fafc;
+    --border-color: #1e293b;
+    --card-bg: #1e293b;
+    --card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
+    --code-bg: #2d3748;
+}
+
+/* Base styles */
+body {
+    font-family: 'Inter', system-ui, -apple-system, sans-serif;
+    line-height: 1.6;
+    color: var(--text-color);
+    background-color: var(--bg-color);
+    margin: 0;
+    padding: 0;
+}