add style to results component
This commit is contained in:
parent
953c403f3b
commit
c5b7e13029
3 changed files with 22 additions and 4 deletions
|
@ -13,6 +13,12 @@ div.App {
|
||||||
padding: 0.5em 0;
|
padding: 0.5em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h5 {
|
||||||
|
font-size: 1.1em;
|
||||||
|
padding: 0.1em 0;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
div.PhonoChangeApplier {
|
div.PhonoChangeApplier {
|
||||||
display: grid;
|
display: grid;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
@ -27,7 +27,7 @@ const Output = props => {
|
||||||
<div className="Output" data-testid="Output">
|
<div className="Output" data-testid="Output">
|
||||||
<h3>Results of Run</h3>
|
<h3>Results of Run</h3>
|
||||||
|
|
||||||
<div data-testid="Output-lexicon" className="Output_container">
|
<div data-testid="Output-lexicon" className="Output__container">
|
||||||
{results && results.length ? renderResults() : <></>}
|
{results && results.length ? renderResults() : <></>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,6 +1,18 @@
|
||||||
div.Output-epoch {
|
div.Output {
|
||||||
display: flex;
|
|
||||||
p.lexicon {
|
div.Output__container {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-flow: row wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.Output-epoch {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
|
||||||
|
p.lexicon {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(5em, 1fr));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
Loading…
Reference in a new issue