beenull
/
merakiui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add by me a coffe button

This commit is contained in:
khatabwedaa 2022-01-25 14:59:25 +02:00
parent 6c3d1f187b
commit 829061eeed
2 changed files with 46 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
layouts/default.vue
View File

@ -1,9 +1,52 @@
<template>
<div class="bg-white font-roboto">
<div class="relative bg-white font-roboto">
<Nuxt />
<transition
leave-active-class="transition duration-300 ease-in transform"
leave-class="translate-x-0 opacity-100"
leave-to-class="translate-x-20 opacity-0"
>
<div v-show="byMeCoffee" class="fixed inset-x-0 lg:inset-x-auto bottom-6 lg:right-8 xl:right-10 xl:bottom-8">
<div class="lg:w-[24rem] px-6 lg:px-0">
<div class="p-2 bg-blue-600 rounded-lg shadow-lg sm:p-3">
<div class="flex flex-wrap items-center justify-between">
<a target="_blank" href="https://www.buymeacoffee.com/khatabwedaa/e/54228" class="flex items-center flex-1 w-0">
<span class="flex p-2 bg-blue-800 rounded-lg">
<!-- Heroicon name: outline/speakerphone -->
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 15.546c-.523 0-1.046.151-1.5.454a2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0 2.701 2.701 0 00-1.5-.454M9 6v2m3-2v2m3-2v2M9 3h.01M12 3h.01M15 3h.01M21 21v-7a2 2 0 00-2-2H5a2 2 0 00-2 2v7h18zm-3-9v-2a2 2 0 00-2-2H8a2 2 0 00-2 2v2h12z" />
</svg>
</span>
<p class="ml-3 font-medium tracking-wide text-white truncate">
Support Meraki UI
</p>
</a>
<div class="flex-shrink-0 order-2 sm:order-3 sm:ml-2">
<button @click="byMeCoffee = false" type="button" class="flex p-2 -mr-1 rounded-md hover:bg-blue-500 focus:outline-none focus:ring-2 focus:ring-white">
<span class="sr-only">Dismiss</span>
<!-- Heroicon name: outline/x -->
<svg class="w-4 h-4 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
</div>
</div>
</div>
</div>
</transition>
</div>
</template>
<script>
export default {};
export default {
data() {
return {
byMeCoffee: true
}
}
};
</script>

2
pages/components.vue
View File

@ -73,7 +73,7 @@
</div>
</div>
<button @click="sidebarOpen = !sidebarOpen" type="button" class="fixed z-50 flex items-center justify-center p-3 text-white bg-gray-900 rounded-full focus:outline-none xl:hidden bottom-12 right-8">
<button @click="sidebarOpen = !sidebarOpen" type="button" class="fixed z-50 flex items-center justify-center p-3 text-white bg-gray-900 rounded-full focus:outline-none xl:hidden bottom-24 right-8">
<span class="sr-only">Open site navigation</span>
<svg v-if="!sidebarOpen" class="w-8 h-8" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21 18H9V16H21V18ZM21 13H3V11H21V13ZM21 8H9V6H21V8Z" fill="currentColor"></path>