Mirrors/gamebrary
2
0
Fork 0
mirror of https://github.com/romancm/gamebrary synced 2025-02-17 11:38:24 +00:00
Code Issues Projects Releases Packages Wiki Activity

Game details UI updates

Browse source
This commit is contained in:
Roman Cervantes 2019-09-26 11:33:30 -07:00
parent 959e597759
commit 4a446c3d7e
4 changed files with 48 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
src/components/GameDetail/GameReviewBox.vue → src/components/GameDetail/GameDetails.vue
View file

17
src/components/GameNotes.vue
View file

@ -1,5 +1,7 @@
<template lang="html">
<div class="game-notes" :class="{ dark: darkModeEnabled }">
<h4>{{ $t('notes.notes') }}</h4>
<div
class="note"
v-if="hasNote && !editingNote"
@ -35,7 +37,7 @@
@shortkey="reset"
@click="reset"
>
{{ $t('cancel') }}
{{ $t('global.cancel') }}
</button>
<button
@ -54,15 +56,14 @@
@click="saveNote"
:disabled="!localNote"
>
{{ $t('save') }}
{{ $t('global.save') }}
</button>
</div>
</div>
</div>
<button
class="warning small hollow"
class="warning hollow"
v-shortkey="['ctrl', 'alt', 'n']"
@shortkey="addNote"
@click="addNote"
@ -156,6 +157,14 @@ export default {
<style lang="scss" rel="stylesheet/scss" scoped>
@import "~styles/styles";
.game-notes {
margin-top: $gp;
}
h4 {
padding-bottom: $gp / 2;
}
.dark .note {
border-color: $color-gray;

5
src/i18n/en.json
View file

@ -50,7 +50,7 @@
"gamePlatforms": "Also available for:",
"developers": "Developer",
"publishers": "Publishers",
"removeFromList": "Remove from list",
"removeFromList": "Remove",
"links": {
"official": "Official Site",
"wikia": "Fandom",
@ -167,6 +167,7 @@
"addToIGDB": "Add it to IGDB"
},
"notes": {
"addNote": "Add note"
"addNote": "Add note",
"notes": "Notes"
}
}

59
src/pages/GameDetail.vue
View file

@ -13,26 +13,7 @@
{{ platform.name }}
<game-rating :rating="game.rating" />
<div class="actions" v-if="list.games.includes(game.id)">
<button
class="error small hollow"
v-shortkey="['del']"
@shortkey="removeGame"
@click="removeGame"
>
<i class="far fa-trash-alt delete-game" />
{{ $t('gameDetail.removeFromList')}}
</button>
<div class="tags" v-if="hasTags">
<button class="primary hollow small" @click="openTags">
<i class="fas fa-tag" />
{{ $t('tags.addTag') }}
</button>
</div>
</div>
<br>
<p class="game-description" v-html="game.summary" />
<tag
v-if="games.includes(game.id)"
@ -45,10 +26,34 @@
@close="removeTag(name)"
/>
<p class="game-description" v-html="game.summary" />
<game-review-box />
<div class="actions">
<button
v-if="list.games.includes(game.id)"
class="error hollow"
v-shortkey="['del']"
@shortkey="removeGame"
@click="removeGame"
>
<i class="far fa-trash-alt delete-game" />
{{ $t('gameDetail.removeFromList')}}
</button>
<button class="success hollow" v-else>
{{ $t('list.addGame') }}
</button>
<div class="tags" v-if="hasTags">
<button class="primary hollow" @click="openTags">
<i class="fas fa-tag" />
{{ $t('tags.addTag') }}
</button>
</div>
</div>
<game-notes />
<game-review-box />
</div>
</div>
@ -70,7 +75,7 @@ import GameScreenshots from '@/components/GameDetail/GameScreenshots';
import GameNotes from '@/components/GameNotes';
import GameRating from '@/components/GameDetail/GameRating';
import GameVideos from '@/components/GameDetail/GameVideos';
import GameReviewBox from '@/components/GameDetail/GameReviewBox';
import GameDetails from '@/components/GameDetail/GameDetails';
import IgdbCredit from '@/components/IgdbCredit';
import GameDetailPlaceholder from '@/components/GameDetail/GameDetailPlaceholder';
import firebase from 'firebase/app';
@ -87,7 +92,7 @@ export default {
GameScreenshots,
GameNotes,
GameVideos,
GameReviewBox,
GameDetails,
GameDetailPlaceholder,
},
@ -302,9 +307,9 @@ export default {
display: flex;
align-items: center;
margin-top: $gp;
}
.tags {
margin-left: $gp;
button {
margin-right: $gp;
}
}
</style>