diff --git a/src/App.css b/src/App.css
index 43a0dd4..3866309 100644
--- a/src/App.css
+++ b/src/App.css
@@ -9,15 +9,19 @@ body {
text-align: center;
margin: 0;
padding: 0;
-
+ font-weight: normal;
margin-top: 20em;
background-image: url("http://www.powerkoream.co.kr/news/photo/201412/1102039_1308_2456.jpg");
background-repeat: no-repeat;
background-size: 100%;
}
-h2 {
+h2,
+h3 {
+ font-size: 30px;
font-weight: normal;
+ color: rgb(187, 187, 255);
+ -webkit-text-stroke: 1px black;
}
.vignette {
@@ -50,7 +54,7 @@ label {
input[type="text"] {
width: 20%;
- font-size: 50px;
+ font-size: 40px;
color: white;
border: 1px solid #ccc;
box-sizing: border-box;
diff --git a/src/components/Description.jsx b/src/components/Description.jsx
index 7abb3d7..5764bcd 100644
--- a/src/components/Description.jsx
+++ b/src/components/Description.jsx
@@ -1,7 +1,7 @@
-import React, {Component} from "react";
-import {inject, observer} from "mobx-react";
+import React, { Component } from "react";
+import { inject, observer } from "mobx-react";
-@inject('userInput')
+@inject("userInput")
@observer
class Description extends Component {
constructor(props) {
@@ -10,9 +10,23 @@ class Description extends Component {
}
render() {
- const {userInput} = this.props;
- return (
당신의 돈 국밥으로 환산해보셨습니까?
- 당신이 알고싶은 국밥가 : {userInput.price}
);
+ const { userInput } = this.props;
+ let gookbab = userInput.price / 5000;
+ let chicken = userInput.price / 16000;
+ return (
+
+
당신의 돈 국밥으로 환산해보셨습니까?
+ 당신이 알고싶은 국밥가 : {gookbab}
+
+ 고것은{" "}
+
+ {" "}
+ {chicken}{" "}
+ {" "}
+ 치킨이구연{" "}
+
+
+ );
}
}
diff --git a/src/components/PriceForm.jsx b/src/components/PriceForm.jsx
index cc3af2d..907b121 100644
--- a/src/components/PriceForm.jsx
+++ b/src/components/PriceForm.jsx
@@ -1,8 +1,8 @@
-import {userInput} from "../store";
-import {inject, observer} from "mobx-react/dist/mobx-react";
-import React, {Component} from "react";
+import { userInput } from "../store";
+import { inject, observer } from "mobx-react/dist/mobx-react";
+import React, { Component } from "react";
-@inject('userInput')
+@inject("userInput")
@observer
class PriceForm extends Component {
constructor(props) {
@@ -13,36 +13,35 @@ class PriceForm extends Component {
}
handleChange(event) {
- const {userInput} = this.props;
+ const { userInput } = this.props;
userInput.setPrice(event.target.value);
}
handleSubmit(event) {
- const {userInput} = this.props;
- let gookbabCount = parseInt(userInput.price, 10);
-
- const converted = gookbabCount / 5000;
- alert("고것은 " + converted + " 국밥이네요.");
+ const { userInput } = this.props;
+ userInput.price = "";
event.preventDefault();
}
render() {
- const {userInput} = this.props;
- return (
-
-
)
+ const { userInput } = this.props;
+ return (
+
+
+
+ );
}
}
-export default PriceForm;
\ No newline at end of file
+export default PriceForm;
diff --git a/src/jsconfig.json b/src/jsconfig.json
new file mode 100644
index 0000000..504cd64
--- /dev/null
+++ b/src/jsconfig.json
@@ -0,0 +1,5 @@
+{
+ "compilerOptions": {
+ "experimentalDecorators": true
+ }
+}