ui/src/App.vue

@@ -22,7 +22,7 @@
 import { Component, Vue } from "vue-property-decorator";
 import Calendar from "./components/calendar/Calendar.vue";
 import Dashboard from "./components/Dashboard.vue";
-import TitleBar from "./components/title_bar/TitleBar.vue";
+import TitleBar from "./components/TitleBar.vue";
 import TickerBar from "./components/TickerBar.vue";
 
 @Component({

ui/src/components/THWLogo.vue

@@ -8,7 +8,7 @@
         class="d-none d-sm-flex"
         max-width="56"
         max-height="56"
-        :src="require('@/assets/thw.svg')"
+        :src="require('../assets/thw.svg')"
       />
     </div>
     <v-divider class="d-none d-md-block my-1" />

ui/src/components/calendar/Calendar.vue

@@ -1,13 +1,6 @@
 <template>
   <v-list>
-    <template v-for="(event, index) in parsed_events">
+    <EventItem v-for="event in events" :event="event" :key="event.summary" />
-      <EventItem :event="event" :key="event.hash" />
-      <v-divider
-        v-if="index < parsed_events.length - 1"
-        class="mx-5"
-        :key="event.hash + '-div'"
-      />
-    </template>
   </v-list>
 </template>
 
@@ -22,7 +15,7 @@ import EventItem from "./EventItem.vue";
   },
 })
 export default class Calendar extends Vue {
-  private readonly events = [
+  private readonly events_json = [
     {
       summary: "Lorem Ipsum",
       description:
@@ -44,10 +37,10 @@ export default class Calendar extends Vue {
     },
   ];
 
-  private get parsed_events(): Array<Event> {
+  private get events(): Array<Event> {
     let arr = [];
 
-    for (let json of this.events) {
+    for (let json of this.events_json) {
       arr.push(new Event(json));
     }
 
@@ -56,8 +49,5 @@ export default class Calendar extends Vue {
 }
 </script>
 
-<style scoped>
+<style>
-.v-list .v-divider {
-  border-color: rgba(0, 0, 0, 0.25);
-}
 </style>

ui/src/components/calendar/EventDate.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="d-flex align-end justify-center mr-1 mr-md-2">
     <span class="d-flex text-h4 text-md-h3">{{ day }}</span>
-    <span class="d-flex text-h5 text-md-h4 blue-grey--text text--darken-1">
+    <span class="d-flex text-h5 text-md-h4 grey--text text--darken-1">{{
-      {{ month }}
+      month
-    </span>
+    }}</span>
   </div>
 </template>
 

ui/src/components/calendar/EventItem.vue

@@ -12,13 +12,7 @@
         {{ event.description }}
       </v-list-item-subtitle>
       <v-list-item-subtitle
-        class="
+        class="thw-heading-font grey--text text--darken-1 font-weight-bold ma-0"
-          thw-heading-font
-          blue-grey--text
-          text--darken-1
-          font-weight-bold
-          ma-0
-        "
       >
         {{ data_string }}
       </v-list-item-subtitle>

ui/src/components/calendar/event.ts

@@ -14,17 +14,4 @@ export default class Event {
 
     this.duration = end.diff(this.start);
   }
-
-  public get hash(): string {
-    const str = JSON.stringify(this);
-
-    // from https://gist.github.com/jlevy/c246006675becc446360a798e2b2d781
-    let hash = 0;
-    for (let i = 0; i < str.length; i++) {
-      const char = str.charCodeAt(i);
-      hash = (hash << 5) - hash + char;
-      hash &= hash; // Convert to 32bit integer
-    }
-    return new Uint32Array([hash])[0].toString(36);
-  }
 }