mirror of
https://github.com/believethehype/nostrdvm.git
synced 2025-11-19 02:56:34 +01:00
98 lines
1.9 KiB
Vue
98 lines
1.9 KiB
Vue
<script setup>
|
|
import Nip07 from "@/components/Nip07.vue";
|
|
|
|
</script>
|
|
|
|
<template>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="navbar bg-base-100">
|
|
<div className="flex-none">
|
|
<!-- <button className="btn btn-square btn-ghost">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className="inline-block w-5 h-5 stroke-current"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
|
|
test</button>-->
|
|
</div>
|
|
<div className="flex-1">
|
|
<router-link class="menu" to="/">Noogle</router-link>
|
|
<router-link class="menu" to="/about">About</router-link>
|
|
<!-- <router-link class="menu" to="/donate">Donate</router-link> -->
|
|
|
|
<div className="flex-none">
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<Nip07/>
|
|
|
|
</div>
|
|
|
|
<div class="three-column-layout">
|
|
<header>
|
|
|
|
<!-- <AppLogo />-->
|
|
|
|
</header>
|
|
|
|
<main>
|
|
|
|
|
|
|
|
<router-view />
|
|
<slot />
|
|
</main>
|
|
|
|
<aside>
|
|
<slot name="aside" />
|
|
<!-- <AppFooter /> -->
|
|
</aside>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.three-column-layout {
|
|
display: grid;
|
|
grid-template-areas:
|
|
"header"
|
|
"main"
|
|
"aside";
|
|
|
|
header {
|
|
grid-area: header;
|
|
margin-top: 30px;
|
|
}
|
|
main {
|
|
grid-area: main;
|
|
margin-top: 10px;
|
|
padding: 20px;
|
|
|
|
}
|
|
aside {
|
|
grid-area: aside;
|
|
margin-top: 10px;
|
|
padding: 20px;
|
|
}
|
|
|
|
.router-link-exact-active{
|
|
color: rgba(255, 255, 255, 0.87);
|
|
}
|
|
|
|
|
|
.v-Button {
|
|
@apply bg-black hover:bg-nostr focus:ring-nostr mb-2 inline-flex flex-none items-center rounded-lg border border-nostr px-3 py-1.5 text-sm leading-4 text-white transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white dark:focus:ring-offset-gray-900;
|
|
|
|
height: 44px;
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (min-width: 768px) {
|
|
grid-template-columns: 1fr 3fr 1fr;
|
|
grid-template-areas: "header main aside";
|
|
}
|
|
}
|
|
</style> |