Rename navbar components
This commit is contained in:
parent
e18e898102
commit
d9722e13f7
5 changed files with 12 additions and 11 deletions
|
|
@ -1,6 +1,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import CNavbar from "./components/CNavbar.vue";
|
||||||
import CNote from "./components/CNote.vue";
|
import CNote from "./components/CNote.vue";
|
||||||
import Navbar from "./components/Navbar.vue";
|
|
||||||
import { Note } from "./types";
|
import { Note } from "./types";
|
||||||
|
|
||||||
const testNote: Note = {
|
const testNote: Note = {
|
||||||
|
|
@ -14,7 +14,7 @@ const testNote: Note = {
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="flex h-screen touch-pan-x touch-pan-y flex-col">
|
<div class="flex h-screen touch-pan-x touch-pan-y flex-col">
|
||||||
<Navbar />
|
<CNavbar />
|
||||||
<div class="h-full overflow-auto px-2 py-1">
|
<div class="h-full overflow-auto px-2 py-1">
|
||||||
<CNote :note="testNote" />
|
<CNote :note="testNote" />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { RiDeleteBinFill, RiSettings3Fill } from "@remixicon/vue";
|
|
||||||
import NavbarDropdown from "./NavbarDropdown.vue";
|
|
||||||
import { useReposStore } from "@/stores/repos";
|
import { useReposStore } from "@/stores/repos";
|
||||||
|
import { RiDeleteBinFill, RiSettings3Fill } from "@remixicon/vue";
|
||||||
|
import CNavbarDropdown from "./CNavbarDropdown.vue";
|
||||||
|
|
||||||
const repos = useReposStore();
|
const repos = useReposStore();
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -11,7 +11,7 @@ const repos = useReposStore();
|
||||||
<!-- The div is necessary because of the delete button, otherwise I could
|
<!-- The div is necessary because of the delete button, otherwise I could
|
||||||
just use justify-between -->
|
just use justify-between -->
|
||||||
<div class="mr-auto overflow-hidden">
|
<div class="mr-auto overflow-hidden">
|
||||||
<NavbarDropdown />
|
<CNavbarDropdown />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Temporary delete button until I add proper repo settings -->
|
<!-- Temporary delete button until I add proper repo settings -->
|
||||||
|
|
@ -7,7 +7,7 @@ import {
|
||||||
RiArrowDropUpLine,
|
RiArrowDropUpLine,
|
||||||
} from "@remixicon/vue";
|
} from "@remixicon/vue";
|
||||||
import { ref, useTemplateRef } from "vue";
|
import { ref, useTemplateRef } from "vue";
|
||||||
import NavbarDropdownEntry from "./NavbarDropdownEntry.vue";
|
import CNavbarDropdownEntry from "./CNavbarDropdownEntry.vue";
|
||||||
|
|
||||||
const repos = useReposStore();
|
const repos = useReposStore();
|
||||||
|
|
||||||
|
|
@ -77,15 +77,16 @@ function onSelectRepo(id: string) {
|
||||||
style="scrollbar-gutter: stable"
|
style="scrollbar-gutter: stable"
|
||||||
:style="floatingStyles"
|
:style="floatingStyles"
|
||||||
>
|
>
|
||||||
<NavbarDropdownEntry
|
<CNavbarDropdownEntry
|
||||||
v-for="repo of repos.reposByName"
|
v-for="repo of repos.reposByName"
|
||||||
:class="{ 'font-medium': repo.id === repos.selectedRepoId }"
|
:class="{ 'font-medium': repo.id === repos.selectedRepoId }"
|
||||||
@click="onSelectRepo(repo.id)"
|
@click="onSelectRepo(repo.id)"
|
||||||
>{{ repo.name }}</NavbarDropdownEntry
|
|
||||||
>
|
>
|
||||||
|
{{ repo.name }}
|
||||||
|
</CNavbarDropdownEntry>
|
||||||
<hr v-if="repos.reposByName.length > 0" class="m-1 text-neutral-700" />
|
<hr v-if="repos.reposByName.length > 0" class="m-1 text-neutral-700" />
|
||||||
<NavbarDropdownEntry class="italic" @click="onAddNewRepo">
|
<CNavbarDropdownEntry class="italic" @click="onAddNewRepo">
|
||||||
<RiAddLine size="16px" class="-ml-1 inline" /> add new repo
|
<RiAddLine size="16px" class="-ml-1 inline" /> add new repo
|
||||||
</NavbarDropdownEntry>
|
</CNavbarDropdownEntry>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Note as Note } from "@/types";
|
import { Note } from "@/types";
|
||||||
|
|
||||||
const props = defineProps<{ note: Note }>();
|
const props = defineProps<{ note: Note }>();
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue