chore: Update CSS styles for site layout and colors

httpdss · Jul 15, 2024 · 83315a4 · 83315a4
1 parent b5e48ed
commit 83315a4
Show file tree

Hide file tree

Showing 3 changed files with 147 additions and 0 deletions.
diff --git a/site/css/style.css b/site/css/style.css
@@ -0,0 +1,73 @@
+body {
+    font-family: Arial, sans-serif;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    background-color: #1e1e1e;
+    color: #c5c6c7;
+}
+
+.container {
+    width: 80%;
+    margin: 0 auto;
+}
+
+header,
+footer {
+    background-color: #0b0c10;
+    color: #66fcf1;
+    text-align: center;
+    padding: 1em 0;
+}
+
+header h1 {
+    margin: 0;
+    font-size: 2.5em;
+}
+
+header p {
+    margin: 0.5em 0 0;
+}
+
+main {
+    flex: 1;
+    padding: 2em 0;
+}
+
+section {
+    margin-bottom: 2em;
+}
+
+h2 {
+    color: #66fcf1;
+}
+
+a {
+    color: #45a29e;
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+pre {
+    background-color: #0b0c10;
+    padding: 1em;
+    border-radius: 5px;
+    overflow-x: auto;
+}
+
+footer p {
+    margin: 0.5em 0;
+}
+
+footer a {
+    color: #66fcf1;
+}
+
+footer a:hover {
+    color: #45a29e;
+}
diff --git a/site/index.html b/site/index.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Struct - Project Structure Generator</title>
+    <link rel="stylesheet" href="css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+</head>
+
+<body>
+    <header>
+        <div class="container">
+            <h1><i class="fas fa-project-diagram"></i> Struct</h1>
+            <p>Your versatile project structure generator</p>
+        </div>
+    </header>
+    <main class="container">
+        <section>
+            <h2>About</h2>
+            <p>Struct is a powerful tool to automate the creation of project structures based on YAML configurations. It
+                supports template variables, OpenAI integration for generating content, and various file handling
+                strategies to customize your project setup.</p>
+        </section>
+        <section>
+            <h2>Features</h2>
+            <ul>
+                <li>Define project structure using YAML</li>
+                <li>Support for template variables</li>
+                <li>Integration with OpenAI for content generation</li>
+                <li>Flexible file handling strategies (overwrite, skip, append, rename, backup)</li>
+                <li>Modular YAML inclusion for nested structures</li>
+                <li>Dry-run mode to preview changes without making them</li>
+            </ul>
+        </section>
+        <section>
+            <h2>Getting Started</h2>
+            <p>To get started with Struct, follow these simple steps:</p>
+            <ol>
+                <li>Clone the repository</li>
+                <li>Define your project structure in a YAML file</li>
+                <li>Run Struct with your YAML configuration</li>
+            </ol>
+            <pre><code>git clone https://github.com/yourusername/struct.git
+cd struct
+python your_script.py path/to/project_structure.yaml /path/to/your/project --config-file=config.yaml</code></pre>
+        </section>
+        <section>
+            <h2>Documentation</h2>
+            <p>For detailed documentation, please visit our <a href="https://github.com/yourusername/struct/wiki"
+                    target="_blank">GitHub Wiki</a>.</p>
+        </section>
+        <section>
+            <h2>Contribute</h2>
+            <p>We welcome contributions from the community! Please read our <a
+                    href="https://github.com/yourusername/struct/blob/main/CONTRIBUTING.md" target="_blank">contributing
+                    guidelines</a> to get started.</p>
+        </section>
+    </main>
+    <footer>
+        <div class="container">
+            <p>&copy; 2024 Struct Project</p>
+            <p><a href="https://github.com/yourusername/struct" target="_blank"><i class="fab fa-github"></i> GitHub</a>
+            </p>
+        </div>
+    </footer>
+    <script src="js/script.js"></script>
+</body>
+
+</html>
diff --git a/site/js/script.js b/site/js/script.js
@@ -0,0 +1,3 @@
+document.addEventListener('DOMContentLoaded', function() {
+    console.log('JavaScript is running!');
+});