Add front-end Electron application for Khoj local file syncing (#473)

* Initial version - setup a file-push architecture for generating embeddings with Khoj * Use state.host and state.port for configuring the URL for the indexer * Fix parsing of PDF files * Read markdown files from streamed data and update unit tests * On application startup, load in embeddings from configurations files, rather than regenerating the corpus based on file system * Init: refactor indexer/batch endpoint to support a generic file ingestion format * Add features to better support indexing from files sent by the desktop client * Initial commit with Electron application - Adds electron app * Add import for pymupdf, remove import for pypdf * Allow user to configure khoj host URL * Remove search type configuration from index.html * Use v1 path for current indexer routes
2026-03-04 05:39:06 +00:00 · 2023-09-06 12:04:18 -07:00
parent 205dc90746
commit 76562f4250
54 changed files with 20132 additions and 82 deletions
--- a/src/interface/desktop/assets/khoj.css
+++ b/src/interface/desktop/assets/khoj.css
@@ -0,0 +1,116 @@
+/* Amber Light scheme (Default) */
+/* Can be forced with data-theme="light" */
+[data-theme="light"],
+:root:not([data-theme="dark"]) {
+    --primary: #ffb300;
+    --primary-hover: #ffa000;
+    --primary-focus: rgba(255, 179, 0, 0.125);
+    --primary-inverse: rgba(0, 0, 0, 0.75);
+}
+
+/* Amber Dark scheme (Auto) */
+/* Automatically enabled if user has Dark mode enabled */
+@media only screen and (prefers-color-scheme: dark) {
+    :root:not([data-theme]) {
+        --primary: #ffb300;
+        --primary-hover: #ffc107;
+        --primary-focus: rgba(255, 179, 0, 0.25);
+        --primary-inverse: rgba(0, 0, 0, 0.75);
+    }
+}
+/* Amber Dark scheme (Forced) */
+/* Enabled if forced with data-theme="dark" */
+[data-theme="dark"] {
+    --primary: #ffb300;
+    --primary-hover: #ffc107;
+    --primary-focus: rgba(255, 179, 0, 0.25);
+    --primary-inverse: rgba(0, 0, 0, 0.75);
+}
+/* Amber (Common styles) */
+:root {
+    --form-element-active-border-color: var(--primary);
+    --form-element-focus-color: var(--primary-focus);
+    --switch-color: var(--primary-inverse);
+    --switch-checked-background-color: var(--primary);
+}
+
+.khoj-configure {
+    display: grid;
+    grid-template-columns: 1fr;
+    padding: 0 24px;
+}
+.khoj-header {
+    display: grid;
+    grid-auto-flow: column;
+    gap: 20px;
+    padding: 16px 0;
+    margin: 0 0 16px 0;
+}
+
+nav.khoj-nav {
+    display: grid;
+    grid-auto-flow: column;
+    grid-gap: 32px;
+    justify-self: right;
+}
+
+a.khoj-nav {
+    display: flex;
+    align-items: center;
+}
+
+a.khoj-logo {
+    justify-self: left;
+}
+
+.khoj-nav a {
+    color: #333;
+    text-decoration: none;
+    font-size: small;
+    font-weight: normal;
+    padding: 0 4px;
+    border-radius: 4px;
+    justify-self: center;
+    margin: 0;
+}
+.khoj-nav a:hover {
+    background-color: var(--primary-hover);
+}
+.khoj-nav-selected {
+    background-color: var(--primary);
+}
+img.khoj-logo {
+    width: min(60vw, 111px);
+    max-width: 100%;
+    justify-self: center;
+}
+
+a.khoj-banner {
+    color: black;
+    text-decoration: none;
+}
+
+p.khoj-banner {
+    font-size: small;
+    margin: 0;
+    padding: 10px;
+}
+
+p#khoj-banner {
+    display: inline;
+}
+
+@media only screen and (max-width: 600px) {
+    div.khoj-header {
+        display: grid;
+        grid-auto-flow: column;
+        gap: 20px;
+        padding: 16px 10px;
+        margin: 0 0 16px 0;
+    }
+
+    nav.khoj-nav {
+        grid-gap: 0px;
+        justify-content: space-between;
+    }
+}