chore: club details added

Sybit-Education · Nov 27, 2023 · d7ccfa8 · d7ccfa8
1 parent c7d6ded
commit d7ccfa8
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 7 deletions.
diff --git a/components.d.ts b/components.d.ts
@@ -9,17 +9,26 @@ declare module 'vue' {
   export interface GlobalComponents {
     BarsItem: typeof import('./src/components/bars/barsItem.vue')['default']
     BarsList: typeof import('./src/components/bars/barsList.vue')['default']
+    BBreadcrumb: typeof import('bootstrap-vue-next')['BBreadcrumb']
+    BBreadcrumbItem: typeof import('bootstrap-vue-next')['BBreadcrumbItem']
     BButton: typeof import('bootstrap-vue-next')['BButton']
     BCard: typeof import('bootstrap-vue-next')['BCard']
     BCardGroup: typeof import('bootstrap-vue-next')['BCardGroup']
     BCardText: typeof import('bootstrap-vue-next')['BCardText']
     BCardTitle: typeof import('bootstrap-vue-next')['BCardTitle']
     BCol: typeof import('bootstrap-vue-next')['BCol']
+    BCollapse: typeof import('bootstrap-vue-next')['BCollapse']
     BContainer: typeof import('bootstrap-vue-next')['BContainer']
     BFormGroup: typeof import('bootstrap-vue-next')['BFormGroup']
     BFormInput: typeof import('bootstrap-vue-next')['BFormInput']
     BImg: typeof import('bootstrap-vue-next')['BImg']
     BInputGroup: typeof import('bootstrap-vue-next')['BInputGroup']
+    BNavbar: typeof import('bootstrap-vue-next')['BNavbar']
+    BNavbarBrand: typeof import('bootstrap-vue-next')['BNavbarBrand']
+    BNavbarNav: typeof import('bootstrap-vue-next')['BNavbarNav']
+    BNavbarToggle: typeof import('bootstrap-vue-next')['BNavbarToggle']
+    BNavItem: typeof import('bootstrap-vue-next')['BNavItem']
+    BNavText: typeof import('bootstrap-vue-next')['BNavText']
     BPlaceholder: typeof import('bootstrap-vue-next')['BPlaceholder']
     BPlaceholderCard: typeof import('bootstrap-vue-next')['BPlaceholderCard']
     BPlaceholderWrapper: typeof import('bootstrap-vue-next')['BPlaceholderWrapper']
@@ -49,4 +58,7 @@ declare module 'vue' {
     TheWelcome: typeof import('./src/components/TheWelcome.vue')['default']
     WelcomeItem: typeof import('./src/components/WelcomeItem.vue')['default']
   }
+  export interface ComponentCustomProperties {
+    vBColorMode: typeof import('bootstrap-vue-next')['vBColorMode']
+  }
 }
diff --git a/src/components/LocaleeHeader.vue b/src/components/LocaleeHeader.vue
@@ -2,9 +2,18 @@
 
 
 <template>
-    <div id="header">
-        <h1>Localee</h1>
-    </div>
+    <BNavbar toggleable="sm" variant="primary" v-b-color-mode="'dark'">
+        <BNavbarBrand tag="h1" class="mb-0" to="/">Localee</BNavbarBrand>
+
+        <BNavbarToggle target="nav-text-collapse" />
+
+        <BCollapse id="nav-text-collapse" is-nav>
+            <BNavbarNav>
+                <BNavItem to="/club">Clubs</BNavItem>
+                <BNavItem to="/about">Über uns</BNavItem>
+            </BNavbarNav>
+        </BCollapse>
+    </BNavbar>
 </template>
 
 

diff --git a/src/views/ClubDetailView.vue b/src/views/ClubDetailView.vue
@@ -1,10 +1,24 @@
 <template>
-    <div v-if="club">
-        <h1>{{ club.name }}</h1>
-        <b-img :src="image" />
-        <p>{{ club.notes }}</p>
+  <div  v-if="club">
+    <BBreadcrumb>
+      <BBreadcrumbItem to="/home"> Home </BBreadcrumbItem>
+      <BBreadcrumbItem to="/club"> Clubs </BBreadcrumbItem>
+      <BBreadcrumbItem :to="'/club/' + club.id" active> {{ club.name }} </BBreadcrumbItem>
+    </BBreadcrumb>
+
+    <div>
+      <h1>{{ club.name }}</h1>
+      <b-img :src="image" fluid-grow />
+      <p>{{ club.notes }}</p>
+
+      <h3>Adresse</h3>
+      <address>
+        <span id="street">{{ club.adresse }}</span><br />
+        <span id="zipCode">{{ club.plz }}</span> <span id="city">{{ club.ort }}</span>
+      </address>
 
     </div>
+  </div>
 </template>
 <script lang="ts">
 import { mapState } from "pinia";