Files
keystone/resources/js/components/AppearanceTabs.vue
Harry Bayliss 66f0ee9e50
All checks were successful
CI / Tests (push) Successful in 43s
CI / Lint (push) Successful in 1m3s
Migrate to Gitea, switch JS tooling to oxlint/oxfmt, lift test coverage to 95%
- Add .gitea/workflows/ci.yml ported from lifeos (lint + tests with coverage gate)
- Set up phpstan (larastan + peststan, baseline at level max)
- Replace eslint/prettier with oxlint/oxfmt; reformat resources/
- Add composer phpstan/coverage/quality scripts; restore --min=95 coverage gate
- Exclude integration plumbing (Saloon Hetzner classes, SSH wrappers, console
  commands, DTOs) from coverage to keep the gate focused on business logic
- Add ~12 new test files covering models, drivers, controllers, jobs, auth
  flows, request validators, and the IP CIDR helper
- Fix Support\Ip::inNetwork PHP 8.4 TypeError in CIDR mask check
- Fix FirewallRule::command comparing the enum-cast type column to a string
- Fix Server::network using the wrong foreign key column
- Remove unreachable code under abort(403) in RegisteredUserController
2026-05-13 16:51:07 +01:00

43 lines
1.3 KiB
Vue

<script setup lang="ts">
import { useAppearance } from "@/composables/useAppearance";
import { Monitor, Moon, Sun } from "lucide-vue-next";
interface Props {
class?: string;
}
const { class: containerClass = "" } = defineProps<Props>();
const { appearance, updateAppearance } = useAppearance();
const tabs = [
{ value: "light", Icon: Sun, label: "Light" },
{ value: "dark", Icon: Moon, label: "Dark" },
{ value: "system", Icon: Monitor, label: "System" },
] as const;
</script>
<template>
<div
:class="[
'inline-flex gap-1 rounded-lg bg-neutral-100 p-1 dark:bg-neutral-800',
containerClass,
]"
>
<button
v-for="{ value, Icon, label } in tabs"
:key="value"
@click="updateAppearance(value)"
:class="[
'flex items-center rounded-md px-3.5 py-1.5 transition-colors',
appearance === value
? 'bg-white shadow-sm dark:bg-neutral-700 dark:text-neutral-100'
: 'text-neutral-500 hover:bg-neutral-200/60 hover:text-black dark:text-neutral-400 dark:hover:bg-neutral-700/60',
]"
>
<component :is="Icon" class="-ml-1 h-4 w-4" />
<span class="ml-1.5 text-sm">{{ label }}</span>
</button>
</div>
</template>