Fix themes using dark background with me_js

2018-02-27 20:01:17 +01:00
parent d1e190af0c
commit b259f32bc4
22 changed files with 49 additions and 41 deletions
@@ -6,7 +6,7 @@
 * Icons used are released under Creative Commons.
 * Heading icons are part of the Albook icon pack created by Laurent Baumann (http://lbaumann.com/)
 * Main theme icon part of itunes icon pack created by Michael Flarup (http://pixelresort.com)
- * 
+ *
 *
 * Edited for BUUF Theme by Fractal Systems
 * BUUF artwork: Based on icons by Paul Davey aka Mattahan. All rights reserved.
@@ -109,4 +109,3 @@ body {
    margin: 5px;
    padding: 5px;
 }
-
@@ -105,4 +105,3 @@ body {
    margin: 5px;
    padding: 5px;
 }
-
@@ -1,3 +1,2 @@
+@import "default-without-mediaelement.css";
@import "mediaelement-light.css";
-@import "default-without-mediaelement-light.css";
-
@@ -87,4 +87,4 @@ html {

 label, p {
 	color: #CCC;
-}
+}
@@ -99,4 +99,4 @@ html {

 label, p {
 	color: #CCC;
-}
+}
@@ -80,4 +80,3 @@ input, select {
 .albumComment, .log {
    font-size: 12pt;
 }
-
@@ -14,4 +14,3 @@ body {
 .detail, .albumComment, .log {
    font-size: 12pt;
 }
-
@@ -4,7 +4,8 @@
 * Author: Jeebs (Fisher Evans)
 */

-@import "default-without-mediaelement-light.css";
+@import "default-without-mediaelement.css";
+@import "mediaelement-dark.css";

 table {
 	color: #a3a3a3;
@@ -87,4 +87,4 @@ body {
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:bottom right;
-}
+}
@@ -13,9 +13,9 @@
 */

 .context-menu-list {
-    margin:0; 
+    margin:0;
    padding:0;
-    
+
    min-width: 120px;
    max-width: 250px;
    display: inline-block;
@@ -24,13 +24,13 @@
    
    border: 1px solid #DDD;
    background: #EEE;
-    
+
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
       -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
        -ms-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
         -o-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
-    
+
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
 }
@@ -85,7 +85,7 @@
 /* icons
    #protip:
    In case you want to use sprites for icons (which I would suggest you do) have a look at
-    http://css-tricks.com/13224-pseudo-spriting/ to get an idea of how to implement 
+    http://css-tricks.com/13224-pseudo-spriting/ to get an idea of how to implement
    .context-menu-item.icon:before {}
 */
 .context-menu-item.icon { min-height: 18px; background-repeat: no-repeat; background-position: 4px 2px; }
@@ -115,7 +115,7 @@
 .context-menu-input > label > select {
    display: block;
    width: 100%;
-    
+
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
@@ -0,0 +1,11 @@
+.mejs__container {
+  background: transparent;
+}
+
+.mejs__container .me_cannotplay a {
+  background: transparent;
+}
+
+.mejs__controls:not([style*="display: none"]) {
+  background: transparent;
+}
@@ -1,4 +1,3 @@
-
 .mejs__overlay-loading-bg-img {
    background-image: url("mejs-controls-dark.svg");
 }
@@ -12,15 +11,15 @@
 }

 .mejs__container {
-    background: #F1F1F1;
+  background: transparent;
 }

 .mejs__container .me_cannotplay a {
-    color: #F1F1F1;
+  background: transparent;
 }

 .mejs__controls:not([style*="display: none"]) {
-    background: #F1F1F1;
+  background: transparent;
 }

 .mejs__time {
@@ -4,7 +4,8 @@
 * Author: Sindre Mehus
 */

-@import "default-without-mediaelement-light.css";
+@import "default-without-mediaelement.css";
+@import "mediaelement-dark.css";

 /* The primary background color. */
 .bgcolor1, table.music tr:nth-of-type(even) {
@@ -88,4 +88,4 @@ body {
    padding: 5px;
    color: #FFFFFF;
    background-color: #C0C0C0;
-}
+}
@@ -4,7 +4,8 @@
 * Author: David D ddavis1@gmail.com
 */

-@import "default-without-mediaelement-light.css";
+@import "default-without-mediaelement.css";
+@import "mediaelement-dark.css";

 /* The primary background colour. */
 .bgcolor1, table.music tr:nth-of-type(even) {
@@ -107,4 +108,4 @@ body {

 label, p {
 	color: #CCC;
-}
+}
@@ -88,4 +88,4 @@ html {

 label, p {
 	color: #CCC;
-}
+}
@@ -87,4 +87,4 @@ html {

 label, p {
 	color: #CCC;
-}
+}
@@ -85,4 +85,4 @@ html {

 label, p {
 	color: #696969;
-}
+}
@@ -74,4 +74,4 @@ a:hover, a:hover * {

 label, p {
 	color: #CCC;
-}
+}
@@ -75,4 +75,4 @@ a:hover, a:hover * {

 label, p {
 	color: #696969;
-}
+}
@@ -79,7 +79,7 @@ a:hover, a:hover * {
 /* Selected Headers. */
 .headerSelected {
    color: #FFDA23;
-    text-shadow: 0.1em 0.1em 0.2em grey;    
+    text-shadow: 0.1em 0.1em 0.2em grey;
    background-color: transparent;
    border: 0px
 }
@@ -133,11 +133,11 @@ a:hover, a:hover * {
 }
 ::-webkit-scrollbar-button {
    display:none;
-    background: 
+    background:
        -webkit-gradient(
-        linear, 
-        0 0, 
-        100% 0, 
+        linear,
+        0 0,
+        100% 0,
        from(#464646),
        to(#383838)
        );
@@ -155,12 +155,12 @@ a:hover, a:hover * {
 ::-webkit-scrollbar-thumb:horizontal{
    height: 12px;
    -webkit-border-radius:12px;
-    background: 
+    background:
        -webkit-gradient(
-        linear, 
-        0 0, 
-        0 100%, 
-        from(rgba(0,0,0,0.1)), 
+        linear,
+        0 0,
+        0 100%,
+        from(rgba(0,0,0,0.1)),
        to(rgba(0,0,0,0.25))
        );
    border: 6px solid transparent;
@@ -177,4 +177,4 @@ a:hover, a:hover * {
    background: -webkit-linear-gradient(top, rgba(255,255,255,.1), rgba(255,255,255,.1)) 0 0 repeat, url(images/webkit-arrows-vert.png) -19px 50% no-repeat, #bfb6a3 url(images/bg-blog-repeat.png) 0 0 no-repeat;
    background: linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)) 0 0 repeat, url(images/webkit-arrows-vert.png) -19px 50% no-repeat, #bfb6a3 url(images/bg-blog-repeat.png) 0 0 no-repeat;
    -webkit-border-radius: 0 0 6px 0;
-}
+}