chore: style fixes

This commit is contained in:
Muhsin Keloth
2024-04-25 16:17:27 +05:30
parent 8588dad949
commit d9bf6b499b
6 changed files with 13 additions and 13 deletions
@@ -14,7 +14,7 @@
type="submit"
size="large"
icon="text-copy"
variant="ghost"
variant="outline"
color-scheme="secondary"
@click="onClick"
>
@@ -16,7 +16,7 @@
v-model="item.model"
type="checkbox"
:value="item.value"
class="mb-0 mt-0.5 border-[1.5px] flex-shrink-0 shadow border-slate-200 dark:border-slate-600 appearance-none rounded-[4px] w-4 h-4 dark:bg-slate-800 focus:ring-1 focus:ring-slate-100 dark:focus:ring-slate-700 checked:bg-primary-600 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center checked:border-t checked:border-woot-700 dark:checked:border-woot-300 checked:border-b-0 checked:border-r-0 checked:border-l-0 after:text-center after:text-xs after:font-bold after:relative after:-top-[1.5px]"
class="mt-1 dark:border-slate-600 checked:bg-primary-600 dark:checked:bg-primary-600 shadow appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
@input="onChange"
/>
<label class="text-sm font-normal text-ash-900">
@@ -4,6 +4,7 @@
:class="{
'border border-solid border-primary-300 ': active,
}"
@click="$emit('click')"
>
<div class="flex flex-col gap-2 items-center w-full rounded-t-[5px]">
<div class="flex items-center justify-between w-full gap-1">
@@ -14,8 +15,7 @@
:checked="active"
type="radio"
name="hotkey"
class="shadow grid place-items-center border-2 border-ash-200 appearance-none rounded-full w-5 h-5 checked:bg-primary-600 before:content-[''] before:bg-primary-600 before:border-4 before:rounded-full before:border-ash-25 checked:before:w-[18px] checked:before:h-[18px] checked:border checked:border-primary-600"
@change="$emit('click')"
class="shadow cursor-pointer grid place-items-center border-2 border-ash-200 appearance-none rounded-full w-5 h-5 checked:bg-primary-600 before:content-[''] before:bg-primary-600 before:border-4 before:rounded-full before:border-ash-25 checked:before:w-[18px] checked:before:h-[18px] checked:border checked:border-primary-600"
/>
</div>
<span class="text-ash-900 text-sm line-clamp-2 leading-[1.4] text-start">
@@ -1,11 +1,11 @@
<template>
<div
class="flex items-center gap-2 py-2 px-0 text-sm tracking-[0.5] text-slate-700 dark:text-slate-50 text-left rtl:text-right"
class="flex items-start gap-2 px-0 text-sm tracking-[0.5] text-left rtl:text-right"
:class="`col-span-${span}`"
>
<input
v-model="localFlags"
class="m-0 border-[1.5px] checked:bg-primary-600 shadow border-slate-200 dark:border-slate-600 appearance-none rounded-[4px] w-4 h-4 dark:bg-slate-800 focus:ring-1 focus:ring-slate-100 dark:focus:ring-slate-700 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center checked:border-t checked:border-woot-700 dark:checked:border-woot-300 checked:border-b-0 checked:border-r-0 checked:border-l-0 after:text-center after:text-xs after:font-bold after:relative after:-top-[1.5px]"
class="mt-1 border-ash-400 checked:bg-primary-600 dark:checked:bg-primary-600 shadow appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
type="checkbox"
:value="localValue"
@input="handleInput"
@@ -30,7 +30,7 @@
class="grid content-center h-12 grid-cols-12 gap-4 py-0 rounded-t-xl"
>
<div
class="flex items-center gap-2 col-span-7 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
class="flex flex-row items-start gap-2 col-span-7 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
{{ $t(notification.label) }}
@@ -55,11 +55,11 @@
<span class="text-sm font-medium uppercase text-ash-900">
{{ $t('PROFILE_SETTINGS.FORM.EMAIL_NOTIFICATIONS_SECTION.TITLE') }}
</span>
<div class="flex flex-col gap-2">
<div class="flex flex-col gap-4">
<div
v-for="(notification, index) in notificationTypes"
:key="index"
class="flex flex-row items-center gap-2"
class="flex flex-row items-start gap-2"
>
<notification-check-box
type="email"
@@ -71,18 +71,18 @@
</div>
</div>
<div class="flex items-center justify-between gap-2">
<div class="flex items-center justify-start gap-2">
<span class="text-sm font-medium uppercase text-ash-900">
{{ $t('PROFILE_SETTINGS.FORM.PUSH_NOTIFICATIONS_SECTION.TITLE') }}
</span>
<form-switch :value="true" @input="onRequestPermissions()" />
</div>
<div class="flex flex-col gap-2">
<div class="flex flex-col gap-4">
<div
v-for="(notification, index) in notificationTypes"
:key="index"
class="flex flex-row items-center gap-2"
class="flex flex-row items-start gap-2"
>
<notification-check-box
type="push"
+1 -1
View File
@@ -56,7 +56,7 @@ export default {
}
span {
@apply bg-white dark:bg-slate-900;
@apply bg-white dark:bg-white;
--space-one-point-five: 0.9375rem;
border-radius: 100%;
box-shadow: var(--toggle-button-box-shadow);