Merge pull request #3 from bhargavyagnik/dev

V.0.1.0 Update
bhargavyagnik · Nov 18, 2024 · 8236681 · 8236681
2 parents d7144cf + 0d3b758
commit 8236681
Show file tree

Hide file tree

Showing 23 changed files with 1,236 additions and 319 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,4 +3,5 @@ src/extension/lib/*
 extension.crx
 extension.pem
 .DS_Store
-extension.zip
+extension.zip
+client_secret_331738423824-bt52qqf8k1aaa5icjfkp0fu1ebo29e07.apps.googleusercontent.com.json
diff --git a/how-to-use.html b/how-to-use.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>How to Use - Coverquai</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <nav class="nav">
+        <div class="nav-container">
+            <a href="index.html" class="nav-logo">Coverquai</a>
+            <div class="nav-links">
+                <a href="index.html">Home</a>
+                <a href="how-to-use.html">How to Use</a>
+                <a href="tos.html">Terms of Service</a>
+            </div>
+        </div>
+    </nav>
+
+    <header>
+        <h1>How to Use Coverquai</h1>
+        <p>Follow these simple steps to generate your perfect cover letter</p>
+    </header>
+
+    <div class="container">
+        <div class="steps">
+            <div class="step-card">
+                <div class="step-content">
+                    <h3>Step 1: Install the Extension</h3>
+                    <p>Add Coverquai to Chrome from the Chrome Web Store. It's completely free!</p>
+                </div>
+                <div class="step-image-container">
+                    <img src="screenshots/step1.png" alt="Installation step" class="step-image">
+                </div>
+            </div>
+
+            <div class="step-card">
+                <div class="step-content">
+                    <h3>Step 2: Upload Your Resume</h3>
+                    <p>Upload your resume once and set it as default for quick access.</p>
+                </div>
+                <div class="step-image-container">
+                    <img src="screenshots/step2.png" alt="Resume upload step" class="step-image">
+                </div>
+            </div>
+
+            <div class="step-card">
+                <div class="step-content">
+                    <h3>Step 3: Find a Job</h3>
+                    <p>Navigate to any job posting on supported websites.</p>
+                    <p>Currently supported websites: LinkedIn, Glassdoor, Workday, Eightfold AI</p>
+                </div>
+            </div>
+
+            <div class="step-card">
+                <div class="step-content">
+                    <h3>Step 4: Generate Cover Letter and Download</h3>
+                    <p>Click the Coverquai icon and watch as AI creates your personalized cover letter.</p>
+                    <p>Download the cover letter as a PDF or copy the text directly.</p>
+                </div>
+                <div class="step-image-container">
+                    <img src="screenshots/step4.png" alt="Generation step" class="step-image">
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+</html> 
diff --git a/index.html b/index.html
@@ -4,65 +4,20 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Coverquai - Chrome Extension</title>
-    <style>
-        body {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-            line-height: 1.6;
-            margin: 0;
-            padding: 0;
-            color: #333;
-        }
-
-        header {
-            background: linear-gradient(135deg, #2196F3, #1976D2);
-            color: white;
-            padding: 4rem 2rem;
-            text-align: center;
-        }
-
-        .container {
-            max-width: 1200px;
-            margin: 0 auto;
-            padding: 2rem;
-        }
-
-        .features {
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-            gap: 2rem;
-            margin: 3rem 0;
-        }
-
-        .feature-card {
-            background: #fff;
-            padding: 1.5rem;
-            border-radius: 8px;
-            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
-        }
-
-        .cta-button {
-            display: inline-block;
-            background: #2196F3;
-            color: white;
-            padding: 1rem 2rem;
-            border-radius: 25px;
-            text-decoration: none;
-            font-weight: bold;
-            transition: background 0.3s;
-        }
-
-        .cta-button:hover {
-            background: #1976D2;
-        }
-
-        .demo-image {
-            max-width: 100%;
-            border-radius: 8px;
-            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
-        }
-    </style>
+    <link rel="stylesheet" href="styles.css">
 </head>
 <body>
+    <nav class="nav">
+        <div class="nav-container">
+            <a href="index.html" class="nav-logo">Coverquai</a>
+            <div class="nav-links">
+                <a href="index.html">Home</a>
+                <a href="how-to-use.html">How to Use</a>
+                <a href="tos.html">Terms of Service</a>
+            </div>
+        </div>
+    </nav>
+
     <header>
         <h1>Coverquai</h1>
         <p>Generate tailored cover letters instantly using AI</p>

diff --git a/screenshots/glassdoor_generation.png b/screenshots/glassdoor_generation.png
diff --git a/screenshots/linkedin_generation.png b/screenshots/linkedin_generation.png
diff --git a/screenshots/options_page.png b/screenshots/options_page.png
diff --git a/screenshots/step1.png b/screenshots/step1.png
diff --git a/screenshots/step2.png b/screenshots/step2.png
diff --git a/screenshots/step4.png b/screenshots/step4.png