Begin switching from daisyui to shadcnui (#492)

* feat: add shadcn

* feat: add themes

* feat: make sidebar use shadcn

* feat: sort bg

* feat: lint fixes

* feat: make daisyui toggleable, add tooltips to sidebar, add work in progress docs page

* fix: theme switching for shadcn

* Fix minor profile.vue issue

* feat: update docs, enlarge SidebarMenuButton and refine profile layout

* feat: add testing page

* feat: update css and remove comments from template

* fix: create dropdown not opening due to tooltip interference also lint

* fix: correct CSS selector for homebox in main.css to ensure proper theming functionality

* feat: make theme switching actually kinda work for shadcn

* fix: sidebar colours

* fix: remove unused router import, made sidebar indicate active page and sort tailwind config linting

* style: update styles

* chore: remove unused duplicate code

* style: refine theme management, CSS variables, get styles closer to original

* feat: implement suggested changes

* feat: better button size

---------

Co-authored-by: Matt Kilgore <tankerkiller125@users.noreply.github.com>

docs/en/contribute/shadcn.md

@@ -0,0 +1,60 @@
+# Shadcn-Vue
+
+[Shadcn-Vue](https://www.shadcn-vue.com/) is a collection of Vue components based on [shadcn/ui](https://ui.shadcn.com/). We are currently in the process of migrating from DaisyUI to Shadcn-Vue for our component system.
+
+## What is shadcn-vue?
+
+To quote shadcn-vue:
+
+> This is NOT a component library. It's a collection of re-usable components that you can copy and paste or use the CLI to add to your apps.
+> What do you mean not a component library?
+> It means you do not install it as a dependency. It is not available or distributed via npm, with no plans to publish it.
+> Pick the components you need. Use the CLI to automatically add the components, or copy and paste the code into your project and customize to your needs. The code is yours.
+
+The key advantage of this approach is that we have full control over the components and can modify them to suit our specific needs without being constrained by a third-party dependency.
+
+## Adding Components
+
+1. Add components using the CLI:
+   ```bash
+   pnpx shadcn-vue@latest add [component-name]
+   ```
+   For example:
+   ```bash
+   pnpx shadcn-vue@latest add button
+   ```
+
+2. The components will be added to the route in the `components/ui` it then needs to be moved to `frontend/components/ui` for use.
+
+## Usage
+
+1. Import components from the components directory:
+   ```vue
+   import { Button } from '@/components/ui/button'
+   ```
+
+2. Components can be used with their respective props and slots as documented in the shadcn-vue documentation.
+
+## Modifying Components
+
+When modifying components, follow these best practices:
+
+1. If you need to modify a component for a specific use case:
+   - Copy the component and give it a name that reflects its purpose
+   - Keep the original shadcn component intact for other uses
+
+2. When making global changes:
+   - Modify the component in the `components/ui` directory
+   - Document any significant changes in comments
+
+## Testing without DaisyUI
+
+During the migration process, you can test without DaisyUI using these commands:
+
+```bash
+DISABLE_DAISYUI=true; task ui:dev
+```
+or
+```bash
+DISABLE_DAISYUI=true; task ui:fix
+```