Jump to content

Emby Dark Themes in different accent colors


Ben Z

Recommended Posts

CBers

Hello @@Ben Z,

 

Unfortunately, this line;

@import url('https://rawgit.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/BLUE/theme.css');

does NOT work with the latest Emby server version 3.2.27. Could you tell me what I can do to make it work?

 

best regards

Tommy

Do you have both import commands?

 

See here:

 

https://emby.media/community/index.php?/topic/28743-emby-dark-themes-in-different-accent-colors/page-18&do=findComment&comment=472013

  • Like 1
Link to comment
Share on other sites

I'll update stable later today. Beta themes should work with stable at the moment.

 

EDIT: Updated

Edited by Ben Z
  • Like 1
Link to comment
Share on other sites

Since 3.2.27.0 (or a few weeks ago for beta), you now need to use 2 url imports, one for accent colors and one for dark colors. See here for more details.

Link to comment
Share on other sites

CarlosLima

Hello, with stable version 3.2.27.0, I realized that some things have broken, colors changed to lighter (before totally dark) and I did not understand what I need to do to have as it always was.

Link to comment
Share on other sites

Hello, with stable version 3.2.27.0, I realized that some things have broken, colors changed to lighter (before totally dark) and I did not understand what I need to do to have as it always was.

 

You might not need them anymore. Just use the new themes feature under user display settings.

  • Like 1
Link to comment
Share on other sites

CarlosLima

You might not need them anymore. Just use the new themes feature under user display settings.

Ah, is it true?

So if I understand correctly, it will no longer be necessary to use the dark theme of this topic, since it is possible to choose the theme natively in Emby Server, or am I making some confusion with its information ??
Link to comment
Share on other sites

CarlosLima

Yes try it out.

 

Done. I found it beautiful and now each user can decide which theme to use. Good idea, congratulations.

  • Like 1
Link to comment
Share on other sites

They will also work on iOS and Android as soon as those apps are updated. And soon Emby Theater as well. You have to set the theme on each device.

  • Like 1
Link to comment
Share on other sites

CarlosLima

They will also work on iOS and Android as soon as those apps are updated. And soon Emby Theater as well. You have to set the theme on each device.

 

Yes, I understood perfectly, thank you.
Taking advantage of the Emby Server login screen. Today I found in the forum a MOD login screen for the Emby Theater. Would it be possible to transport it to the Emby Server using CSS ??
 
5992246a68449_Capturar.jpg
Edited by CarlosLima
Link to comment
Share on other sites

Baenwort

Is there a way to get the prior version of a .css for those of us running FreeNAS? We're still on .26 and it doesn't support the new themeing split well. (dashboard is a mix of light and dark with both .css files in the branding area)

 

In particular I'd like the dark green version from before the split. At least until the plugin is updated.

Link to comment
Share on other sites

Baenwort

Is there a way to get the prior version of a .css for those of us running FreeNAS? We're still on .26 and it doesn't support the new themeing split well. (dashboard is a mix of light and dark with both .css files in the branding area)

 

In particular I'd like the dark green version from before the split. At least until the plugin is updated.

 

So I figured out how github works.  

 

If you just need the old green like me here is the direct: https://raw.githubusercontent.com/BenZuser/Emby-Web-Dark-Themes-CSS/826aa28744b63f081a32334f2a84c4955d34b800/GREEN/theme.css 

 

If you need some other old color version you need to click on the black button in the black bar at the top of the landing page and "View on Github (Stable)" then click into the folder of the color you want. You then need to click on the "theme.css" and at the top menu bar above the code is a button marked "History". This will let you open and then copy and paste the exact version that matches the server version you are still running.  

 

A warning, this defeats the auto update feature so you will have to go back and update things manually after you are able to update your server version.

  • Like 2
Link to comment
Share on other sites

  • 2 months later...
QDivision

Hi,

 

Loving your custom CSS been using it for a while. Noticed in the latest Emby version 3.2.34 the user display section has changed which messes up the icons with your CSS, the following needs removing (or altering):

 

Line 148: i.listItemIcon.md-icon {
  background-color: #E81123; }
 
and

 

Line 157: .lnkDisplayPreferences i.md-icon.listItemIcon,
.lnkHomeScreenPreferences i.md-icon.listItemIcon,
.lnkLanguagePreferences i.md-icon.listItemIcon,
.lnkSubtitleSettings i.md-icon.listItemIcon,
.lnkMyProfile i.md-icon.listItemIcon {
  background-color: #94131E !important; }
  • Like 1
Link to comment
Share on other sites

QDivision

Also, the following needs adding for the recordings groups:
 

.listItemIcon:not(.listItemIcon-transparent) {
  background-color: #E81123 !important; }
  • Like 1
Link to comment
Share on other sites

QDivision

Another element that needs adding:
 

.emby-input:focus, .emby-textarea:focus {
    border-color: #E81123 !important;
}
 
for the search box outline.
  • Like 1
Link to comment
Share on other sites

  • 2 months later...
BigDaddyJay

Love the theme screenshots.  Did the whole copy/paste in Settings/Branding after clicking on the "Red" link from HERE.  This is what's being pasted:

 

@import url('https://rawgit.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/RED/theme.css');

 

I've restarted the client and still no changes.  Am I doing something wrong?  I'm currently using version 3.2.60.0 on the Chrome browser.  I have very limited understanding with CSS and the workings of EMBY in general.  Any suggestions would be greatly appreciated.  Thanks in advance.

Link to comment
Share on other sites

Happy2Play

 

Yup.  Still no success.   :(

 

What browser?

 

I had no issue pasting code on server 3.2.60.0 in Chrome (on my test system).

@import url('https://rawgit.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/RED/theme.css');
Edited by Happy2Play
Link to comment
Share on other sites

Happy2Play

Love the theme screenshots.  Did the whole copy/paste in Settings/Branding after clicking on the "Red" link from HERE.  This is what's being pasted:

 

@import url('https://rawgit.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/RED/theme.css');

 

I've restarted the client and still no changes.  Am I doing something wrong?  I'm currently using version 3.2.60.0 on the Chrome browser.  I have very limited understanding with CSS and the workings of EMBY in general.  Any suggestions would be greatly appreciated.  Thanks in advance.

 

Does your Emby system have a active internet connection?

 

Last resort you can copy all the css code (ctrl+A) from link below and paste in Custom CSS box.  This is the actual code, instead of importing.  Downside is you don't receive updates automatically when they are made.

 

https://raw.githubusercontent.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/RED/theme.css

Edited by Happy2Play
Link to comment
Share on other sites

BigDaddyJay

 

Does your Emby system have a active internet connection?

 

Last resort you can copy all the css code (ctrl+A) from link below and paste in Custom CSS box.  This is the actual code, instead of importing.  Downside is you don't receive updates automatically when they are made.

 

https://raw.githubusercontent.com/BenZuser/Emby-Web-Dark-Themes-CSS/master/RED/theme.css

Yes, it has access to the internet.

 

I tried the copy/paste from github as well.  Still nothing.  Here's a screenshot of where I'm posting.

5a5ff01212af3_Clipboard01.jpg

Link to comment
Share on other sites

Happy2Play

Yes, it has access to the internet.

 

I tried the copy/paste from github as well.  Still nothing.  Here's a screenshot of where I'm posting.

5a5ff01212af3_Clipboard01.jpg

 

Okay are you connecting via Connect?  Custom CSS is not available via Connect, only IP/ddns connections.  If this is not the case then we can troubleshoot more.

  • Like 1
Link to comment
Share on other sites

BigDaddyJay

Okay are you connecting via Connect?  Custom CSS is not available via Connect, only IP/ddns connections.  If this is not the case then we can troubleshoot more.

OMG! Well that did it.  I feel like a fool.  Sorry everyone, I'm gonna go back into the corner now.  Thanks for all the help eh Happy!

Link to comment
Share on other sites

  • 4 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...