diff --git a/static/style/video.css b/static/style/video.css index 6b41ff4..077f773 100644 --- a/static/style/video.css +++ b/static/style/video.css @@ -22,13 +22,20 @@ button { .media-card button { display: inline-block; padding: 10px 15px; + margin: 1rem; text-decoration: none; border-radius: 4px; } -.new-transcode button { - background-color: green; +.media-card a { + display: inline-block; + padding: 10px 15px; + margin: 1rem; + margin-bottom: 0; + background-color: #007bff; color: white; + text-decoration: none; + border-radius: 4px; } .media-card h3 { @@ -38,6 +45,24 @@ button { background-color: #f8f8f8; } +.new-transcode form { + display: flex; + flex-direction: column; +} + +.new-transcode .selects { + display: flex; + flex-direction: row; +} + +.new-transcode select { + padding: 0.5rem; + border-radius: 4px; + border: 1px solid #ccc; + flex-grow: 1; + margin: 1rem; +} + .audio-container audio { width: 100%; } @@ -49,30 +74,20 @@ button { margin: 0 auto; } -.media-download { - padding: 15px; +.media-buttons { text-align: center; } -.media-download a { - display: inline-block; - padding: 10px 15px; - background-color: #007bff; - color: white; - text-decoration: none; - border-radius: 4px; -} - -.media-controls { - text-align: center; - padding-bottom: 15px; -} - -.media-controls button { +.delete-button { background-color: red; color: white; } +.transcode-button { + background-color: green; + color: white; +} + /* narrower than 600px */ @media (max-width: 600px) { .media-grid { diff --git a/templates/video.html b/templates/video.html index dad204c..106d9f2 100644 --- a/templates/video.html +++ b/templates/video.html @@ -24,29 +24,40 @@ Your browser does not support the video tag. -
- {{if ne .Source "original"}} -