]> git.plutz.net Git - serve0/blobdiff - templates/common.css.sh
bugfixes and visual fixes in player control
[serve0] / templates / common.css.sh
index 62eaabb30f96455b5d2d8ae8564e3f54c15be1b7..3ab88702e543141cbdc8135a066f9364d0685b56 100755 (executable)
@@ -53,6 +53,7 @@ textarea {
 .info.tag {
   line-height: 1.6em;
   background-color: #DBB;
+  margin-right: -.75ex;
 }
 
 .pagination_nav {
@@ -289,10 +290,13 @@ a.panel {
 }
 .panel#preferences > input { display: block; }
 
+#videoview h1, 
+#playctl h1 { font-size: 1.25em;}
 #videoview h1, #videoview > a,
 #playctl h1, #playctl > a {
   display: inline-block;
   margin-right: 1em;
+  padding: 0; margin: .5em 0;
 }
 #videoview video {
   display: block;
@@ -304,20 +308,34 @@ a.panel {
 #playctl form button {
   display: inline-block;
   height: 100%;
-  min-height: 2em;
-  margin: 0 -.75ex 2em 0;
+  min-height: 4em;
+  margin: 0 -.75ex .5em 0;
   background-color: #EEE;
   border: 1px solid #333;
-  max-width: 4em;
   vertical-align: bottom;
+  padding-top: 1em;
 }
-#playctl form button[name="ctl"] { width: 16%;}
-#playctl form button[name="amp"] { width: 15%;}
-#playctl form button[name="vol"] { width: 3%; min-height: 1em;}
+#playctl form button[name="seek"],
+#playctl form button[name="ctl"] { width: 40%;}
+#playctl form button[name="amp"] { width: 40%; margin-top: 2em;}
+#playctl form button[name="vol"] { width: 5%; min-height: 1em;}
 #playctl form button[name="vol"].selected { background-color: #FA6;}
 #playctl form button[name="vol"][value="100"],
 #playctl form button[name="vol"][value="0"] { width: 6%;}
 
+@media (min-width: 460px){
+  #playctl form button {
+    max-width: 4em;
+    min-height: 2em;
+    padding-top: 0em;
+    margin-bottom: 2em;
+  }
+  #playctl form button[name="seek"],
+  #playctl form button[name="ctl"] { width: 16%;}
+  #playctl form button[name="amp"] { width: 15%;}
+  #playctl form button[name="vol"] { width: 3%;}
+  #playctl form button[name="amp"] + br {display: none;}
+}
 EOF
 
 # vi:set filetype=css: