Update index.html with new design and content

bg-playground · bg-playground · commit e4c6aab848c1 · 2026-02-11T13:12:01.000-05:00
diff --git a/docs/index.html b/docs/index.html
@@ -4,20 +4,83 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Software Testing Concepts Demo</title>
+    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+    <style>
+        body {
+            font-family: 'Roboto', sans-serif;
+            margin: 0;
+            padding: 0;
+            line-height: 1.6;
+            background-color: #f4f4f4;
+        }
+        header {
+            background-color: #007bff;
+            color: #fff;
+            padding: 20px 0;
+            text-align: center;
+        }
+        header h1 {
+            margin: 0;
+            font-size: 2.5em;
+        }
+        header p {
+            margin: 10px 0 0;
+            font-size: 1.2em;
+        }
+        .container {
+            width: 80%;
+            margin: auto;
+            overflow: hidden;
+            padding: 20px;
+            background: #ffffff;
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+            border-radius: 8px;
+        }
+        .about {
+            margin: 20px 0;
+        }
+        .about h2 {
+            text-align: center;
+            color: #333;
+        }
+        .about ul {
+            list-style: circle;
+            margin: 10px 0 0 20px;
+            padding: 0;
+        }
+        .about li {
+            margin-bottom: 10px;
+        }
+        footer {
+            background: #333;
+            color: white;
+            padding: 10px 0;
+            text-align: center;
+        }
+        footer a {
+            color: #ffc107;
+            text-decoration: none;
+        }
+    </style>
 </head>
 <body>
-    <h1>Software Testing Concepts Demo</h1>
-    <h2>A journey into modern testing concepts</h2>
-    <section>
-        <h3>About</h3>
-        <ul>
-            <li>Understanding the basics of software testing.</li>
-            <li>Exploring various testing methodologies.</li>
-            <li>The importance of automated testing in software development.</li>
-        </ul>
-    </section>
+    <header>
+        <h1>Software Testing Concepts Demo</h1>
+        <p>A journey into modern testing concepts</p>
+    </header>
+    <div class="container">
+        <section class="about">
+            <h2>About This Repository</h2>
+            <ul>
+                <li>Showcases comprehensive software testing techniques and strategies.</li>
+                <li>Covers manual and automated testing methodologies.</li>
+                <li>Includes Playwright integration for modern UI testing.</li>
+                <li>Provides a practical demonstration of continuous integration using GitHub Actions.</li>
+            </ul>
+        </section>
+    </div>
     <footer>
-        <p>Find Brad on <a href="https://twitter.com/brad">Twitter</a>!</p>
+        <p>&copy; 2026 - <a href="https://github.com/bg-playground/TestingDemo-02">View the Repository</a></p>
     </footer>
 </body>
 </html>
