action info styling

This commit is contained in:
Val Erastov 2018-01-26 20:28:14 -08:00
parent 920fbce6bb
commit b3149f74bc
3 changed files with 25 additions and 5 deletions

View file

@ -75,7 +75,7 @@ export default class Bus {
}
dispatch(key, data) {
console.log('dispatch: ' + key + ' -> ' + JSON.stringify(data));
// console.log('dispatch: ' + key + ' -> ' + JSON.stringify(data));
if (this.lock.has(key)) {
console.warn('recursive dispatch');

View file

@ -12,9 +12,9 @@ function ActionInfo({actionId, x, y, info, hint, hotKey}) {
return <AuxWidget visible={visible}
left={x} top={y} className={ls.root} zIndex={550}>
{visible && <Fragment>
<div className='hint'>{hint}</div>
<div className='info'>{info}</div>
{hotKey && <div className='hotKey'>hotkey: {hotKey}</div>}
{hint && <div className={ls.hint}>{hint}</div>}
{info && <div className={ls.info}>{info}</div>}
{hotKey && <div className={ls.hotKey}>hotkey: {hotKey}</div>}
</Fragment>}
</AuxWidget>;
}

View file

@ -1,4 +1,24 @@
@import "~ui/styles/theme";
.root {
display: flex;
pointer-events:none;
}
padding: 2px 5px;
max-width: 400px;
color: @font-color-minor;
& > * {
padding: 3px 0;
}
white-space: nowrap;
}
.hotKey {
text-align: right;
font-style: italic;
color: @font-color-suppressed;
}
.hint {
font-style: italic;
color: #E1A4A4;
}