Alamantus/Lexiconga
1
0
Fork 0
mirror of https://github.com/Alamantus/Lexiconga.git synced 2025-07-08 16:44:16 +02:00
Code Issues Releases Activity

Fix CSS height for details; Update code spacing in PhonologyDisplay

Browse source
This commit is contained in:
Robbie Antenesse 2017-08-21 14:37:26 -06:00 • committed by Robbie Antenesse
parent d49ffa8d94
commit 211cb5f5f9
2 changed files with 61 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

108
src/components/display/DictionaryDetails/DetailsSection/PhonologyDisplay.jsx
View file

@ -15,28 +15,32 @@ export const PhonologyDisplay = ({ phonologyContent }) => {
<div className='column is-half'>
<strong>Consonants:</strong>
<div className='tags'>
{phonologyContent.consonants.map(consonant => {
return (
<span key={`consonant_${ consonant }_${ Date.now().toString() }`}
className='tag'>
{ consonant }
</span>
);
})}
{
phonologyContent.consonants.map(consonant => {
return (
<span key={`consonant_${ consonant }_${ Date.now().toString() }`}
className='tag'>
{ consonant }
</span>
);
})
}
</div>
</div>
<div className='column is-half'>
<strong>Vowels:</strong>
<div className='tags'>
{phonologyContent.vowels.map(vowel => {
return (
<span key={`vowel_${ vowel }_${ Date.now().toString() }`}
className='tag'>
{ vowel }
</span>
);
})}
{
phonologyContent.vowels.map(vowel => {
return (
<span key={`vowel_${ vowel }_${ Date.now().toString() }`}
className='tag'>
{ vowel }
</span>
);
})
}
</div>
</div>
@ -50,14 +54,16 @@ export const PhonologyDisplay = ({ phonologyContent }) => {
<div className='column'>
<strong>Polyphthongs{'\u200B'}/{'\u200B'}Blends:</strong>
<div className='tags'>
{phonologyContent.blends.map(blend => {
return (
<span key={`blend_${ blend }_${ Date.now().toString() }`}
className='tag'>
{ blend }
</span>
);
})}
{
phonologyContent.blends.map(blend => {
return (
<span key={`blend_${ blend }_${ Date.now().toString() }`}
className='tag'>
{ blend }
</span>
);
})
}
</div>
</div>
@ -80,42 +86,48 @@ export const PhonologyDisplay = ({ phonologyContent }) => {
<div className='column is-one-third'>
<strong>Onset:</strong>
<div className='tags'>
{phonologyContent.phonotactics.onset.map(onset => {
return (
<span key={`onset_${ onset }_${ Date.now().toString() }`}
className='tag'>
{ onset }
</span>
);
})}
{
phonologyContent.phonotactics.onset.map(onset => {
return (
<span key={`onset_${ onset }_${ Date.now().toString() }`}
className='tag'>
{ onset }
</span>
);
})
}
</div>
</div>
<div className='column is-one-third'>
<strong>Nucleus:</strong>
<div className='tags'>
{phonologyContent.phonotactics.nucleus.map(nucleus => {
return (
<span key={`onset_${ nucleus }_${ Date.now().toString() }`}
className='tag'>
{ nucleus }
</span>
);
})}
{
phonologyContent.phonotactics.nucleus.map(nucleus => {
return (
<span key={`onset_${ nucleus }_${ Date.now().toString() }`}
className='tag'>
{ nucleus }
</span>
);
})
}
</div>
</div>
<div className='column is-one-third'>
<strong>Coda:</strong>
<div className='tags'>
{phonologyContent.phonotactics.coda.map(coda => {
return (
<span key={`onset_${ coda }_${ Date.now().toString() }`}
className='tag'>
{ coda }
</span>
);
})}
{
phonologyContent.phonotactics.coda.map(coda => {
return (
<span key={`onset_${ coda }_${ Date.now().toString() }`}
className='tag'>
{ coda }
</span>
);
})
}
</div>
</div>

1
src/components/display/DictionaryDetails/DetailsSection/styles.scss
View file

@ -6,6 +6,7 @@
.details-menu,
.details-display {
height: 100%;
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;