Dark label (#1203)

* add dark mode for label

* fix dark issue in customer view page

* fix remaining label for dark mode

---------

Co-authored-by: yashkanakiya <yashkanakiya281297@gmail.com>
This commit is contained in:
Yogesh Gohil
2023-03-30 13:45:28 +05:30
committed by PayalDholakiya
parent 309f20f548
commit 9a34d48906
20 changed files with 78 additions and 59 deletions

View File

@ -7,6 +7,7 @@
py-2
rounded-lg
bg-opacity-40 bg-gray-300
dark:bg-gray-700 dark:border-gray-600
whitespace-nowrap
flex-col
mt-1
@ -19,6 +20,7 @@
text-sm
font-medium
text-black
dark:text-white
truncate
select-all select-color
"

View File

@ -91,6 +91,7 @@
leading-tight
text-gray-700
cursor-pointer
dark:text-gray-400
"
>
{{ note.name }}

View File

@ -5,7 +5,7 @@
>
<SelectNotePopup :type="type" @select="onSelectNote" />
</div>
<label class="text-gray-800 font-medium mb-4 text-sm">
<label class="text-gray-800 font-medium mb-4 text-sm dark:text-gray-300">
{{ $t('invoices.notes') }}
</label>
<BaseCustomInput

View File

@ -29,7 +29,16 @@
<label
v-else
class="flex items-center justify-center m-0 text-lg text-black uppercase "
class="
flex
items-center
justify-center
m-0
text-lg
text-black
dark:text-white
uppercase
"
>
<BaseFormatMoney
:amount="store.getSubTotal"
@ -59,7 +68,16 @@
<label
v-else-if="store[storeProp].tax_per_item === 'YES'"
class="flex items-center justify-center m-0 text-lg text-black uppercase "
class="
flex
items-center
justify-center
m-0
text-lg
text-black
dark:text-white
uppercase
"
>
<BaseFormatMoney :amount="tax.amount" :currency="defaultCurrency" />
</label>
@ -166,7 +184,15 @@
</div>
<div
class="flex items-center justify-between w-full pt-2 mt-5 border-t border-gray-200 border-solid "
class="
flex
items-center
justify-between
w-full
pt-2
mt-5
border-t border-gray-200 border-solid
"
>
<BaseContentPlaceholders v-if="isLoading">
<BaseContentPlaceholdersText :lines="1" class="w-16 h-5" />

View File

@ -1,9 +1,18 @@
<template>
<div class="flex items-center justify-between w-full mt-2 text-sm">
<label class="font-semibold leading-5 text-gray-500 uppercase">
<label class="font-semibold leading-5 text-gray-500 uppercase dark:text-gray-300">
{{ tax.name }} ({{ tax.percent }} %)
</label>
<label class="flex items-center justify-center text-lg text-black">
<label
class="
flex
items-center
justify-center
text-lg
text-black
dark:text-white
"
>
<BaseFormatMoney :amount="tax.amount" :currency="currency" />
<BaseIcon

View File

@ -96,6 +96,7 @@
leading-tight
text-gray-700
cursor-pointer
dark:text-gray-300
"
>
{{ taxType.name }}
@ -108,6 +109,7 @@
font-semibold
text-gray-700
cursor-pointer
dark:text-gray-300
"
>
{{ taxType.percent }} %

View File

@ -1,6 +1,6 @@
<template>
<div>
<label class="flex text-gray-800 font-medium text-sm mb-2">
<label class="flex text-gray-800 font-medium text-sm mb-2 dark:text-gray-300">
{{ $t('general.select_template') }}
<span class="text-sm text-red-500"> *</span>
</label>

View File

@ -122,7 +122,7 @@
<BaseTab :title="$t('customers.portal_access')">
<BaseInputGrid class="col-span-5 lg:col-span-4">
<div class="md:col-span-2">
<p class="text-sm text-gray-500">
<p class="text-sm text-gray-500 dark:text-gray-300">
{{ $t('customers.portal_access_text') }}
</p>

View File

@ -171,7 +171,7 @@
<BaseInputGrid class="col-span-5 lg:col-span-4">
<div class="md:col-span-2">
<p class="text-sm text-gray-500">
<p class="text-sm text-gray-500 dark:text-gray-300">
{{ $t('customers.portal_access_text') }}
</p>

View File

@ -1,5 +1,5 @@
<template>
<div class="pt-6 mt-5 border-t border-solid lg:pt-8 md:pt-4 border-gray-200">
<div class="pt-6 mt-5 border-t border-solid lg:pt-8 md:pt-4 border-gray-200 dark:border-gray-600">
<!-- Basic Info -->
<BaseHeading>
{{ $t('customers.basic_info') }}

View File

@ -53,7 +53,7 @@
</div>
</div>
<div v-else class="mt-24">
<label class="flex items-center justify-center text-gray-500">
<label class="flex items-center justify-center text-gray-500 dark:text-gray-300">
{{ $t('modules.no_modules_installed') }}
</label>
</div>
@ -61,10 +61,10 @@
</div>
<BaseCard v-else class="mt-6">
<h6 class="text-gray-900 text-lg font-medium">
<h6 class="text-gray-900 text-lg font-medium dark:text-white">
{{ $t('modules.connect_installation') }}
</h6>
<p class="mt-1 text-sm text-gray-500">
<p class="mt-1 text-sm text-gray-500 dark:text-gray-400">
{{
$t('modules.api_token_description', {
url: globalStore.config.base_url.replace(/^http:\/\//, ''),

View File

@ -215,7 +215,7 @@
<SelectNotePopup type="Payment" @select="onSelectNote" />
</div>
<label class="mb-4 text-sm font-medium text-gray-800">
<label class="mb-4 text-sm font-medium text-gray-800 dark:text-gray-300">
{{ $t('estimates.notes') }}
</label>

View File

@ -16,11 +16,11 @@
</div>
<div class="ml-2">
<p class="p-0 mb-1 leading-snug text-left text-black">
<p class="p-0 mb-1 leading-snug text-left text-black dark:text-white">
{{ $t('recurring_invoices.send_automatically') }}
</p>
<p
class="p-0 m-0 text-xs leading-tight text-left text-gray-500"
class="p-0 m-0 text-xs leading-tight text-left text-gray-500 dark:text-gray-400"
style="max-width: 480px"
>
{{ $t('recurring_invoices.send_automatically_desc') }}

View File

@ -27,7 +27,7 @@
>
<template #cell-name="{ row }">
{{ row.data.name }}
<span class="text-xs text-gray-500"> ({{ row.data.slug }})</span>
<span class="text-xs text-gray-500 dark:text-gray-400"> ({{ row.data.slug }})</span>
</template>
<template #cell-is_required="{ row }">

View File

@ -4,23 +4,14 @@
:description="$t('settings.update_app.description')"
>
<div class="pb-8 ml-0">
<label class="text-sm not-italic font-medium input-label">
<label
class="text-sm not-italic font-medium input-label dark:text-gray-300"
>
{{ $t('settings.update_app.current_version') }}
</label>
<div
class="
box-border
flex
w-16
p-3
my-2
text-sm text-gray-600
bg-gray-200
border border-gray-200 border-solid
rounded-md
version
"
class="box-border flex w-16 p-3 my-2 text-sm text-gray-600 bg-gray-200 border border-gray-200 border-solid dark:bg-gray-600 dark:text-gray-200 dark:border-gray-500 rounded-md version"
>
{{ currentVersion }}
</div>
@ -42,20 +33,20 @@
{{ $t('settings.update_app.avail_update') }}
</BaseHeading>
<div class="rounded-md bg-primary-50 p-4 mb-3">
<div class="rounded-md bg-primary-50 p-4 mb-3 dark:bg-gray-600">
<div class="flex">
<div class="shrink-0">
<BaseIcon
name="InformationCircleIcon"
class="h-5 w-5 text-primary-400"
class="h-5 w-5 text-primary-400 dark:text-primary-300"
aria-hidden="true"
/>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-primary-800">
<h3 class="text-sm font-medium text-primary-800 dark:text-primary-300">
{{ $t('general.note') }}
</h3>
<div class="mt-2 text-sm text-primary-700">
<div class="mt-2 text-sm text-primary-700 dark:text-primary-400">
<p>
{{ $t('settings.update_app.update_warning') }}
</p>
@ -75,26 +66,20 @@
w-16
p-3
my-2
text-sm text-gray-600
bg-gray-200
text-sm
text-gray-600 bg-gray-200
border border-gray-200 border-solid
rounded-md
version
dark:bg-gray-600 dark:text-gray-200
dark:border-gray-500
"
>
{{ updateData.version }}
</div>
<div
class="
pl-5
mt-4
mb-8
text-sm
leading-snug
text-gray-500
update-description
"
class="pl-5 mt-4 mb-8 text-sm leading-snug text-gray-500 update-description"
style="white-space: pre-wrap; max-width: 480px"
v-html="description"
></div>
@ -150,14 +135,7 @@
<li
v-for="step in updateSteps"
:key="step.stepUrl"
class="
flex
justify-between
w-full
py-3
border-b border-gray-200 border-solid
last:border-b-0
"
class="flex justify-between w-full py-3 border-b border-gray-200 border-solid last:border-b-0"
>
<p class="m-0 text-sm leading-8">{{ $t(step.translationKey) }}</p>
<div class="flex flex-row items-center">

View File

@ -439,7 +439,7 @@ export default {
container:
'p-0 relative mx-auto w-full flex items-center justify-end box-border cursor-pointer border border-gray-200 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-sm leading-snug outline-none max-h-10',
containerDisabled:
'bg-gray-200 bg-opacity-50 !text-gray-400 dark:!text-gray-800 !dark:text-gray-500 !cursor-default dark:opacity-25',
'bg-gray-200 !text-gray-800 dark:!text-gray-800 !dark:text-gray-500 !cursor-not-allowed dark:opacity-50',
containerOpen: '',
containerOpenTop: '',
containerActive: 'ring-1 ring-primary-400 border-primary-400',

View File

@ -1,3 +1,3 @@
<template>
<hr class="w-full text-gray-300 dark:bg-gray-600" />
<div class="w-full h-px bg-gray-300 dark:bg-gray-600" />
</template>

View File

@ -15,6 +15,7 @@
text-gray-800
whitespace-nowrap
justify-between
dark:text-gray-300
"
>
<div>
@ -31,7 +32,7 @@
</label>
<div :class="inputContainerClasses">
<slot></slot>
<span v-if="helpText" class="text-gray-500 text-xs mt-1 font-light">
<span v-if="helpText" class="text-gray-500 text-xs mt-1 font-light dark:text-gray-400">
{{ helpText }}
</span>
<span v-if="error" class="block mt-0.5 text-sm text-red-500">

View File

@ -1,5 +1,5 @@
<template>
<label class="text-sm not-italic font-medium leading-5 text-primary-800">
<label class="text-sm not-italic font-medium leading-5 text-gray-500 dark:text-gray-300">
<slot />
</label>
</template>

View File

@ -19,7 +19,7 @@
]"
aria-hidden="true"
>
<span class="rounded-full bg-white w-1.5 h-1.5" :class="{ 'bg-white': checked }"/>
<span class="rounded-full w-1.5 h-1.5" :class="{ 'bg-white': checked }"/>
</span>
<div class="flex flex-col ml-3">
<RadioGroupLabel