Added Support Button

Author: clusterzx

public/css/dashboard.css

@@ -840,4 +840,75 @@ body {
 ::-webkit-scrollbar-thumb {
     background: var(--accent-secondary);
     border-radius: 4px;
-}
+}
+
+/* GitHub Star Button */
+.github-button {
+    display: inline-flex;
+    align-items: center;
+    font-weight: 500;
+    font-size: 14px;
+    text-decoration: none;
+    border-radius: 6px;
+    transition: all 0.2s ease;
+    overflow: hidden;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
+  }
+  
+  .github-button:hover {
+    text-decoration: none;
+  }
+  
+  .star-button {
+    display: flex;
+    align-items: center;
+    padding: 5px 12px;
+    background-color: var(--bg-primary);
+    color: var(--text-primary);
+    border: 1px solid var(--border-color);
+    border-right: 0;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+    border-top-left-radius: 6px;
+    border-bottom-left-radius: 6px;
+    transition: background-color 0.2s;
+  }
+  
+  .star-count {
+    position: relative;
+    padding: 5px 12px;
+    font-weight: 600;
+    background-color: var(--bg-primary);
+    color: var(--text-primary);
+    border: 1px solid var(--border-color);
+    border-top-right-radius: 6px;
+    border-bottom-right-radius: 6px;
+    transition: background-color 0.2s;
+  }
+  
+  .star-count::before {
+    content: '';
+    position: absolute;
+    left: -5px;
+    top: 50%;
+    transform: translateY(-50%) rotate(45deg);
+    width: 8px;
+    height: 8px;
+    background-color: var(--bg-primary);
+    border-left: 1px solid var(--border-color);
+    border-bottom: 1px solid var(--border-color);
+  }
+  
+  .github-button:hover .star-button {
+    background-color: var(--hover-bg);
+  }
+  
+  .star-icon {
+    fill: var(--accent-primary);
+    margin-right: 4px;
+    transition: transform 0.3s ease;
+  }
+  
+  .github-button:hover .star-icon {
+    transform: rotate(-15deg) scale(1.2);
+  }

views/chat.ejs

@@ -39,6 +39,20 @@
                     <li><a href="/settings" class="sidebar-link"><i class="fas fa-cog"></i><span>Settings</span></a></li>
                     <li><a href="/logout" class="sidebar-link"><i class="fa-solid fa-right-from-bracket"></i><span>Logout</span></a></li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                class="github-button" 
+                style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                <span class="star-button">
+                    <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                        <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                    </svg>
+                    Star
+                </span>
+                <span id="starCount" class="star-count">1.2k</span>
+            </a>
+            <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                Please support us on GitHub
+            </p>
             </nav>
         </aside>
 
@@ -140,6 +154,23 @@
             });
         });
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="js/dashboard.js"></script>
     <script src="js/chat.js"></script>
 </body>

views/dashboard.ejs

@@ -71,6 +71,20 @@
                         </a>
                     </li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                    class="github-button" 
+                    style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                    <span class="star-button">
+                        <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                            <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                        </svg>
+                        Star
+                    </span>
+                    <span id="starCount" class="star-count">1.2k</span>
+                </a>
+                <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                    Please support us on GitHub
+                </p>
             </nav>
         </aside>
 
@@ -630,6 +644,23 @@
         // Initial update
         updateProcessingStatus();
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="js/dashboard.js"></script>
 </body>
 </html>

views/history.ejs

@@ -66,6 +66,20 @@
                     <li><a href="/settings" class="sidebar-link"><i class="fas fa-cog"></i><span>Settings</span></a></li>
                     <li><a href="/logout" class="sidebar-link"><i class="fa-solid fa-right-from-bracket"></i><span>Logout</span></a></li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                class="github-button" 
+                style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                <span class="star-button">
+                    <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                        <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                    </svg>
+                    Star
+                </span>
+                <span id="starCount" class="star-count">1.2k</span>
+            </a>
+            <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                Please support us on GitHub
+            </p>
             </nav>
         </aside>
 
@@ -208,6 +222,23 @@
             });
         });
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
     <script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
     <script src="js/history.js"></script>

views/manual.ejs

@@ -71,6 +71,20 @@
                         </a>
                     </li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                class="github-button" 
+                style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                <span class="star-button">
+                    <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                        <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                    </svg>
+                    Star
+                </span>
+                <span id="starCount" class="star-count">1.2k</span>
+            </a>
+            <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                Please support us on GitHub
+            </p>
             </nav>
         </aside>
 
@@ -667,6 +681,23 @@ return object;
             });
         });
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="js/dashboard.js"></script>
 </body>
 </html>

views/playground.ejs

@@ -95,6 +95,20 @@
                         </a>
                     </li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                class="github-button" 
+                style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                <span class="star-button">
+                    <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                        <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                    </svg>
+                    Star
+                </span>
+                <span id="starCount" class="star-count">1.2k</span>
+            </a>
+            <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                Please support us on GitHub
+            </p>
             </nav>
         </aside>
 
@@ -239,6 +253,23 @@
             });
         });
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="js/playground.js"></script>
 </body>
 </html>

views/settings.ejs

@@ -136,6 +136,20 @@
                         </a>
                     </li>
                 </ul>
+                <a href="https://github.com/clusterzx/paperless-ai" 
+                class="github-button" 
+                style="position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);">
+                <span class="star-button">
+                    <svg class="star-icon" height="16" width="16" viewBox="0 0 16 16">
+                        <path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"></path>
+                    </svg>
+                    Star
+                </span>
+                <span id="starCount" class="star-count">1.2k</span>
+            </a>
+            <p style="position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 10px; color: #555; text-align: center;">
+                Please support us on GitHub
+            </p>
             </nav>
         </aside>
 
@@ -936,6 +950,23 @@
             });
         });
     </script>
+    <script>
+        // get github stars count from repo
+        async function getStarsCount() {
+            try {
+                const response = await fetch('https://api.github.com/repos/clusterzx/paperless-ai');
+                if (!response.ok) throw new Error('Failed to fetch repo info');
+                
+                const data = await response.json();
+                document.getElementById('starCount').textContent = data.stargazers_count.toLocaleString();
+            } catch (error) {
+                console.error('Failed to fetch stars count:', error);
+            }
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            getStarsCount();
+        });
+    </script>
     <script src="js/settings.js"></script>
 </body>
 </html>