Merge branch 'master' of github.com:romancm/gamebrary

src/components/BoardsDropdown.vue

@@ -27,7 +27,7 @@
           `"
       />
 
-      <small class="px-2">{{ board.name }}</small>
+      <small class="px-2 d-none d-md-inline text-nowrap">{{ board.name }}</small>
     </template>
 
     <!-- <b-dropdown-item href="#">

src/components/Game/GameDropdown.vue

@@ -10,7 +10,8 @@
     <template #button-content>
       <b-avatar variant="transparent" :src="gameCoverUrl" rounded />
 
-      <small class="text-white px-2 text-decoration-none">{{ game.name }}</small>
+      <!-- <small class="text-white px-2 text-decoration-none">{{ game.name }}</small> -->
+      <small class="px-2 d-none d-md-inline text-nowrap">{{ game.name }}</small>
     </template>
 
     <!-- <b-button-group class="mx-1">

src/components/Lists/GameList.vue

@@ -16,15 +16,16 @@
       <header class="p-2">
         <b-button
           block
+          size="sm"
           variant="outline-light"
-          class="text-dark d-flex justify-content-between align-items-center px-2 border-0"
+          class="text-dark d-flex justify-content-between align-items-center px-2"
           :disabled="preview || (user && user.uid !== board.owner)"
           :to="{ name: 'board.list.edit', params: { id: board.id, listIndex } }"
         >
           <span>
             <b-badge
               v-if="showGameCount"
-              variant="light"
+              variant="info"
             >
               {{ list.games.length }}
             </b-badge>

src/components/PageHeader.vue

@@ -100,7 +100,7 @@ export default {
     // overflow-y: hidden;
     // height: 46px;
     grid-template-columns: 65px 1fr;
-    // background-color: #1c1c27;
+    // background-color: #574c4f;
   }
 
   .toolbar {

src/components/SearchBox.vue

@@ -7,8 +7,9 @@
           type="search"
           autofocus
           debounce="500"
-          :placeholder="$t('board.addGame.inputPlaceholder')"
+          placeholder="Search"
         />
+        <!-- TODO: auto search if already in search page -->
 
         <b-input-group-append>
           <b-button
@@ -58,6 +59,6 @@ export default {
 <style lang="scss" rel="stylesheet/scss" scoped>
   .search-box {
     max-width: 100%;
-    width: 240px;
+    width: 200px;
   }
 </style>

src/pages/DevToolsPage.vue

@@ -18,6 +18,38 @@
       >
         {{ variant }}
       </b-button>
+
+      <b-button
+        v-for="size in ['sm', '', 'lg']"
+        :variant="`outline-${variant}`"
+        :key="size"
+        :size="size"
+        class="mr-2"
+      >
+        {{ variant }}
+      </b-button>
+
+      <b-button
+        v-for="size in ['sm', '', 'lg']"
+        :variant="`${variant}`"
+        pill
+        :key="size"
+        :size="size"
+        class="mr-2"
+      >
+        {{ variant }}
+      </b-button>
+      
+      <b-button
+        v-for="size in ['sm', '', 'lg']"
+        :variant="`${variant}`"
+        squared
+        :key="size"
+        :size="size"
+        class="mr-2"
+      >
+        {{ variant }}
+      </b-button>
     </div>
 
     <h1>Axiom Verge</h1>

yarn.lock

@@ -10002,11 +10002,6 @@ vue-loader@^17.0.0:
     hash-sum "^2.0.0"
     loader-utils "^2.0.0"
 
-vue-observe-visibility@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/vue-observe-visibility/-/vue-observe-visibility-1.0.0.tgz#17cf1b2caf74022f0f3c95371468ddf2b9573152"
-  integrity sha512-s5TFh3s3h3Mhd3jaz3zGzkVHKHnc/0C/gNr30olO99+yw2hl3WBhK3ng3/f9OF+qkW4+l7GkmwfAzDAcY3lCFg==
-
 vue-raven@^1.0.0:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/vue-raven/-/vue-raven-1.0.3.tgz#cce941a9255e9694a5793c384fd8ab2e576ce764"