style: updated text colours across app

This commit is contained in:
DecDuck
2024-11-19 11:11:59 +11:00
parent 6e6f09dba0
commit 7a88f4c52d
8 changed files with 20 additions and 20 deletions

View File

@ -6,7 +6,7 @@
<p class="text-sm font-medium text-zinc-100">
{{ notification.title }}
</p>
<p class="mt-1 text-sm text-zinc-600 line-clamp-3">
<p class="mt-1 text-sm text-zinc-400 line-clamp-3">
{{ notification.description }}
</p>
<div
@ -26,7 +26,7 @@
<button
@click="() => deleteMe()"
type="button"
class="inline-flex rounded-md text-zinc-400 hover:text-zinc-500 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
class="inline-flex rounded-md text-zinc-400 hover:text-zinc-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
>
<span class="sr-only">Close</span>
<XMarkIcon class="size-5" aria-hidden="true" />

View File

@ -9,7 +9,7 @@
speed, flexibility and beauty.</p>
<div class="flex space-x-6">
<a v-for="item in navigation.social" :key="item.name" :href="item.href" target="_blank"
class="text-zinc-500 hover:text-zinc-400">
class="text-zinc-400 hover:text-zinc-400">
<span class="sr-only">{{ item.name }}</span>
<component :is="item.icon" class="h-6 w-6" aria-hidden="true" />
</a>

View File

@ -69,7 +69,7 @@
<button
type="button"
class="-m-2.5 p-2.5 text-zinc-500 lg:hidden"
class="-m-2.5 p-2.5 text-zinc-400 lg:hidden"
@click="sidebarOpen = true"
>
<span class="sr-only">Open sidebar</span>

View File

@ -13,7 +13,7 @@
<NuxtLink
to="/account/notifications"
type="button"
class="text-sm text-zinc-500"
class="text-sm text-zinc-400"
>
View all &rarr;
</NuxtLink>
@ -29,7 +29,7 @@
</div>
<div
v-if="props.notifications.length == 0"
class="text-sm text-zinc-600 p-3 text-center w-full"
class="text-sm text-zinc-400 p-3 text-center w-full"
>
No notifications
</div>

View File

@ -7,7 +7,7 @@
Authentication
</h2>
<p
class="mt-2 text-pretty text-sm font-medium text-gray-500 sm:text-md/8"
class="mt-2 text-pretty text-sm font-medium text-zinc-400 sm:text-md/8"
>
Drop supports a variety of "authentication mechanisms". As you enable or
disable them, they are shown on the sign in screen for users to select
@ -21,10 +21,10 @@
<li
v-for="authMech in authenticationMechanisms"
:key="authMech.name"
class="overflow-hidden rounded-xl border border-zinc-800"
class="overflow-hidden rounded-xl border border-zinc-800 bg-zinc-900"
>
<div
class="flex items-center gap-x-4 border-b border-zinc-100/5 bg-zinc-900 p-6"
class="flex items-center gap-x-4 border-b border-zinc-800 p-6"
>
<component
:is="authMech.icon"

View File

@ -7,7 +7,7 @@
Simple authentication
</h2>
<p
class="mt-2 text-pretty text-sm font-medium text-gray-500 sm:text-md/8"
class="mt-2 text-pretty text-sm font-medium text-zinc-400 sm:text-md/8"
>
Simple authentication uses a system of 'invitations' to create users.
You can create an invitation, and optionally specify a username or email
@ -82,7 +82,7 @@
</li>
</ul>
<div class="py-4 text-zinc-600 text-sm" v-if="invitations.length == 0">
<div class="py-4 text-zinc-400 text-sm" v-if="invitations.length == 0">
No invitations.
</div>
</div>
@ -129,7 +129,7 @@
>Invite user to Drop</DialogTitle
>
<div class="mt-2">
<p class="text-sm text-zinc-500">
<p class="text-sm text-zinc-400">
Drop will generate a URL that you can send to the
person you want to invite. You can optionally specify
a username or email for them to use.
@ -161,7 +161,7 @@
autocomplete="username"
v-model="username"
placeholder="myUsername"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -188,7 +188,7 @@
autocomplete="email"
v-model="email"
placeholder="me@example.com"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>

View File

@ -16,7 +16,7 @@
<span v-if="currentlySelectedGame != -1" class="block truncate">{{
games.unimportedGames[currentlySelectedGame]
}}</span>
<span v-else class="block truncate text-zinc-600"
<span v-else class="block truncate text-zinc-400"
>Please select a directory...</span
>
<span

View File

@ -29,7 +29,7 @@
required
v-model="displayName"
placeholder="AwesomeDropGamer771"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -58,7 +58,7 @@
:disabled="!!invitation.data.value?.email"
v-model="email"
placeholder="me@example.com"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -89,7 +89,7 @@
:disabled="!!invitation.data.value?.username"
v-model="username"
placeholder="myUsername"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -118,7 +118,7 @@
autocomplete="password"
required
v-model="password"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -145,7 +145,7 @@
autocomplete="confirm-password"
required
v-model="confirmPassword"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-500 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-800 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-700 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
/>
</div>
</div>