diff options
Diffstat (limited to 'src-vue/src/views/mods')
| -rw-r--r-- | src-vue/src/views/mods/LocalModsView.vue | 60 | ||||
| -rw-r--r-- | src-vue/src/views/mods/ThunderstoreModsView.vue | 21 |
2 files changed, 39 insertions, 42 deletions
diff --git a/src-vue/src/views/mods/LocalModsView.vue b/src-vue/src/views/mods/LocalModsView.vue index 4bc870fe..2cd253ae 100644 --- a/src-vue/src/views/mods/LocalModsView.vue +++ b/src-vue/src/views/mods/LocalModsView.vue @@ -1,33 +1,35 @@ <template> - <el-scrollbar> - <div> - <p v-if="mods.length === 0">{{ $t('mods.local.no_mods') }}</p> - <el-card v-else shadow="hover" v-for="mod in mods" v-bind:key="mod.name"> - <el-switch style="--el-switch-on-color: #13ce66; --el-switch-off-color: #8957e5" v-model="mod.enabled" - :before-change="() => updateWhichModsEnabled(mod)" :loading="global_load_indicator" /> - <el-popconfirm - :title="$t('mods.local.delete_confirm')" - :confirm-button-text="$t('generic.yes')" - :cancel-button-text="$t('generic.no')" - @confirm="deleteMod(mod)" - > - <template #reference> - <el-button type="danger"> - {{ $t('mods.local.delete') }} - </el-button> - </template> - </el-popconfirm> - {{ mod.name }} - <span v-if="mod.version != null">(v{{ mod.version }})</span> - <img - v-if="mod.thunderstore_mod_string != null" - :title="$t('mods.local.part_of_ts_mod')" - src="/src/assets/thunderstore-icon.png" - class="image" - height="16" - /> - </el-card> - </div> + <!-- Message displayed if no mod matched searched words --> + <div v-if="mods.length === 0" class="noModMessage"> + {{ $t('mods.local.no_mods') }} + </div> + + <el-scrollbar v-else> + <el-card shadow="hover" v-for="mod in mods" v-bind:key="mod.name"> + <el-switch style="--el-switch-on-color: #13ce66; --el-switch-off-color: #8957e5" v-model="mod.enabled" + :before-change="() => updateWhichModsEnabled(mod)" :loading="global_load_indicator" /> + <el-popconfirm + :title="$t('mods.local.delete_confirm')" + :confirm-button-text="$t('generic.yes')" + :cancel-button-text="$t('generic.no')" + @confirm="deleteMod(mod)" + > + <template #reference> + <el-button type="danger"> + {{ $t('mods.local.delete') }} + </el-button> + </template> + </el-popconfirm> + {{ mod.name }} + <span v-if="mod.version != null">(v{{ mod.version }})</span> + <img + v-if="mod.thunderstore_mod_string != null" + :title="$t('mods.local.part_of_ts_mod')" + src="/src/assets/thunderstore-icon.png" + class="image" + height="16" + /> + </el-card> </el-scrollbar> </template> diff --git a/src-vue/src/views/mods/ThunderstoreModsView.vue b/src-vue/src/views/mods/ThunderstoreModsView.vue index 0a0b9965..5a7270df 100644 --- a/src-vue/src/views/mods/ThunderstoreModsView.vue +++ b/src-vue/src/views/mods/ThunderstoreModsView.vue @@ -3,11 +3,17 @@ <div v-if="mods.length === 0" class="fc__changelog__container">
<el-progress :show-text="false" :percentage="50" :indeterminate="true" />
</div>
+
+ <!-- Message displayed if no mod matched searched words -->
+ <div v-else-if="filteredMods.length === 0" class="noModMessage">
+ {{ $t('mods.online.no_match') }}<br/>
+ {{ $t('mods.online.try_another_search') }}
+ </div>
+
<el-scrollbar v-else class="container" ref="scrollbar">
<div class="card-container">
- <div class="pagination_container">
+ <div class="pagination_container" v-if="shouldDisplayPagination">
<el-pagination
- v-if="shouldDisplayPagination"
:currentPage="currentPageIndex + 1"
layout="prev, pager, next"
:page-size="modsPerPage"
@@ -16,12 +22,6 @@ />
</div>
- <!-- Message displayed if no mod matched searched words -->
- <div v-if="filteredMods.length === 0" class="modMessage">
- {{ $t('mods.online.no_match') }}<br/>
- {{ $t('mods.online.try_another_search') }}
- </div>
-
<!-- Mod cards -->
<thunderstore-mod-card v-for="mod of currentPageMods" v-bind:key="mod.name" :mod="mod" />
</div>
@@ -199,11 +199,6 @@ export default defineComponent({ margin: 0 0 0 10px !important;
}
-.modMessage {
- color: white;
- margin: 20px 5px;
-}
-
.card-container {
margin: 0 auto;
}
|