update new style

akiicat · Apr 28, 2017 · 663a450 · 663a450
1 parent 34e8d55
commit 663a450
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 18 deletions.
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
@@ -2,7 +2,7 @@ class YoutubeRetriever extends React.Component {
   constructor(props){
     super(props);
     this.state = {};
-    this.video = {}
+    this.video = {};
   }
 
   getVideoId() {
@@ -49,33 +49,21 @@ class YoutubeRetriever extends React.Component {
   }
 
   renderStreams(streams, selector) {
-    let titles = ["", "container"]
-    if (selector != 'audio only') { titles.push("video resolution") }
-    if (selector != 'video only') { titles.push("audio encoding") }
-
     streams = streams.filter((stream) => {
       return stream.comment == selector
     })
 
     selector = (selector == "default") ? 'VIDEO + AUDIO' : selector.toUpperCase();
 
     return React.createElement('div', {},
+      React.createElement('hr', {}, null),
       React.createElement('h2', { className: 'text-center' }, selector),
       React.createElement('table', {},
-        React.createElement('thead', {}, this.renderStreamsHead(titles)),
         React.createElement('tbody', {}, this.renderStreamsBody(streams))
       )
     )
   }
 
-  renderStreamsHead(titles) {
-    return React.createElement('tr', {},
-      titles.map((title) => {
-        return React.createElement('th', {}, title)
-      })
-    )
-  }
-
   renderStreamsBody(streams) {
     return streams.map((stream) => {
       return React.createElement('tr', {},
@@ -84,8 +72,8 @@ class YoutubeRetriever extends React.Component {
           React.createElement('a', { href: stream.url, target: '_blank' }, 'Download')
         ),
         React.createElement('td', {}, stream.container),
-        React.createElement('td', {}, stream.video_resolution || stream.audio_encoding),
-        React.createElement('td', {}, (stream.video_resolution) ? stream.audio_encoding : null)
+        React.createElement('td', {}, stream.video_resolution),
+        React.createElement('td', {}, stream.audio_encoding)
       )
     })
   }

diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
@@ -27,10 +27,14 @@ h1, h2, h3, h4, h5, h6, div, p, table, a {
 }
 
 a {
-  font-weight: bold;
   text-decoration: none;
 }
 
+a:hover {
+  font-weight: bold;
+  text-decoration: underline;
+}
+
 body {
   background-color: #006570;
 }
@@ -47,6 +51,14 @@ input, button {
   font-size: 16px;
 }
 
+table {
+  width: 100%;
+}
+
+td {
+  width: 25%;
+}
+
 .container {
   position: relative;
   margin: 20px auto;
@@ -63,7 +75,7 @@ input, button {
 }
 
 #response-content table, #response-content a {
-  text-align: right;
+  text-align: center;
   color: white;
 }