Jump to content


Photo

Emby Dark Themes in different accent colors

theme darkness dark css Color Accent themes web client skin colors

  • Please log in to reply
414 replies to this topic

#41 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 20 March 2016 - 01:17 PM

Make sure to use a dark color like #101010 instead because you'll get this in metadata editor :

 

 

Instead of :

 

 

The light one was my intention  :D I did not recognize the orange on orange...thanks for the hint.


Edited by shorty1483, 20 March 2016 - 02:38 PM.

  • Ben Z likes this

#42 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 20 March 2016 - 02:42 PM

Thanks to @benjidave , @Happy2Play and @rthomas

 

56eeeed908c2c_Admin.jpg56eeeee454555_login.jpg56eeeeec94f23_wall2.jpg56eeeef644856_wall.jpg

Attached Files


Edited by shorty1483, 20 March 2016 - 02:43 PM.

  • Happy2Play, Ben Z and Archon like this

#43 arrbee99 OFFLINE  

arrbee99

    Advanced Member

  • Members
  • 3032 posts
  • Local time: 06:11 PM
  • LocationNew Zealand

Posted 20 March 2016 - 11:53 PM

Add the following lines. This should fix the sorting list (thanks though) :

.paper-radio-button-0 #radioLabel.paper-radio-button {color: #CCCCCC !important;}
I should have mentioned it before, but I only tested my themes in Google Chrome. Which browser are you using? I'm not getting the same thing as you in Chrome.
56ee486540688_screenshot.png
56ee48d0ce729_screenshot2.png

Did you do some modifications from earlier posts by Happy2Play and shorty1483? My screenshots were made by my CSS texts from my original post.

For your channels, unfortunately, I don't use TV with emby. I can't really help you there.

EDIT: Make sure to use the .zip file called "Dark Theme & Colored Highlights V2" if you use Emby Version 3.0.5882.0

 

 

Thanks, that fixed the sorting list.

 

I was using Chrome (and am experimenting with Firefox and Opera at the moment), still getting that Trailer, Sync, triple colon stuff in grey, the rest in transparent.

 

Think the only change made to the theme was to add that code line to show the background in full screen with the transparency adjusted.

 

With the channels thing, it seems to add a thin line to each program row, but not to the actual channel names, but its no biggy.

 

Am using the V2 version.

 

Tried adding the code given by Shorty in Post# 37 (if it was meant for me......), it kind of turned Rotten Tomatoes into a two tone thing....(or was it two tone to begin with. Anyway.

 

56ef702b51e5b_EmbyDarkThemeBug4.jpg



#44 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 20 March 2016 - 11:59 PM

Thanks, that fixed the sorting list.

 

I was using Chrome (and am experimenting with Firefox and Opera at the moment), still getting that Trailer, Sync, triple colon stuff in grey, the rest in transparent.

 

Think the only change made to the theme was to add that code line to show the background in full screen with the transparency adjusted.

 

With the channels thing, it seems to add a thin line to each program row, but not to the actual channel names, but its no biggy.

 

Am using the V2 version.

 

Tried adding the code given by Shorty in Post# 37 (if it was meant for me......), it kind of turned Rotten Tomatoes into a two tone thing....(or was it two tone to begin with. Anyway.

 

56ef702b51e5b_EmbyDarkThemeBug4.jpg

 

No this was a general modification, but I will post a fix for the padding in the evening. Currently at work.


Edited by shorty1483, 21 March 2016 - 12:00 AM.


#45 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 21 March 2016 - 01:34 AM

OP edited:

  • I had too many manual fixes, so I made a V3 and updated all individual themes for people that doesn't want to download the .zip file. The V3 include several minor fixes. I also changed the color icons in a way that you can see when you check one. Issue mentioned in 1st edit fixed.

  • shorty1483 likes this

#46 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 21 March 2016 - 01:45 AM

I was using Chrome (and am experimenting with Firefox and Opera at the moment), still getting that Trailer, Sync, triple colon stuff in grey, the rest in transparent.

 

Think the only change made to the theme was to add that code line to show the background in full screen with the transparency adjusted.

Well, it's supposed to be gray everywhere.

56ef89e531727_1.png

 

Maybe the background transparency adjustment is screwing up somewhere? Download the V3 or any individual theme, I updated them. Try both, without and with the transparency adjustment to see if it's the issue. But honestly, it shouldn't.


Edited by benjidave, 21 March 2016 - 01:46 AM.


#47 arrbee99 OFFLINE  

arrbee99

    Advanced Member

  • Members
  • 3032 posts
  • Local time: 06:11 PM
  • LocationNew Zealand

Posted 21 March 2016 - 04:09 AM

Well, it's supposed to be gray everywhere.

56ef89e531727_1.png

 

Maybe the background transparency adjustment is screwing up somewhere? Download the V3 or any individual theme, I updated them. Try both, without and with the transparency adjustment to see if it's the issue. But honestly, it shouldn't.

 

Doesn't seem to make any difference..... In the three images below, the first image has no CSS theme applied and its still a half n' half thing (presumably the original design). The second has a Version 3 green theme, still the same, and the third image is the Version 3 green theme plus the transparency command / effect, no change. I see also that Shorty's Plex(ish) theme is halfy / halfy.

 

56efabc6e0ee7_EmbyDarkThemeBugremoved.jp

 

56efabe07cb3b_EmbyDarkThemeBugremoved1.j

 

56efabffc9c08_EmbyDarkThemeBugremoved2.j

 

Not sure its worth worrying about ?



#48 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 21 March 2016 - 08:26 AM

Thanks, that fixed the sorting list.

I was using Chrome (and am experimenting with Firefox and Opera at the moment), still getting that Trailer, Sync, triple colon stuff in grey, the rest in transparent.

Think the only change made to the theme was to add that code line to show the background in full screen with the transparency adjusted.

With the channels thing, it seems to add a thin line to each program row, but not to the actual channel names, but its no biggy.

Am using the V2 version.

Tried adding the code given by Shorty in Post# 37 (if it was meant for me......), it kind of turned Rotten Tomatoes into a two tone thing....(or was it two tone to begin with. Anyway.

56ef702b51e5b_EmbyDarkThemeBug4.jpg


.paperList { padding-top: 0px; }

Gesendet von meinem HTC One_M8 mit Tapatalk

#49 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 21 March 2016 - 11:44 AM

Doesn't seem to make any difference..... In the three images below, the first image has no CSS theme applied and its still a half n' half thing (presumably the original design). The second has a Version 3 green theme, still the same, and the third image is the Version 3 green theme plus the transparency command / effect, no change. I see also that Shorty's Plex(ish) theme is halfy / halfy.

 

Not sure its worth worrying about ?

My Emby server is linux based and not windows. There are probably some differences.



#50 Happy2Play OFFLINE  

Happy2Play

    Trial and Error

  • Moderators
  • 16166 posts
  • Local time: 09:11 PM
  • LocationWashington State

Posted 21 March 2016 - 12:29 PM

/* DLNA - Profile - Direct Play section */
ul[data-role="listview"] > li[data-role="list-divider"] {
    background: #101010 !important;}

ul[data-role="listview"] , ul[data-role="listview"] > li{
    border-color: #101010 !important;
}
ui-page-theme-a .ui-body-inherit, html .ui-bar-a .ui-body-inherit, html .ui-body-a .ui-body-inherit, html body .ui-group-theme-a .ui-body-inherit, html .ui-panel-page-container-a {
    background-color: #101010;}


Edited by Happy2Play, 21 March 2016 - 12:29 PM.

  • shorty1483 and Ben Z like this

#51 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 21 March 2016 - 02:14 PM

New Black theme based on @benjidave V3

 

Changes/Addons to stock dark theme

- Orange colors

- black Server Admin GUI and Login Screen

- Black Side Panels

- remove card BG in library view

- semi transparent NowPlaying in Library View

- semi transparent Top Bar

- semi transparent RottenTomatoes rating

- colored buttons in detail view

 

 

56f03a17c2288_test.jpg

Attached Files


  • Ben Z likes this

#52 Happy2Play OFFLINE  

Happy2Play

    Trial and Error

  • Moderators
  • 16166 posts
  • Local time: 09:11 PM
  • LocationWashington State

Posted 24 March 2016 - 11:08 AM

/*Background for dialog pop-up windows*/
.dialog:not(.background-theme-a):not(.background-theme-b) {
    background-color: #282828 important;}

Edited by Happy2Play, 24 March 2016 - 11:24 AM.

  • shorty1483 likes this

#53 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 24 March 2016 - 09:28 PM

/*Background for dialog pop-up windows*/
.dialog:not(.background-theme-a):not(.background-theme-b) {
    background-color: #282828 !important;}

I don't see any change. Can you tell me what this fix does?

 

EDIT: Is it a dev release fix?


Edited by Happy2Play, 25 March 2016 - 10:10 PM.


#54 Happy2Play OFFLINE  

Happy2Play

    Trial and Error

  • Moderators
  • 16166 posts
  • Local time: 09:11 PM
  • LocationWashington State

Posted 24 March 2016 - 10:53 PM

The background of the dialog box appear white without the change, at least for me.  Running primarily beta (5918)

 

56f4a7a0d5f7e_dialog.jpg

 

Without change

56f4a823320b8_dialog2.jpg


Edited by Happy2Play, 24 March 2016 - 10:54 PM.

  • Ben Z likes this

#55 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 25 March 2016 - 12:30 AM

The background of the dialog box appear white without the change, at least for me.  Running primarily beta (5918)

 

56f4a7a0d5f7e_dialog.jpg

 

Without change

56f4a823320b8_dialog2.jpg

A beta issue I guess, it doesn't do that on stable. But good to know.


Edited by benjidave, 25 March 2016 - 12:31 AM.


#56 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 25 March 2016 - 05:26 AM

A beta issue I guess, it doesn't do that on stable. But good to know.

 

Also white default on latest devs.

 

@Happy2Play My Chrome says "invalid property value". You forgot the ! before important in your code :P

/* --- Upper BG when no Backdrop (e.g. Actor Infos) --- */
.noBackdrop {
    height: 170px;
    background: #CC7B19;
    margin-top: 0 !important;
}

56f50e99a7aee_accent.jpg

/* --- Footer Notifications --- */
.footerNotification {
    background-color: #B35A00 !important;
    border-top: #FFFFFF !important;
}

56f50ec16ea2a_footer.jpg

 


Edited by shorty1483, 25 March 2016 - 06:11 AM.


#57 Shrom OFFLINE  

Shrom

    Advanced Member

  • Members
  • 56 posts
  • Local time: 07:11 AM

Posted 26 March 2016 - 03:57 PM

For me, I tried de replace de Logo  and de check inton ( checkmarkgreen.png and mblogoicon.png) with the same name in the right folder but seems doesn't works... 



#58 Ben Z OFFLINE  

Ben Z

    Advanced Member

  • Members
  • 190 posts
  • Local time: 01:11 AM
  • LocationCanada

Posted 26 March 2016 - 04:01 PM

For me, I tried de replace de Logo  and de check inton ( checkmarkgreen.png and mblogoicon.png) with the same name in the right folder but seems doesn't works... 

Did you restart your server? Is it the Windows version?

I'm using linux debian (raspberry pi) for my server and for some reasons, I had to wait few hours or days before the icons changed. I don't know why.



#59 shorty1483 ONLINE  

shorty1483

    Advanced Member

  • Members
  • 1378 posts
  • Local time: 06:11 AM
  • LocationGermany

Posted 26 March 2016 - 04:03 PM

Also e.g. in Chrome I need to delete picture cache.

Gesendet von meinem HTC One_M8 mit Tapatalk

#60 Shrom OFFLINE  

Shrom

    Advanced Member

  • Members
  • 56 posts
  • Local time: 07:11 AM

Posted 26 March 2016 - 04:04 PM

My embryo server runs under Debian 8 and I already restart my server, so if I understand what you said, I think this is a cache problem.


Edited by Shrom, 26 March 2016 - 04:08 PM.






Also tagged with one or more of these keywords: theme, darkness, dark, css, Color, Accent, themes, web client, skin, colors

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users