X-Git-Url: https://git.auder.net/?p=vchess.git;a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FMoveList.vue;h=6f7b4dce56c11c14ab14af828c12f840cacb8af1;hp=c0a15dff6fe8be0eec3b4bc3f74f2dbc354d3fab;hb=feaf1bf73fa8c6054e353585dee0b8a4fdcfbc4e;hpb=1c9826a545b4336ede227c132d7ccfdba70c4ec0 diff --git a/client/src/components/MoveList.vue b/client/src/components/MoveList.vue index c0a15dff..6f7b4dce 100644 --- a/client/src/components/MoveList.vue +++ b/client/src/components/MoveList.vue @@ -15,12 +15,34 @@ div value="50" @input="adjustBoard()" ) - div#boardSizeBtnContainer - button#boardSizeBtn(onClick="window.doClick('modalAdjust')") - | {{ st.tr["Set board size"] }} + #aboveMoves + // NOTE: variants pages already have a "Rules" link on top + span#rulesBtn( + v-if="!$route.path.match('/variants/')" + @click="$emit('showrules')" + ) + | {{ st.tr["Rules"] }} + button.tooltip( + onClick="window.doClick('modalAdjust')" + :aria-label="st.tr['Resize board']" + ) + img.inline(src="/images/icons/resize.svg") + #downloadDiv(v-if="canDownload") + a#download(href="#") + button.tooltip( + @click="$emit('download')" + :aria-label="st.tr['Download'] + ' PGN'" + ) + img.inline(src="/images/icons/download.svg") + button.tooltip( + v-if="canAnalyze" + @click="$emit('analyze')" + :aria-label="st.tr['Analyse']" + ) + img.inline(src="/images/icons/analyse.svg") #scoreInfo(v-if="score!='*'") - p {{ score }} - p {{ st.tr[message] }} + span.score {{ score }} + span.score-msg {{ st.tr[message] }} .moves-list(v-if="!['none','highlight'].includes(show)") .tr(v-for="moveIdx in evenNumbers") .td {{ firstNum + moveIdx / 2 + 1 }} @@ -43,7 +65,9 @@ import { getFullNotation } from "@/utils/notation"; import { processModalClick } from "@/utils/modalClick"; export default { name: "my-move-list", - props: ["moves", "show", "cursor", "score", "message", "firstNum"], + props: [ + "moves", "show", "canAnalyze", "canDownload", + "cursor", "score", "message", "firstNum"], data: function() { return { st: store.state @@ -156,9 +180,34 @@ export default { width: 100% text-align: center -button#boardSizeBtn - margin: 0 - [type="checkbox"]#modalAdjust+div .card padding: 5px + +img.inline + height: 24px + @media screen and (max-width: 767px) + height: 18px + +span.score + display: inline-block + margin-left: 10px + font-weight: bold + +span.score-msg + display: inline-block + margin-left: 10px + font-style: italic + +#downloadDiv + display: inline-block + margin: 0 + +span#rulesBtn + cursor: pointer + display: inline-block + margin: 0 10px + font-weight: bold + +button + margin: 0