add light mode

This commit is contained in:
Gregor Vostrak
2025-03-28 14:00:19 +01:00
parent 7339b79e35
commit df2fe1da1e
124 changed files with 579 additions and 369 deletions

View File

@@ -47,7 +47,7 @@ const page = usePage<{
:alt="page.props.auth.user.name" />
<div class="ms-4 leading-tight">
<div class="text-white">
<div class="text-text-primary">
{{ page.props.auth.user.name }}
</div>
<div class="text-sm text-muted">

View File

@@ -89,7 +89,7 @@ async function exportData() {
</Card>
<Card>
<div
class="py-6 flex-col bg-card-background items-center flex space-y-5 text-center text-sm">
class="py-6 flex-col items-center flex space-y-5 text-center text-sm">
<div>
The following organization will be exported: <br />
<strong class="font-semibold">{{

View File

@@ -142,7 +142,7 @@ const showResultModal = ref(false);
<div
class="py-2.5 px-3 border-t border-t-card-background-separator">
<span class="text-white font-semibold">Clients created:</span>
<span class="text-text-primary font-semibold">Clients created:</span>
{{ reportResult?.report.clients.created }}
</div>
<div
@@ -187,14 +187,14 @@ const showResultModal = ref(false);
<Card>
<div
class="px-4 py-5 sm:px-5 bg-card-background shadow sm:rounded-tl-md sm:rounded-tr-md">
class="px-4 py-5 sm:px-5">
<div>
<InputLabel for="importType" value="Import Type" />
<select
id="importType"
v-model="importType"
name="importType"
class="mt-1 block w-full border-input-border bg-input-background text-white focus:border-input-border-active rounded-md shadow-sm">
class="mt-1 block w-full border-input-border bg-input-background text-text-primary focus:border-input-border-active rounded-md shadow-sm">
<option :value="null" selected disabled>
Select an import type to get instructions...
</option>
@@ -218,7 +218,7 @@ const showResultModal = ref(false);
</div>
<div
class="mt-2 flex justify-center rounded-lg border border-dashed border-white/30 px-6 py-10">
class="mt-2 flex justify-center rounded-lg border border-dashed border-border-primary px-6 py-10">
<div class="text-center">
<DocumentIcon
class="mx-auto h-8 w-8 text-muted"
@@ -227,7 +227,7 @@ const showResultModal = ref(false);
<div class="mt-4 flex text-sm leading-6 text-muted">
<label
for="file-upload"
class="relative cursor-pointer rounded-md bg-gray-900 font-semibold text-white focus-within:outline-none focus-within:ring-2 focus-within:ring-indigo-600 focus-within:ring-offset-2 focus-within:ring-offset-gray-900 hover:text-indigo-500">
class="relative cursor-pointer rounded-md font-semibold text-text-primary focus-within:outline-none focus-within:ring-2 focus-within:ring-indigo-600 focus-within:ring-offset-2 focus-within:ring-offset-gray-900 hover:text-indigo-500">
<span v-if="files">{{ filenames }}</span>
<span v-else
>Upload a Toggl/Clockify Export</span

View File

@@ -191,7 +191,7 @@ const displayableRole = (role: string) => {
<!-- Role Name -->
<div class="flex items-center">
<div
class="text-sm text-white"
class="text-sm text-text-primary"
:class="{
'font-semibold':
addTeamMemberForm.role ==

View File

@@ -51,7 +51,7 @@ const updateTeamName = () => {
:alt="team.owner.name" />
<div class="ms-4 leading-tight">
<div class="text-white">
<div class="text-text-primary">
{{ team.owner.name }}
</div>
<div class="text-muted text-sm">
@@ -93,7 +93,7 @@ const updateTeamName = () => {
v-model="form.currency"
name="currency"
:disabled="!permissions.canUpdateTeam"
class="mt-1 block w-full border-input-border bg-input-background text-white focus:border-input-border-active rounded-md shadow-sm">
class="mt-1 block w-full border-input-border bg-input-background text-text-primary focus:border-input-border-active rounded-md shadow-sm">
<option value="" disabled>Select a currency</option>
<option
v-for="(currencyTranslated, currencyKey) in $page.props