Arno Kaimbacher
a7142f694f
All checks were successful
CI Pipeline / japa-tests (push) Successful in 51s
- npm updates - new SearchMap.vue component
36 lines
1.0 KiB
Vue
36 lines
1.0 KiB
Vue
<script setup>
|
|
import { mdiCog } from '@mdi/js';
|
|
import { useSlots, computed } from 'vue';
|
|
import BaseIcon from '@/Components/BaseIcon.vue';
|
|
import BaseButton from '@/Components/BaseButton.vue';
|
|
import IconRounded from '@/Components/IconRounded.vue';
|
|
|
|
defineProps({
|
|
icon: {
|
|
type: String,
|
|
default: null,
|
|
},
|
|
title: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
main: Boolean,
|
|
});
|
|
|
|
const hasSlot = computed(() => useSlots().default);
|
|
</script>
|
|
|
|
<template>
|
|
<section :class="{ 'pt-6': !main }" class="mb-6 flex items-center justify-between">
|
|
<div class="flex items-center justify-start">
|
|
<IconRounded v-if="icon && main" :icon="icon" type="light" class="mr-3" bg />
|
|
<BaseIcon v-else-if="icon" :path="icon" class="mr-2" size="20" />
|
|
<h1 :class="main ? 'text-3xl' : 'text-2xl'" class="leading-tight">
|
|
{{ title }}
|
|
</h1>
|
|
</div>
|
|
<slot v-if="hasSlot" />
|
|
<BaseButton v-else :icon="mdiCog" small />
|
|
</section>
|
|
</template>
|