Add styles to weather page

Author: Mark Sauter

app/components/Weather.jsx

@@ -48,15 +48,15 @@ class Weather extends React.Component {
 
     function renderMessage () {
       if (isLoading) {
-        return <h3>Fetching weather...</h3>;
+        return <h3 className="text-center">Fetching weather...</h3>;
       } else if (temp && location) {
         return <WeatherMessage location={location} temp={temp}/>;
       }
     }
 
     return (
       <div>
-        <h2>Get Weather</h2>
+        <h1 className="text-center">Get Weather</h1>
         <WeatherForm onSearch={this.handleSearch}/>
         {renderMessage()}
       </div>

app/components/WeatherForm.jsx

@@ -19,7 +19,7 @@ var WeatherForm = React.createClass({
       <div>
         <form onSubmit={this.onFormSubmit}>
           <input type="text" ref="location" placeholder="Enter city name"/>
-          <button>Get Weather</button>
+          <button className="button expanded hollow">Get Weather</button>
         </form>
       </div>
     );

app/components/WeatherMessage.jsx

@@ -3,7 +3,7 @@ var React = require('react');
 var WeatherMessage = ({temp, location}) => {
   return (
     <div>
-      <h3>It's {temp} in {location}.</h3>
+      <h3 className="text-center">It's {temp} in {location}.</h3>
     </div>
   );
 };