Arno Kaimbacher
a3031169ca
All checks were successful
CI / container-job (push) Successful in 36s
- mime_type.ts: Added a new column `public alternate_mimetype: string;` - MimetypeController.ts: Extended validation and storage logic to accommodate the new `alternate_mimetype` attribute - adonisrc.ts: Integrated new validation rule to validate user-provided mimetypes - vite.ts: Set `defer: true` for script attributes to improve loading performance - update_1_to_mime_types.ts: Added migration for the new `alternate_mimetype` column in the database - UI improvements: Updated components such as AsideMenuLayer.vue, FormCheckRadioGroup.vue, MimeTypeInput.vue, NavBar.vue (lime-green background), NavBarMenu.vue, SectionBannerStarOnGitea.vue, Admin/mimetype/Create.vue, Admin/mimetype/Delete.vue, Admin/mimetype/Index.vue - allowed_extensions_mimetype.ts: Enhanced rule to also check for alternate mimetypes - referenceValidation.ts: Improved validation to allow only ISBNs with a '-' delimiter - package-lock.json: Updated npm dependencie
51 lines
No EOL
1.6 KiB
Vue
51 lines
No EOL
1.6 KiB
Vue
<script lang="ts" setup>
|
|
import { StyleService } from '@/Stores/style.service';
|
|
import { computed, ref, onMounted, onBeforeUnmount } from 'vue';
|
|
import { mdiChevronUp, mdiChevronDown } from '@mdi/js';
|
|
import NavBarItem from '@/Components/NavBarItem.vue';
|
|
import BaseIcon from '@/Components/BaseIcon.vue';
|
|
|
|
const styleStore = StyleService();
|
|
|
|
const isDropdownActive = ref(false);
|
|
|
|
const toggleDropdownIcon = computed(() => (isDropdownActive.value ? mdiChevronUp : mdiChevronDown));
|
|
|
|
const toggle = () => {
|
|
isDropdownActive.value = !isDropdownActive.value;
|
|
};
|
|
|
|
const root = ref(NavBarItem);
|
|
|
|
const forceClose = (event: MouseEvent) => {
|
|
if (!root.value?.$el.contains(event.target)) {
|
|
isDropdownActive.value = false;
|
|
}
|
|
};
|
|
|
|
onMounted(() => {
|
|
window.addEventListener('click', forceClose);
|
|
});
|
|
|
|
onBeforeUnmount(() => {
|
|
window.removeEventListener('click', forceClose);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<NavBarItem ref="root" type="block" :active="isDropdownActive" dropdown @click="toggle">
|
|
<a
|
|
class="flex items-center py-2 px-3 dark:bg-slate-800 lg:bg-transparent lg:dark:bg-transparent"
|
|
:class="styleStore.navBarMenuListUpperLabelStyle"
|
|
>
|
|
<slot />
|
|
<BaseIcon :path="toggleDropdownIcon" class="hidden lg:inline-flex transition-colors" />
|
|
</a>
|
|
<div
|
|
class="-mx-px text-sm border-b border-gray-100 lg:border lg:bg-white lg:absolute lg:top-full lg:left-0 lg:min-w-full lg:z-20 lg:rounded-b lg:dark:bg-slate-800 dark:border-slate-700"
|
|
:class="{ 'lg:hidden': !isDropdownActive }"
|
|
>
|
|
<slot name="dropdown" />
|
|
</div>
|
|
</NavBarItem>
|
|
</template> |