Kuker formatting of entries (left panel)
brucou opened this issue · comments
@krasimir another question, I grabbed that there is an indent property that can be used to indent labels in the left panel (used in the MobX emitter) You also give one example with icons
I could not however find out what is used to format the label as the stent emitter does. Here you can see that in the same line, some words are bold, and others are not, implying that label is not necessarily just a text.
Do you have at hand a list of the properties used in Kuker and thier semantics?
Many thanks
Hey @brucou,
here's the component that you are interested in https://github.com/krasimir/kuker/tree/master/src/kuker-ui/components/Dashboard/Handlers/UnrecognizedEvent.js
This is how the event looks like on the left:
<div style={ style } onClick={ onClick } className={ className }>
<TimeDiff timeDiff={ event.timeDiff } parentStyle={ style } />
<div className='actionRowContent'>
<i className={ 'fa ' + icon } style={{ marginRight: '0.5em' }}></i>
<strong>{ label || event.type }</strong>
</div>
</div>
- The icon is a font awesome icon label
- The
style
is just taking the event's.color
prop and is setting is a background.
This is the public API that Kuker offers. There are dedicated components for emitters like Stent and Redux. They are here https://github.com/krasimir/kuker/tree/master/src/kuker-ui/components/Dashboard/Handlers
Absolutely amazing, thanks!