Few more bootstrap changes caught

slmnio · May 2, 2024 · 53b41b7 · 53b41b7
1 parent aba9ec7
commit 53b41b7
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 22 deletions.
diff --git a/website/src/components/broadcast/roots/ClientOverview.vue b/website/src/components/broadcast/roots/ClientOverview.vue
@@ -5,13 +5,26 @@
         <b-button class="mt-2" variant="danger" @click="reloadAll"><i class="fas fa-redo fa-fw"></i> Reload all sources</b-button>
 
         <table class="my-3">
-            <tr v-for="overlay in sortedOverlays" :key="overlay.socket" :class="{ 'overlay-minor': overlay.minor || overlay.forHumans, 'overlay-for-humans': overlay.forHumans, 'overlay-active bg-danger': overlay.active }">
-                <td><b-button @click="sendToOverlay(overlay.socket, 'reload')" size="sm" variant="dark"><i class="fa fa-fw fa-sync"></i></b-button></td>
-                <td><b-button size="sm" variant="dark" :href="overlay.fullPath" target="_blank"><i class="fa fa-fw fa-external-link"></i></b-button></td>
-                <td><span class="b-pad"><i class="fa fa-fw" :class="{'fa-eye': overlay.visible, 'fa-eye-slash': !overlay.visible}"></i></span></td>
-                <td><span class="b-pad fw-bold">{{ overlay.component }}</span></td>
-                <td><span class="b-pad">{{ decodeURIComponent(overlay.fullPath.replace(overlay.path, "")) }}</span></td>
-            </tr>
+            <tbody>
+                <tr v-for="overlay in sortedOverlays" :key="overlay.socket"
+                    :class="{ 'overlay-minor': overlay.minor || overlay.forHumans, 'overlay-for-humans': overlay.forHumans, 'overlay-active bg-danger': overlay.active }">
+                    <td>
+                        <b-button @click="sendToOverlay(overlay.socket, 'reload')" size="sm" variant="dark"><i class="fa fa-fw fa-sync"></i></b-button>
+                    </td>
+                    <td>
+                        <b-button size="sm" variant="dark" :href="overlay.fullPath" target="_blank"><i class="fa fa-fw fa-external-link"></i></b-button>
+                    </td>
+                    <td>
+                        <span class="b-pad"><i class="fa fa-fw" :class="{'fa-eye': overlay.visible, 'fa-eye-slash': !overlay.visible}"></i></span>
+                    </td>
+                    <td>
+                        <span class="b-pad fw-bold">{{ overlay.component }}</span>
+                    </td>
+                    <td>
+                        <span class="b-pad">{{ decodeURIComponent(overlay.fullPath.replace(overlay.path, "")) }}</span>
+                    </td>
+                </tr>
+            </tbody>
         </table>
 
         <div class="remote-obs-data">

diff --git a/website/src/components/website/ContentThing.vue b/website/src/components/website/ContentThing.vue
@@ -94,6 +94,7 @@ export default {
     }
     .content-thing:hover {
         color: inherit;
+        text-decoration: underline;
     }
 
     .icon-internal {

diff --git a/website/src/components/website/bracket/Bracket.vue b/website/src/components/website/bracket/Bracket.vue
@@ -456,6 +456,7 @@ export default {
     margin: 0 var(--margin-width);
     display: flex;
     flex-direction: column;
+    flex-shrink: 0;
 }
 
 .column.gap-right {

diff --git a/website/src/components/website/dashboard/BreakDisplayMultiModal.vue b/website/src/components/website/dashboard/BreakDisplayMultiModal.vue
@@ -12,7 +12,7 @@
                 </b-button>
             </b-button-group>
         </div>
-        <b-modal ref="modal" id="break-display" title="Break display settings">
+        <b-modal ref="modal" id="break-display" title="Break display settings" :hide-footer="selectedTab !== 'Display'">
             <b-form-radio-group class="w-100 mb-3" v-model="selectedTab" :options="tabs" buttons button-variant="outline-primary" />
             <BreakTimeControls :broadcast="broadcast" v-if="selectedTab === 'Countdown'" />
             <BreakTextTab :broadcast="broadcast" v-if="selectedTab === 'Text'" />

diff --git a/website/src/components/website/dashboard/BreakTimeControls.vue b/website/src/components/website/dashboard/BreakTimeControls.vue
@@ -109,7 +109,7 @@ export default {
 
 <style scoped>
 .label {
-    margin-bottom: .15em;
+    margin-bottom: .25em;
     height: 19px;
 }
 

diff --git a/website/src/utils/reactive.js b/website/src/utils/reactive.js
@@ -2,7 +2,7 @@ import store from "../thing-store";
 import { queueThings, resolveThing } from "@/utils/fetch";
 import { cleanID } from "@/utils/content-utils";
 
-export function ReactiveRoot (id, structure) {
+export function ReactiveRoot(id, structure) {
     // console.log("[reactive-root]", id);
     id = cleanID(id);
     const data = store.getters.thing(id);

diff --git a/website/src/views/sub-views/PlayerPartners.vue b/website/src/views/sub-views/PlayerPartners.vue
@@ -10,18 +10,28 @@
             <div>{{ partners?.length }} partner{{ partners?.length === 1 ? '' : 's' }}</div>
         </div>
         <table class="table table-bordered table-dark table-sm" v-if="chosenPartnerType">
-            <tr>
-                <th>Partner</th>
-                <th>Matches together</th>
-                <th>Last match together</th>
-            </tr>
-            <tr v-for="partner in partners" :key="partner.player.id">
-                <td><router-link :to="`/player/${partner.player.id}/partners`">{{ partner.player.name }}</router-link></td>
-                <td>{{ partner.matches }}</td>
-                <td>{{ formatTime(partner.lastMatch.start, {format: "{day} {date-ordinal} {month} {year}", tz: $store.state.timezone, use24HourTime: $store.state.use24HourTime}) }} -
-                    <span v-if="partner.lastMatch?.event"><router-link :to="url('event', partner.lastMatch?.event)">{{ partner.lastMatch?.event?.name || '...' }}</router-link> - </span>
-                    <router-link :to="url('match', partner.lastMatch)">{{ partner.lastMatch?.name || '...' }}</router-link></td>
-            </tr>
+            <thead>
+                <tr>
+                    <th>Partner</th>
+                    <th>Matches together</th>
+                    <th>Last match together</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr v-for="partner in partners" :key="partner.player.id">
+                    <td>
+                        <router-link :to="`/player/${partner.player.id}/partners`">{{partner.player.name}}</router-link>
+                    </td>
+                    <td>{{ partner.matches }}</td>
+                    <td>
+                        {{ formatTime(partner.lastMatch.start, { format: "{day} {date-ordinal} {month} {year}", tz: $store.state.timezone, use24HourTime: $store.state.use24HourTime }) }} -
+                        <span v-if="partner.lastMatch?.event">
+                            <router-link :to="url('event', partner.lastMatch?.event)">{{ partner.lastMatch?.event?.name || "..." }}</router-link> -
+                        </span>
+                        <router-link :to="url('match', partner.lastMatch)">{{ partner.lastMatch?.name || "..." }}</router-link>
+                    </td>
+                </tr>
+            </tbody>
         </table>
     </div>
 </template>