keyboard hint in study gamebook

This commit is contained in:
Thibault Duplessis 2018-03-16 10:14:42 -05:00
parent 6c27b7c554
commit 0a74d1f926
2 changed files with 17 additions and 4 deletions

View file

@ -138,6 +138,19 @@
.gb_buttons .button { .gb_buttons .button {
margin-left: 10px; margin-left: 10px;
} }
.gb_play kbd {
padding: 4px 5px;
margin: 15px auto 0 auto;
font-family: monospace;
font-size: 12px;
line-height: 10px;
color: #444;
background-color: #fcfcfc;
border: solid 1px #ccc;
border-bottom-color: #bbb;
border-radius: 3px;
box-shadow: inset 0 -1px 0 #bbb;
}
body.dark .gb_play .comment, body.dark .gb_play .comment,
body.dark .gb_play .comment::after { body.dark .gb_play .comment::after {

View file

@ -2,7 +2,7 @@ import { h } from 'snabbdom'
import { VNode } from 'snabbdom/vnode' import { VNode } from 'snabbdom/vnode'
import { Hooks } from 'snabbdom/hooks' import { Hooks } from 'snabbdom/hooks'
import GamebookPlayCtrl from './gamebookPlayCtrl'; import GamebookPlayCtrl from './gamebookPlayCtrl';
import { bind, dataIcon, enrichText, innerHTML } from '../../util'; import { bind, dataIcon, iconTag, enrichText, innerHTML } from '../../util';
import { State } from './gamebookPlayCtrl'; import { State } from './gamebookPlayCtrl';
const defaultComments = { const defaultComments = {
@ -53,14 +53,14 @@ function renderFeedback(ctrl: GamebookPlayCtrl, state: State) {
if (fb === 'bad') return h('div.feedback.act.bad' + (state.comment ? '.com' : ''), { if (fb === 'bad') return h('div.feedback.act.bad' + (state.comment ? '.com' : ''), {
hook: bind('click', ctrl.retry) hook: bind('click', ctrl.retry)
}, [ }, [
h('i', { attrs: dataIcon('P') }), iconTag('P'),
h('span', 'Retry') h('span', 'Retry')
]); ]);
if (fb === 'good' && state.comment) return h('div.feedback.act.good.com', { if (fb === 'good' && state.comment) return h('div.feedback.act.good.com', {
hook: bind('click', ctrl.next) hook: bind('click', ctrl.next)
}, [ }, [
h('i', { attrs: dataIcon('G') }), h('span.text', { attrs: dataIcon('G') }, 'Next'),
h('span', 'Next') h('kbd', '<space>')
]); ]);
if (fb === 'end') return renderEnd(ctrl); if (fb === 'end') return renderEnd(ctrl);
return h('div.feedback.info.' + fb + (state.init ? '.init' : ''), return h('div.feedback.info.' + fb + (state.init ? '.init' : ''),