Merge branch 'main' into feat/make-start-field-editable

Author: Hell1213

CONTRIBUTING.md

@@ -25,7 +25,6 @@ Scan through our [existing issues](https://github.com/its-me-abhishek/ccsync/iss
 1. Fork the repository.
 
 - Using GitHub Desktop:
-
   - [Getting started with GitHub Desktop](https://docs.github.com/en/desktop/installing-and-configuring-github-desktop/getting-started-with-github-desktop) will guide you through setting up Desktop.
   - Once Desktop is set up, you can use it to [fork the repo](https://docs.github.com/en/desktop/contributing-and-collaborating-using-github-desktop/cloning-and-forking-repositories-from-github-desktop)!
 

development/README.md

@@ -6,7 +6,6 @@ The `setup.sh` script starts all three services (backend, frontend, and sync ser
 
 > **Note:** The backend should ideally be run in a separate user environment (preferably root user) to avoid permission issues with Taskwarrior configuration files.
 
-
 > **Git Hooks:** Pre-commit hooks are automatically configured when you run `npm install` in the frontend directory. These hooks will format your code before each commit.
 
 ## Prerequisites

frontend/package-lock.json

@@ -91,6 +91,7 @@
     "dlv": "^1.1.3",
     "doctrine": "^3.0.0",
     "dom-accessibility-api": "^0.5.16",
+    "driver.js": "^1.3.1",
     "electron-to-chromium": "^1.4.796",
     "emittery": "^0.13.1",
     "emoji-regex": "^8.0.0",
@@ -276,6 +277,7 @@
     "queue-microtask": "^1.2.3",
     "react": "^18.2.0",
     "react-copy-to-clipboard": "^5.1.0",
+    "react-day-picker": "^8.10.1",
     "react-dom": "^18.2.0",
     "react-icons": "^5.2.1",
     "react-intersection-observer": "^9.13.0",

frontend/package.json

@@ -80,3 +80,79 @@
 ::-webkit-scrollbar-thumb:hover {
   background: #3bbcf0;
 }
+
+.driver-popover.ccsync-tour-popover {
+  background-color: hsl(var(--card));
+  color: hsl(var(--card-foreground));
+  border-radius: 0.75rem;
+  border: 1px solid hsl(var(--border));
+  /* box-shadow: 0 20px 45px rgba(15, 23, 42, 0.18); */
+  max-width: 320px;
+  padding: 1rem 1.25rem 1.1rem 1.25rem;
+}
+
+.driver-popover.ccsync-tour-popover .driver-popover-title {
+  font-size: 1rem;
+  font-weight: 600;
+}
+
+.driver-popover.ccsync-tour-popover .driver-popover-description {
+  color: hsl(var(--muted-foreground));
+  line-height: 1.55;
+  font-size: 0.92rem;
+}
+
+.driver-popover.ccsync-tour-popover .driver-popover-progress-text {
+  color: hsl(var(--muted-foreground));
+  font-size: 0.75rem;
+}
+
+.driver-popover.ccsync-tour-popover .driver-popover-navigation-btns {
+  gap: 0.5rem;
+}
+
+.driver-popover.ccsync-tour-popover .driver-popover-navigation-btns button {
+  border-radius: 9999px;
+  border: 1px solid transparent;
+  padding: 0.35rem 0.85rem;
+  font-weight: 500;
+  cursor: pointer;
+  text-shadow: none;
+}
+
+.driver-popover.ccsync-tour-popover
+  .driver-popover-navigation-btns
+  button.driver-popover-next-btn,
+.driver-popover.ccsync-tour-popover
+  .driver-popover-navigation-btns
+  button.driver-popover-done-btn {
+  background-color: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+}
+
+.driver-popover.ccsync-tour-popover
+  .driver-popover-navigation-btns
+  button.driver-popover-prev-btn {
+  background-color: hsl(var(--secondary));
+  color: hsl(var(--secondary-foreground));
+}
+
+.driver-popover.ccsync-tour-popover
+  .driver-popover-navigation-btns
+  button.driver-popover-prev-btn:hover {
+  background-color: hsl(var(--accent));
+}
+
+.driver-popover.ccsync-tour-popover .driver-skip-btn {
+  background-color: transparent;
+  color: hsl(var(--muted-foreground));
+  border: none;
+  padding: 0.35rem 0.6rem;
+  font-weight: 500;
+  cursor: pointer;
+  text-shadow: none;
+}
+
+.driver-popover.ccsync-tour-popover .driver-skip-btn:hover {
+  color: hsl(var(--foreground));
+}

frontend/src/App.css

@@ -0,0 +1,26 @@
+import { TableCell, TableRow } from '@/components/ui/table';
+
+export const Taskskeleton = ({ count }: { count: number }) => {
+  return (
+    <>
+      {Array.from({ length: count }).map((_, i) => (
+        <TableRow key={i} className="animate-pulse">
+          <TableCell className="py-3">
+            <div className="h-5 w-6 bg-[#252528] rounded-md"></div>
+          </TableCell>
+
+          <TableCell className="py-3">
+            <div className="flex items-center space-x-2">
+              <div className="h-4 w-4 bg-[#252528] rounded-full"></div>
+              <div className="h-5 w-16 md:w-48 bg-[#252528] rounded-xl"></div>
+              <div className="h-5 w-12 md:w-16 bg-[#252528] rounded-xl"></div>
+            </div>
+          </TableCell>
+          <TableCell className="py-3">
+            <div className="h-5 w-6 bg-[#252528] rounded-md"></div>
+          </TableCell>
+        </TableRow>
+      ))}
+    </>
+  );
+};