Skip to content

Commit

Permalink
Maintenance: Reactivate Prettier plugin for TailwindCSS.
Browse files Browse the repository at this point in the history
  • Loading branch information
@dvuckovic
dvuckovic committed Apr 10, 2024
1 parent b8fd2ad commit 3e8ef18
Show file tree
Hide file tree
Showing 111 changed files with 233 additions and 232 deletions.
3 changes: 2 additions & 1 deletion .prettierrc.json
View file
Expand Up @@ -2,5 +2,6 @@
"semi": false,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "all"
"trailingComma": "all",
"plugins": ["prettier-plugin-tailwindcss"]
}
2 changes: 1 addition & 1 deletion app/frontend/apps/desktop/components/CollapseButton/CollapseButton.vue
View file
Expand Up @@ -55,7 +55,7 @@ const parentGroupClass = computed(() => {
<div>
<CommonButton
:class="[
{ 'transition-opacity opacity-0': !isTouchDevice && parentGroupClass },
{ 'opacity-0 transition-opacity': !isTouchDevice && parentGroupClass },
'focus:opacity-100',
parentGroupClass,
]"
Expand Down
2 changes: 1 addition & 1 deletion app/frontend/apps/desktop/components/CommonBreadcrumb/CommonBreadcrumb.vue
View file
Expand Up @@ -38,7 +38,7 @@ const locale = useLocaleStore()
locale.localeData?.dir === 'rtl' ? 'chevron-left' : 'chevron-right'
"
size="xs"
class="inline-flex mx-1"
class="mx-1 inline-flex"
/>
</li>
</ul>
Expand Down
2 changes: 1 addition & 1 deletion app/frontend/apps/desktop/components/CommonButton/CommonButton.vue
View file
Expand Up @@ -151,7 +151,7 @@ const iconSizeClass = computed(() => {

<template>
<button
class="btn h-min min-h-min border-0 shadow-none font-normal flex-nowrap gap-x-2.5 hover:outline hover:outline-1 hover:outline-offset-1 hover:outline-blue-600 dark:hover:outline-blue-900 focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800"
class="btn h-min min-h-min flex-nowrap gap-x-2.5 border-0 font-normal shadow-none hover:outline hover:outline-1 hover:outline-offset-1 hover:outline-blue-600 focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800 dark:hover:outline-blue-900"
:class="[
...variantClasses,
...sizeClasses,
Expand Down
6 changes: 3 additions & 3 deletions app/frontend/apps/desktop/components/CommonDivider/CommonDivider.vue
View file
Expand Up @@ -23,10 +23,10 @@ const props = withDefaults(defineProps<Props>(), {
}"
>
<hr
class="bg-neutral-100 dark:bg-gray-900 border-0"
class="border-0 bg-neutral-100 dark:bg-gray-900"
:class="{
'w-full h-px': props.orientation === 'horizontal',
'w-px h-full': props.orientation === 'vertical',
'h-px w-full': props.orientation === 'horizontal',
'h-full w-px': props.orientation === 'vertical',
}"
/>
</div>
Expand Down
10 changes: 5 additions & 5 deletions app/frontend/apps/desktop/components/CommonInputSearch/CommonInputSearch.vue
View file
Expand Up @@ -68,7 +68,7 @@ export default {

<template>
<div
class="grow inline-flex justify-start items-center gap-1"
class="inline-flex grow items-center justify-start gap-1"
:class="wrapperClass"
>
<CommonIcon
Expand All @@ -77,14 +77,14 @@ export default {
name="search"
decorative
/>
<div class="relative grow inline-flex overflow-clip">
<div class="relative inline-flex grow overflow-clip">
<div class="grow">
<input
ref="filterInput"
v-model="filter"
v-bind="$attrs"
:placeholder="i18n.t(placeholder)"
class="w-full min-w-16 text-black dark:text-white outline-none"
class="w-full min-w-16 text-black outline-none dark:text-white"
:class="{
'bg-blue-200 dark:bg-gray-700': !alternativeBackground,
'bg-white dark:bg-gray-500': alternativeBackground,
Expand All @@ -98,7 +98,7 @@ export default {
</div>
<div
v-if="suggestionVisiblePart?.length"
class="absolute top-0 flex whitespace-pre pointer-events-none"
class="pointer-events-none absolute top-0 flex whitespace-pre"
data-test-id="suggestion"
>
<span class="invisible">{{ filter }}</span>
Expand All @@ -110,7 +110,7 @@ export default {
<div class="flex shrink-0 items-center gap-1">
<slot name="controls" />
<CommonIcon
class="fill-stone-200 dark:fill-neutral-500 hover:fill-black dark:hover:fill-white focus-visible:outline focus-visible:rounded-sm focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800"
class="fill-stone-200 hover:fill-black focus-visible:rounded-sm focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800 dark:fill-neutral-500 dark:hover:fill-white"
:class="{
invisible: !filter?.length,
}"
Expand Down
2 changes: 1 addition & 1 deletion app/frontend/apps/desktop/components/CommonLoader/CommonLoader.vue
View file
Expand Up @@ -23,7 +23,7 @@ export default {
<div
v-if="loading"
v-bind="$attrs"
class="flex justify-center items-center"
class="flex items-center justify-center"
role="status"
>
<CommonIcon
Expand Down
4 changes: 2 additions & 2 deletions app/frontend/apps/desktop/components/CommonPopover/CommonPopover.vue
View file
Expand Up @@ -291,14 +291,14 @@ const duration = VITE_TEST_MODE ? undefined : { enter: 300, leave: 200 }
:id="id"
ref="popoverElement"
role="region"
class="popover fixed z-50 min-h-9 flex antialiased rounded-xl border border-neutral-100 dark:border-gray-900 bg-white dark:bg-gray-500"
class="popover fixed z-50 flex min-h-9 rounded-xl border border-neutral-100 bg-white antialiased dark:border-gray-900 dark:bg-gray-500"
:style="popoverStyle"
:aria-labelledby="owner?.id"
>
<div class="overflow-y-auto"><slot /></div>
<div
v-if="!hideArrow"
class="absolute -z-10 w-[22px] h-[22px] -rotate-45 bg-white dark:bg-gray-500 transform border border-neutral-100 dark:border-gray-900"
class="absolute -z-10 h-[22px] w-[22px] -rotate-45 transform border border-neutral-100 bg-white dark:border-gray-900 dark:bg-gray-500"
:class="arrowPlacementClasses"
/>
</div>
Expand Down
6 changes: 3 additions & 3 deletions app/frontend/apps/desktop/components/CommonPopover/CommonPopoverMenu.vue
View file
Expand Up @@ -54,7 +54,7 @@ const onClickItem = (event: MouseEvent, item: MenuItem) => {
</script>

<template>
<section class="flex flex-col gap-0.5 min-w-58">
<section class="min-w-58 flex flex-col gap-0.5">
<div v-if="showHeaderLabel" role="heading" class="p-2 leading-3">
<slot name="header"
><CommonLabel
Expand All @@ -71,7 +71,7 @@ const onClickItem = (event: MouseEvent, item: MenuItem) => {
<template v-for="item in availableItems" :key="item.key">
<li
role="menuitem"
class="group flex items-center justify-between hover:bg-blue-600 dark:hover:bg-blue-900 last:rounded-b-[10px] focus-within:bg-blue-800 dark:hover:focus-within:bg-blue-800 hover:focus-within:bg-blue-800 focus-within:text-white"
class="group flex items-center justify-between last:rounded-b-[10px] focus-within:bg-blue-800 focus-within:text-white hover:bg-blue-600 hover:focus-within:bg-blue-800 dark:hover:bg-blue-900 dark:hover:focus-within:bg-blue-800"
:class="{
'first:rounded-t-[10px]': !showHeaderLabel,
'border-t border-neutral-100 dark:border-gray-900':
Expand All @@ -81,7 +81,7 @@ const onClickItem = (event: MouseEvent, item: MenuItem) => {
<slot :name="`item-${item.key}`" v-bind="item">
<component
:is="item.component || CommonPopoverMenuItem"
class="grow flex p-2.5"
class="flex grow p-2.5"
:label="item.label"
:link="item.link"
:icon="item.icon"
Expand Down
4 changes: 2 additions & 2 deletions app/frontend/apps/desktop/components/CommonPopover/CommonPopoverMenuItem.vue
View file
Expand Up @@ -17,11 +17,11 @@ defineProps<Props>()
:is="link ? 'CommonLink' : 'button'"
:link="link"
:external="link && linkExternal"
class="block leading-4 hover:no-underline cursor-pointer focus-visible:!outline-none"
class="block cursor-pointer leading-4 hover:no-underline focus-visible:!outline-none"
data-test-id="popover-menu-item"
>
<CommonLabel
class="gap-2 group-hover:text-black dark:group-hover:text-white group-focus-within:text-white group-hover:group-focus-within:text-white"
class="gap-2 group-focus-within:text-white group-hover:text-black group-hover:group-focus-within:text-white dark:group-hover:text-white"
:prefix-icon="icon"
icon-color="text-stone-200 dark:text-neutral-500 group-hover:text-black dark:group-hover:text-white group-focus-within:text-white group-hover:group-focus-within:text-white"
>
Expand Down
6 changes: 3 additions & 3 deletions app/frontend/apps/desktop/components/CommonProgressBar/CommonProgressBar.vue
View file
Expand Up @@ -15,18 +15,18 @@ const props = defineProps<Props>()

<style scoped>
.progress {
@apply rounded-box bg-blue-200 dark:bg-gray-700 h-2;
@apply rounded-box h-2 bg-blue-200 dark:bg-gray-700;
&::-moz-progress-bar {
@apply bg-blue-800 rounded-none;
@apply rounded-none bg-blue-800;
}
&::-webkit-progress-bar {
@apply rounded-box;
}
&::-webkit-progress-value {
@apply bg-blue-800 rounded-none;
@apply rounded-none bg-blue-800;
transition: width 1s;
}
Expand Down
4 changes: 2 additions & 2 deletions app/frontend/apps/desktop/components/CommonPublicLinks/CommonPublicLinks.vue
View file
Expand Up @@ -14,14 +14,14 @@ const { links } = usePublicLinks(props.screen)
<template>
<nav
v-if="links.length"
class="py-3 justify-center items-center gap-x-2 flex-wrap inline-flex"
class="inline-flex flex-wrap items-center justify-center gap-x-2 py-3"
>
<template v-for="link in links" :key="link.id">
<CommonLink
:link="link.link"
:title="link.description"
:open-in-new-tab="link.newTab"
class="text-blue-800 text-sm after:ml-2 after:font-medium after:text-neutral-500 after:content-['|'] last:after:content-none"
class="text-sm text-blue-800 after:ml-2 after:font-medium after:text-neutral-500 after:content-['|'] last:after:content-none"
>
{{ $t(link.title) }}
</CommonLink>
Expand Down
8 changes: 4 additions & 4 deletions app/frontend/apps/desktop/components/CommonSelect/CommonSelect.vue
View file
Expand Up @@ -303,7 +303,7 @@ const duration = VITE_TEST_MODE ? undefined : { enter: 300, leave: 200 }
v-if="showDropdown"
id="common-select"
ref="dropdownElement"
class="fixed z-10 min-h-9 flex antialiased"
class="fixed z-10 flex min-h-9 antialiased"
:style="dropdownStyle"
>
<div
Expand All @@ -315,18 +315,18 @@ const duration = VITE_TEST_MODE ? undefined : { enter: 300, leave: 200 }
}"
>
<div
class="h-full flex flex-col items-start bg-white dark:bg-gray-500 border-x border-neutral-100 dark:border-gray-900"
class="flex h-full flex-col items-start border-x border-neutral-100 bg-white dark:border-gray-900 dark:bg-gray-500"
:class="{
'rounded-t-lg border-t': hasDirectionUp,
'rounded-b-lg border-b': !hasDirectionUp,
}"
>
<div
v-if="multiple && hasMoreSelectableOptions"
class="w-full px-2.5 py-1.5 flex justify-between gap-2"
class="flex w-full justify-between gap-2 px-2.5 py-1.5"
>
<CommonLabel
class="ms-auto text-blue-800 dark:text-blue-800 focus-visible:outline focus-visible:rounded-sm focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800"
class="ms-auto text-blue-800 focus-visible:rounded-sm focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-1 focus-visible:outline-blue-800 dark:text-blue-800"
prefix-icon="check-all"
role="button"
tabindex="1"
Expand Down
8 changes: 4 additions & 4 deletions app/frontend/apps/desktop/components/CommonSelect/CommonSelectItem.vue
View file
Expand Up @@ -48,7 +48,7 @@ const label = computed(() => {
:tabindex="option.disabled ? '-1' : '0'"
:aria-selected="selected"
:aria-disabled="option.disabled ? 'true' : undefined"
class="group h-9 px-2.5 flex cursor-pointer items-center self-stretch gap-1.5 text-sm text-black dark:text-white outline-none hover:bg-blue-600 dark:hover:bg-blue-900 focus:bg-blue-800 hover:focus:focus:bg-blue-800 focus:text-white"
class="group flex h-9 cursor-pointer items-center gap-1.5 self-stretch px-2.5 text-sm text-black outline-none hover:bg-blue-600 focus:bg-blue-800 focus:text-white hover:focus:focus:bg-blue-800 dark:text-white dark:hover:bg-blue-900"
role="option"
:data-value="option.value"
@click="select(option)"
Expand All @@ -58,7 +58,7 @@ const label = computed(() => {
<CommonIcon
v-if="multiple"
:class="{
'fill-gray-100 dark:fill-neutral-400 group-hover:fill-black dark:group-hover:fill-white group-focus:fill-white':
'fill-gray-100 group-hover:fill-black group-focus:fill-white dark:fill-neutral-400 dark:group-hover:fill-white':
!option.disabled,
'fill-stone-200 dark:fill-neutral-500': option.disabled,
}"
Expand All @@ -75,7 +75,7 @@ const label = computed(() => {
'fill-stone-200 dark:fill-neutral-500': option.disabled,
}"
decorative
class="shrink-0 fill-gray-100 dark:fill-neutral-400 group-hover:fill-black dark:group-hover:fill-white group-focus:fill-white"
class="shrink-0 fill-gray-100 group-hover:fill-black group-focus:fill-white dark:fill-neutral-400 dark:group-hover:fill-white"
/>
<span
v-if="filter"
Expand All @@ -98,7 +98,7 @@ const label = computed(() => {
</span>
<CommonIcon
v-if="!multiple"
class="shrink-0 fill-stone-200 dark:fill-neutral-500 group-hover:fill-black dark:group-hover:fill-white group-focus:fill-white"
class="shrink-0 fill-stone-200 group-hover:fill-black group-focus:fill-white dark:fill-neutral-500 dark:group-hover:fill-white"
:class="{
invisible: !selected,
'fill-gray-100 dark:fill-neutral-400': option.disabled,
Expand Down
4 changes: 2 additions & 2 deletions .../apps/desktop/components/Form/fields/FieldGroupPermissions/FieldGroupPermissionsInput.vue
View file
Expand Up @@ -202,7 +202,7 @@ const ensureGranularOrFullAccess = (
<template>
<output
:id="context.id"
class="w-full flex flex-col p-2 space-y-2 rounded-lg focus:outline focus:outline-1 focus:outline-offset-1 focus:outline-blue-800 hover:focus:outline-blue-800"
class="flex w-full flex-col space-y-2 rounded-lg p-2 focus:outline focus:outline-1 focus:outline-offset-1 focus:outline-blue-800 hover:focus:outline-blue-800"
:class="context.classes.input"
:name="context.node.name"
role="list"
Expand All @@ -214,7 +214,7 @@ const ensureGranularOrFullAccess = (
<div
v-for="(groupPermission, index) in groupPermissions"
:key="groupPermission.key"
class="w-full flex items-center gap-3"
class="flex w-full items-center gap-3"
role="listitem"
>
<FormKit
Expand Down
8 changes: 4 additions & 4 deletions app/frontend/apps/desktop/components/Form/fields/FieldImageUpload/FieldImageUploadInput.vue
View file
Expand Up @@ -90,12 +90,12 @@ const { isOverDropZone } = useDropZone(dropZoneRef, {
<template>
<div
ref="dropZoneRef"
class="w-full flex flex-col items-center gap-2 p-2"
class="flex w-full flex-col items-center gap-2 p-2"
:class="context.classes.input"
>
<div
v-if="isOverDropZone"
class="w-full rounded outline-dashed outline-1 outline-blue-800 text-center"
class="w-full rounded text-center outline-dashed outline-1 outline-blue-800"
>
<CommonLabel
class="py-2 text-blue-800 dark:text-blue-800"
Expand All @@ -107,10 +107,10 @@ const { isOverDropZone } = useDropZone(dropZoneRef, {
<template v-else>
<template v-if="imageUploadOrPlaceholder">
<div
class="w-full p-2.5 grid grid-cols-[20px_auto_20px] gap-2.5 justify-items-center items-center"
class="grid w-full grid-cols-[20px_auto_20px] items-center justify-items-center gap-2.5 p-2.5"
>
<img
class="max-h-32 col-start-2"
class="col-start-2 max-h-32"
:src="imageUploadOrPlaceholder"
:alt="$t('Image preview')"
/>
Expand Down
6 changes: 3 additions & 3 deletions app/frontend/apps/desktop/components/Form/fields/FieldRadioList/FieldRadioListInput.vue
View file
Expand Up @@ -37,7 +37,7 @@ const selectOption = (option: RadioListOption, event?: Event) => {
<template>
<output
:id="context.id"
class="flex flex-col items-start bg-blue-200 dark:bg-gray-700 rounded-lg focus:outline focus:outline-1 focus:outline-offset-1 focus:outline-blue-800 hover:focus:outline-blue-800"
class="flex flex-col items-start rounded-lg bg-blue-200 focus:outline focus:outline-1 focus:outline-offset-1 focus:outline-blue-800 hover:focus:outline-blue-800 dark:bg-gray-700"
role="list"
:class="context.classes.input"
:name="context.node.name"
Expand All @@ -49,7 +49,7 @@ const selectOption = (option: RadioListOption, event?: Event) => {
<div
v-for="option in context.options"
:key="`option-${option.value}`"
class="cursor-pointer group inline-flex gap-2.5 px-3 py-2.5"
class="group inline-flex cursor-pointer gap-2.5 px-3 py-2.5"
role="option"
:aria-disabled="context.disabled"
:aria-checked="option.value == localValue"
Expand All @@ -59,7 +59,7 @@ const selectOption = (option: RadioListOption, event?: Event) => {
<CommonIcon
:id="`radio_list_radio_${context.id}_${option.value}`"
size="small"
class="shrink-0 self-start rounded-full group-hover:outline group-hover:outline-1 group-hover:-outline-offset-1 group-hover:outline-blue-600 dark:group-hover:outline-blue-900 focus:outline focus:outline-1 focus:-outline-offset-1 focus:outline-blue-800 group-hover:focus:outline-blue-800 dark:group-hover:focus:outline-blue-800 formkit-disabled:pointer-events-none formkit-invalid:outline-red-500 dark:hover:formkit-invalid:outline-red-500 formkit-errors:outline formkit-errors:outline-1 formkit-errors:-outline-offset-1 formkit-errors:outline-red-500 dark:hover:formkit-errors:outline-red-500"
class="formkit-disabled:pointer-events-none formkit-invalid:outline-red-500 dark:hover:formkit-invalid:outline-red-500 formkit-errors:outline formkit-errors:outline-1 formkit-errors:-outline-offset-1 formkit-errors:outline-red-500 dark:hover:formkit-errors:outline-red-500 shrink-0 self-start rounded-full focus:outline focus:outline-1 focus:-outline-offset-1 focus:outline-blue-800 group-hover:outline group-hover:outline-1 group-hover:-outline-offset-1 group-hover:outline-blue-600 group-hover:focus:outline-blue-800 dark:group-hover:outline-blue-900 dark:group-hover:focus:outline-blue-800"
:tabindex="context.disabled ? '-1' : '0'"
:name="option.value == localValue ? 'radio-yes' : 'radio-no'"
@keydown.space.prevent="selectOption(option)"
Expand Down

0 comments on commit 3e8ef18

Please sign in to comment.