binhong
/
breakups-webapp
1
0
Fork 0
Code Issues 1 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Fixed non-webkit UI

master
BinHong Lee 6 years ago
parent
f3266258a1
commit
c4c10b5087
3 changed files with 23 additions and 8 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +4
    -4
      public/index.html
  2. +15
    -0
      src/App.css
  3. +4
    -4
      src/Components/People.js

+ 4
- 4
public/index.html View File

@@ -10,8 +10,8 @@
<title>Breakups</title>
</head>
<header style="position: fixed; width: 100%; text-align: center; background-color: #222; height: 90px; left: 0px; top: 0px; right: 0px; color: white;">
<h1 style="top: 10px; bottom: 0px; -webkit-margin-before: 10px; -webkit-margin-after: 0px; font-family: 'PT Sans'">Breakups</h1>
<h4 style="top: 5px; -webkit-margin-before: 5px; font-family: 'PT Sans'">Split bills among multiple people.</h3>
<h1 style="margin-top: 10px; margin-bottom: 0px; -webkit-margin-before: 10px; -webkit-margin-after: 0px; font-family: 'PT Sans'">Breakups</h1>
<h4 style="margin-top: 5px; -webkit-margin-before: 5px; font-family: 'PT Sans'">Split bills among multiple people.</h3>
</header>
<body>
<noscript>
@@ -20,7 +20,7 @@
<div id="root"></div>
</body>
<footer style="position: fixed; bottom: 0px; left: 0px; text-align: center; width:100%; background-color: #222; height: 85px; color: white;">
<h3 style="bottom: 0px; -webkit-margin-after: 0px; font-family: 'PT Sans'">Made by <a href="https://binhonglee.github.io/" style="color:#04B45F">@binhonglee</a>. <a href="https://github.com/binhonglee/breakups-webapp" style="color:cyan">GitHub</a></h3>
<h5 style="top: 5px; -webkit-margin-before: 5px; font-family: 'PT Sans'">Icons made by <a href="http://www.freepik.com" title="Freepik" style="color:cyan">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon" style="color:cyan">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank" style="color:cyan">CC 3.0 BY</a></h5>
<h3 style="margin-bottom: 0px; -webkit-margin-after: 0px; font-family: 'PT Sans'">Made by <a href="https://binhonglee.github.io/" style="color:#04B45F">@binhonglee</a>. <a href="https://github.com/binhonglee/breakups-webapp" style="color:cyan">GitHub</a></h3>
<h5 style="margin-top: 5px; -webkit-margin-before: 5px; font-family: 'PT Sans'">Icons made by <a href="http://www.freepik.com" title="Freepik" style="color:cyan">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon" style="color:cyan">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank" style="color:cyan">CC 3.0 BY</a></h5>
</footer>
</html>

+ 15
- 0
src/App.css View File

@@ -23,3 +23,18 @@
.PaymentChain {
margin-bottom: 80px;
}

.personInput {
float: right;
width: 100px;
height: 0.9em;
}

p {
margin: 0px;
}

.personNum {
line-height: 0.5em;
margin: 10px;
}

+ 4
- 4
src/Components/People.js View File

@@ -4,11 +4,11 @@ class People extends Component {
render() {
return (
<div className="People">
<p style={{'line-height': '0.5em'}}>Person {this.props.people} <br/></p>
<p className="personNum">Person {this.props.people} <br/></p>
<form style={{textAlign:'left'}}>
Name: <input type = "text" ref="name" onBlur={this.updateProps.bind(this)} style={{float:'right', width: 100}}/><br/>
Email: <input type = "text" ref="email" onBlur={this.updateProps.bind(this)} style={{float:'right', width: 100}}/><br/>
Amount: <input type = "text" ref="amount" onBlur={this.updateProps.bind(this)} style={{float:'right', width: 100}}/><br/>
<p>Name: <input className="personInput" type = "text" ref="name" onBlur={this.updateProps.bind(this)}/><br/></p>
<p>Email: <input className="personInput" type = "text" ref="email" onBlur={this.updateProps.bind(this)}/><br/></p>
<p>Amount: <input className="personInput" type = "text" ref="amount" onBlur={this.updateProps.bind(this)}/><br/></p>
</form>
</div>
);


Write Preview
Loading…
Cancel
Save