feat: dark mode

This commit is contained in:
Jannat Patel
2025-02-10 10:51:21 +05:30
parent 16b9356944
commit dbf443300b
143 changed files with 886 additions and 675 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div v-if="user.data?.is_moderator || isStudent" class="">
<header
class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
<div class="flex items-center space-x-2">
@@ -26,13 +26,13 @@
<Tabs
v-model="tabIndex"
:tabs="tabs"
tablistClass="overflow-y-hidden bg-white"
tablistClass="overflow-y-hidden bg-surface-white"
>
<template #tab="{ tab, selected }" class="overflow-x-hidden">
<div>
<button
class="group -mb-px flex items-center gap-1 border-b border-transparent py-2.5 text-base text-gray-600 duration-300 ease-in-out hover:border-gray-400 hover:text-gray-900"
:class="{ 'text-gray-900': selected }"
class="group -mb-px flex items-center gap-1 border-b border-transparent py-2.5 text-base text-ink-gray-5 duration-300 ease-in-out hover:border-outline-gray-3 hover:text-ink-gray-9"
:class="{ 'text-ink-gray-9': selected }"
>
<component
v-if="tab.icon"
@@ -43,7 +43,7 @@
<Badge
v-if="tab.count"
:class="{
'text-gray-900 border border-gray-900': selected,
'text-ink-gray-9 border border-gray-900': selected,
}"
variant="subtle"
theme="gray"
@@ -92,10 +92,13 @@
</Tabs>
</div>
<div class="p-5">
<div class="text-gray-700 font-semibold mb-4">
<div class="text-ink-gray-7 font-semibold mb-4">
{{ __('About this batch') }}:
</div>
<div v-html="batch.data.description" class="leading-5 mb-4"></div>
<div
v-html="batch.data.description"
class="leading-5 mb-4 text-ink-gray-7"
></div>
<div class="flex items-center avatar-group overlap mb-5">
<div
@@ -116,15 +119,18 @@
:endDate="batch.data.end_date"
class="mb-3"
/>
<div class="flex items-center mb-4">
<Clock class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
<div class="flex items-center mb-4 text-ink-gray-7">
<Clock class="h-4 w-4 stroke-1.5 mr-2" />
<span>
{{ formatTime(batch.data.start_time) }} -
{{ formatTime(batch.data.end_time) }}
</span>
</div>
<div v-if="batch.data.timezone" class="flex items-center mb-4">
<Globe class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
<div
v-if="batch.data.timezone"
class="flex items-center mb-4 text-ink-gray-7"
>
<Globe class="h-4 w-4 stroke-1.5 mr-2" />
<span>
{{ batch.data.timezone }}
</span>
@@ -141,7 +147,7 @@
<div class="text-base border rounded-md w-1/3 mx-auto my-32">
<div class="border-b px-5 py-3 font-medium">
<span
class="inline-flex items-center before:bg-red-600 before:w-2 before:h-2 before:rounded-md before:mr-2"
class="inline-flex items-center before:bg-surface-red-5 before:w-2 before:h-2 before:rounded-md before:mr-2"
></span>
{{ __('Not Permitted') }}
</div>