diff options
| author | julia.kirschenheuter <julia.kirschenheuter@nextcloud.com> | 2023-11-13 16:59:35 +0100 |
|---|---|---|
| committer | julia.kirschenheuter <julia.kirschenheuter@nextcloud.com> | 2023-11-15 10:50:10 +0100 |
| commit | 25d87033b109538da95d35fc0ac6201c61db57f7 (patch) | |
| tree | 9f7016311c838a37302b020452092b071da57123 /apps/settings/src | |
| parent | 830d85bcf1dd421717f69f3f22d434d1512e6e0f (diff) | |
| download | nextcloud-server-25d87033b109538da95d35fc0ac6201c61db57f7.tar.gz nextcloud-server-25d87033b109538da95d35fc0ac6201c61db57f7.zip | |
Add link for opening app details
Add `alt` for `AppScore` image
Signed-off-by: julia.kirschenheuter <julia.kirschenheuter@nextcloud.com>
Diffstat (limited to 'apps/settings/src')
| -rw-r--r-- | apps/settings/src/components/AppList/AppItem.vue | 37 | ||||
| -rw-r--r-- | apps/settings/src/components/AppList/AppScore.vue | 10 |
2 files changed, 23 insertions, 24 deletions
diff --git a/apps/settings/src/components/AppList/AppItem.vue b/apps/settings/src/components/AppList/AppItem.vue index 179497a0f19..0838f2c8822 100644 --- a/apps/settings/src/components/AppList/AppItem.vue +++ b/apps/settings/src/components/AppList/AppItem.vue @@ -23,12 +23,10 @@ <template> <component :is="listView ? `tr` : `li`" class="section" - :class="{ selected: isSelected }" - @click="showAppDetails"> + :class="{ selected: isSelected }"> <component :is="dataItemTag" class="app-image app-image-icon" - :headers="getDataItemHeaders(`app-table-col-icon`)" - @click="showAppDetails"> + :headers="getDataItemHeaders(`app-table-col-icon`)"> <div v-if="(listView && !app.preview) || (!listView && !screenshotLoaded)" class="icon-settings-dark" /> <svg v-else-if="listView && app.preview" @@ -48,9 +46,11 @@ </component> <component :is="dataItemTag" class="app-name" - :headers="getDataItemHeaders(`app-table-col-name`)" - @click="showAppDetails"> - {{ app.name }} + :headers="getDataItemHeaders(`app-table-col-name`)"> + <router-link class="app-name--link" :to="{ name: 'apps-details', params: { category: category, id: app.id }}" + :aria-label="t('settings', 'Show details for {appName} app', { appName:app.name })"> + {{ app.name }} + </router-link> </component> <component :is="dataItemTag" v-if="!listView" @@ -185,19 +185,6 @@ export default { }, methods: { - async showAppDetails(event) { - if (event.currentTarget.tagName === 'INPUT' || event.currentTarget.tagName === 'A') { - return - } - try { - await this.$router.push({ - name: 'apps-details', - params: { category: this.category, id: this.app.id }, - }) - } catch (e) { - // we already view this app - } - }, prefix(prefix, content) { return prefix + '_' + content }, @@ -217,4 +204,14 @@ export default { .app-image img { width: 100%; } + +.app-name--link::after { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; +} + </style> diff --git a/apps/settings/src/components/AppList/AppScore.vue b/apps/settings/src/components/AppList/AppScore.vue index 0569d687e88..69290645ef9 100644 --- a/apps/settings/src/components/AppList/AppScore.vue +++ b/apps/settings/src/components/AppList/AppScore.vue @@ -21,7 +21,7 @@ --> <template> - <img :src="scoreImage" class="app-score-image"> + <img :src="scoreImage" :alt="t('settings', 'Rating: {score}/10', {score:appScore})" class="app-score-image"> </template> <script> import { imagePath } from '@nextcloud/router' @@ -30,11 +30,13 @@ export default { name: 'AppScore', props: ['score'], computed: { + appScore() { + return Math.round(this.score * 10) + }, scoreImage() { - const score = Math.round(this.score * 10) - const imageName = 'rating/s' + score + '.svg' + const imageName = 'rating/s' + this.appScore + '.svg' return imagePath('core', imageName) - }, + } }, } </script> |