oxaliq/feature-change-applier
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add fonts, standardize textarea size

Browse source
This commit is contained in:
Sorrel Bri 2020-02-26 15:23:39 -08:00
parent 228e31a41a
commit 7f868c5a26
4 changed files with 15 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
public/index.html
View file

@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="%PUBLIC_URL%/stylesheets/reset.css"> <link rel="stylesheet" href="%PUBLIC_URL%/stylesheets/reset.css">
<link href="https://fonts.googleapis.com/css?family=Catamaran|Fira+Code&display=swap" rel="stylesheet">
<title>Phono Change Applier</title> <title>Phono Change Applier</title>
</head> </head>
<body> <body>

5
src/PhonoChangeApplier.scss
View file

@ -8,6 +8,11 @@ div.App {
padding: 1em 0; padding: 1em 0;
} }
h3 {
font-size: 1.25em;
padding: 0.5em 0;
}
div.PhonoChangeApplier { div.PhonoChangeApplier {
display: grid; display: grid;
width: 100%; width: 100%;

5
src/components/ProtoLang.js
View file

@ -3,12 +3,11 @@ import './ProtoLang.scss';
const ProtoLang = ({ lexicon, dispatch }) => { const ProtoLang = ({ lexicon, dispatch }) => {
const getProperty = property => object => object[property]; const getProperty = property => object => object[property];
const renderLexicon = () => { const renderLexicon = () => {
if (!lexicon) return ''; if (!lexicon) return '';
// Code for optionally rendering epoch name with lexeme // Code for optionally rendering epoch name with lexeme
// `\t#${lexeme.epoch.name}` // `\t#${lexeme.epoch.name}`
lexicon.map(getProperty('lexeme')).join('\n'); return lexicon.map(getProperty('lexeme')).join('\n');
} }
return ( return (
@ -18,6 +17,8 @@ const ProtoLang = ({ lexicon, dispatch }) => {
<form data-testid="ProtoLang-Lexicon"> <form data-testid="ProtoLang-Lexicon">
<textarea <textarea
name="lexicon" name="lexicon"
cols="30"
rows="10"
data-testid="ProtoLang-Lexicon__textarea" data-testid="ProtoLang-Lexicon__textarea"
value={renderLexicon()} value={renderLexicon()}
onChange={e=> { onChange={e=> {

12
src/index.scss
View file

@ -2,11 +2,7 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", font-family: 'Catamaran', Arial, Helvetica, sans-serif;
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background-color: map-get($colors, 'main--bg'); background-color: map-get($colors, 'main--bg');
color: map-get($colors, 'main'); color: map-get($colors, 'main');
@ -14,7 +10,11 @@ body {
background-color: map-get($colors, 'text-input--bg'); background-color: map-get($colors, 'text-input--bg');
color: map-get($colors, 'text-input'); color: map-get($colors, 'text-input');
border: 1px solid map-get($colors, 'main'); border: 1px solid map-get($colors, 'main');
font-family: monospace; font-family: 'Fira Code', monospace;
}
code {
font-family: 'Fira Code', monospace;
} }
} }