[ROMM-2291] Force titles to display on game cards

Author: gantoine

frontend/src/components/Settings/LibraryManagement/MissingGames/MissingGames.vue

@@ -44,6 +44,7 @@ const regionsRef = useLocalStorage("settings.showRegions", true);
 const languagesRef = useLocalStorage("settings.showLanguages", true);
 const statusRef = useLocalStorage("settings.showStatus", true);
 const actionBarRef = useLocalStorage("settings.showActionBar", false);
+const gameTitleRef = useLocalStorage("settings.showGameTitle", false);
 const enable3DEffectRef = useLocalStorage("settings.enable3DEffect", false);
 
 const homeOptions = computed(() => [
@@ -158,6 +159,14 @@ const galleryOptions = computed(() => [
     model: enable3DEffectRef,
     modelTrigger: toggle3DEffect,
   },
+  {
+    title: t("settings.show-game-titles"),
+    description: t("settings.show-game-titles-desc"),
+    iconEnabled: "mdi-text-box-outline",
+    iconDisabled: "mdi-text-box-outline",
+    model: gameTitleRef,
+    modelTrigger: toggleShowGameTitles,
+  },
 ]);
 
 const setPlatformDrawerGroupBy = (value: string) => {
@@ -214,6 +223,9 @@ const toggleActionBar = (value: boolean) => {
 const toggle3DEffect = (value: boolean) => {
   enable3DEffectRef.value = value;
 };
+const toggleShowGameTitles = (value: boolean) => {
+  gameTitleRef.value = value;
+};
 </script>
 <template>
   <r-section

frontend/src/components/Settings/UserInterface/Interface.vue

@@ -120,6 +120,7 @@ const fallbackCoverImage = computed(() =>
 const activeMenu = ref(false);
 
 const showActionBarAlways = useLocalStorage("settings.showActionBar", false);
+const showGameTitleAlways = useLocalStorage("settings.showGameTitle", false);
 const showSiblings = useLocalStorage("settings.showSiblings", true);
 
 const hasNotes = computed(() => {
@@ -251,6 +252,7 @@ onBeforeUnmount(() => {
                   <div
                     v-if="
                       isHovering ||
+                      showGameTitleAlways ||
                       (romsStore.isSimpleRom(rom) && !rom.path_cover_large) ||
                       (!romsStore.isSimpleRom(rom) &&
                         !rom.igdb_url_cover &&

frontend/src/components/common/Game/Card/Base.vue

@@ -182,15 +182,16 @@ onUnmounted(() => {
         slider-color="secondary"
         selected-class="bg-toplayer"
       >
-        <v-tab prepend-icon="mdi-cog" class="rounded" value="config"
-          >Config</v-tab
-        >
+        <v-tab prepend-icon="mdi-cog" class="rounded" value="config">
+          Config
+        </v-tab>
         <v-tab
           prepend-icon="mdi-folder-question"
           class="rounded"
           value="missing"
-          >Missing games</v-tab
         >
+          Missing games
+        </v-tab>
       </v-tabs>
     </v-col>
     <v-col>
@@ -266,8 +267,9 @@ onUnmounted(() => {
                 class="text-romm-red bg-toplayer"
                 variant="flat"
                 @click="cleanupAll"
-                >Clean up all</v-btn
               >
+                Clean up all
+              </v-btn>
             </v-col>
           </v-row>
           <game-table class="mx-2 mt-2" show-platform-icon />