Merge pull request #108 from petridishdev/word-wrap

Fixes showcase tile word wrapping. Other style fixes

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "orgbook-bc-client-vue",
+  "name": "orgbook-bc-client",
   "version": "0.1.0",
   "private": true,
   "scripts": {

src/components/about/ShowcaseLinks.vue

@@ -8,7 +8,7 @@
     >
       <v-card elevation="0" rounded="sm" class="card">
         <v-card-title class="font-weight-bold">
-          <router-link :to="showcaseLink.path">
+          <router-link class="showcase-link" :to="showcaseLink.path">
             {{
               (showcaseLink.data && showcaseLink.data.showcaseTitle) ||
               showcaseLink.name
@@ -42,4 +42,7 @@ export default class ShowcaseLinks extends Vue {}
   @include card;
   height: 100%;
 }
+.showcase-link {
+  word-break: break-word;
+}
 </style>

src/components/entity/credentialDetail/CredentialDetail.vue

@@ -14,7 +14,7 @@
       <v-card rounded="sm" class="mb-5 card">
         <v-card-title class="pa-5 pb-0">
           <p class="text-h6 font-weight-bold">
-            <v-icon class="validated" v-if="!credRevoked">{{
+            <v-icon class="validated pb-1" v-if="!credRevoked">{{
               mdiShieldCheckOutline
             }}</v-icon>
             <span>{{ `${currCredTypeDesc} credential` }}</span

src/components/search/SearchBar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="{ 'pt-10 pb-10': $vuetify.breakpoint.mdAndUp }">
+  <div :class="{ 'pt-4 pb-10': $vuetify.breakpoint.mdAndUp }">
     <p class="font-weight-bold mb-1" v-if="$vuetify.breakpoint.mdAndUp">
       Find an organization
     </p>

src/views/Search.vue

@@ -1,9 +1,9 @@
 <template>
   <div>
     <div class="search-bar">
-      <v-container :fluid="$vuetify.breakpoint.smAndDown" class="pa-5">
+      <v-container :fluid="$vuetify.breakpoint.smAndDown" class="pa-3">
         <v-row>
-          <v-col class="d-flex flex-column flex-grow-1 ml-n3" cols="12" md="9">
+          <v-col class="d-flex flex-column flex-grow-1" cols="12" md="9">
             <p
               class="
                 font-weight-normal
@@ -13,9 +13,9 @@
             >
               A public directory of organizations registered in BC
             </p>
-            <SearchBar :query="q" />
+            <SearchBar :query="q" class="flex-grow-1" />
           </v-col>
-          <v-col class="flex-grow-0 pt-0 pb-0 ml-n3" cols="12" md="3">
+          <v-col class="flex-grow-0 pt-0 pb-0" cols="12" md="3">
             <SearchDescription
               class="pt-4"
               v-if="$vuetify.breakpoint.mdAndUp"

vue.config.js

@@ -29,8 +29,16 @@ module.exports = {
       proxy: {
         "/api": {
           target: "https://orgbook.gov.bc.ca",
+          // target: "http://localhost:8080",
         },
       },
     },
   },
+  pwa: {
+    name: "OrgBook BC",
+    themeColor: "#003366",
+    msTileColor: "#000000",
+    appleMobileWebAppCapable: "yes",
+    appleMobileWebAppStatusBarStyle: "003366",
+  },
 };