diff app/views/tweets/index.html.erb @ 117:e3067b426b70

Improved style
author nanaya <me@myconan.net>
date Sun, 12 Feb 2017 17:20:58 +0900
parents 32c8c150cd80
children dc67a2f34fb7
line wrap: on
line diff
--- a/app/views/tweets/index.html.erb	Sun Feb 12 16:59:32 2017 +0900
+++ b/app/views/tweets/index.html.erb	Sun Feb 12 17:20:58 2017 +0900
@@ -35,20 +35,28 @@
     }
 
     .main__footer {
-      padding-bottom: 10px;
+      padding: 5px 0;
+      border-top: 1px solid #000;
     }
 
     .twitter-form {
-      width: 100%;
-      display: flex;
-      align-items: center;
+      text-align: center;
+      background-color: #eee;
+      border: 1px solid #ccc;
+      padding: 10px;
     }
 
     .twitter-form__input {
-      flex: 1;
+      width: 100%;
       margin-right: 5px;
       font-family: "Courier New", monospace;
       font-size: 16px;
+      padding: 5px;
+    }
+
+    .twitter-form__button {
+      margin-top: 10px;
+      padding: 5px 30px;
     }
   </style>
 </head>
@@ -61,21 +69,20 @@
       Not that it matters because either way it works with any RSS readers.
     </p>
 
-    <form class="js-twitter--form twitter-form">
+    <form class="twitter-form">
       <input
         name="id"
         type="text"
         placeholder="Enter Username"
-        class="js-twitter--input twitter-form__input"
+        class="twitter-form__input"
         autofocus
       >
-      <button type="submit">
+      <button type="submit" class="twitter-form__button">
         Go
       </button>
     </form>
   </div>
   <div class="main__footer">
-    <hr>
     <a href="https://bitbucket.org/nanaya1/rsstweet">Source</a>
   </div>
 </body>