Jump to content

Custom CSS with Emby Web App


Recommended Posts

Blueeyiz702

There is a semicolon missing after the #000. That may be why yours is not black. I just fixed it in the original post. 

tried that and its still black,also tried with all six and the same? Bigjohn,do think you could put together a css that i can use all at once and just copy and paste.im no good with ccs stuff. something that would change the login screen and dashboard,im partial to blue if you have time.appreciate it.

Edited by blueeyiz7021
Link to post
Share on other sites
bigjohn

tried that and its still black,also tried with all six and the same? Bigjohn,do think you could put together a css that i can use all at once and just copy and paste.im no good with ccs stuff. something that would change the login screen and dashboard,im partial to blue if you have time.appreciate it.

Wait, you are trying to make it NOT black? My css for the login page purposefully makes it black. I thought you were saying the problem was that it is NOT black. I don't really have time to come up with another color scheme, this was just done on my own server to make the dashboard and login page dark because I am usually using it in a dark room and the bright color scheme hurt my eyes.

 

If you want to make it some other color, just change the #000 to some other hex color value. Use a site like this to pick a color:

http://www.w3schools.com/tags/ref_colorpicker.asp

  • Like 1
Link to post
Share on other sites
Blueeyiz702

oh,my bad i missunderstood.the black is fine i wasnt sure it was supposed to be that color,thank you and im all good now with your help,thanks bigjohn!

 

Wait, you are trying to make it NOT black? My css for the login page purposefully makes it black. I thought you were saying the problem was that it is NOT black. I don't really have time to come up with another color scheme, this was just done on my own server to make the dashboard and login page dark because I am usually using it in a dark room and the bright color scheme hurt my eyes.

If you want to make it some other color, just change the #000 to some other hex color value. Use a site like this to pick a color:
http://www.w3schools.com/tags/ref_colorpicker.asp

Link to post
Share on other sites
Blueeyiz702

http://www.december.com/html/spec/color3hex1.html  bigjohn this page also provides the 3 digit hex codes like you use in your css script. it help me find code to match yours but

also the color i wanted.it migh some other people as well,just hover over color you want and it gives 3 digit hex code.

Edited by blueeyiz7021
Link to post
Share on other sites
Blueeyiz702

bigjohn,got background color i want and tried changing box colors and lettering colors to match but would take,dont i just change code like i did for background or did i miss something?

Link to post
Share on other sites
Blueeyiz702

Im going to learn this css if it kills me,or i kill it.think i got some pretty teachers here on emby :D

Edited by blueeyiz7021
Link to post
Share on other sites

I'm a CSS noob so here is my question:

My emby home has 9 folders. Is there a way to apply a width:33% on the 1st line (so I'll have my 3 1st folders pretty big) and a width:16,6% on the 2nd line (so i'll have my 6 folders left smaller) ?

 

Thanks a lot! =)

Link to post
Share on other sites
Happy2Play

I'm a CSS noob so here is my question:

My emby home has 9 folders. Is there a way to apply a width:33% on the 1st line (so I'll have my 3 1st folders pretty big) and a width:16,6% on the 2nd line (so i'll have my 6 folders left smaller) ?

 

Thanks a lot! =)

You mean like post 86.

Link to post
Share on other sites

You mean like post 86.

Exactly like this, but my issue is that I only have folders, no channel nor collections...

I would say you can't apply different width value on a same div but, well, if someone can confirm or knows a secret about that... :D

Link to post
Share on other sites
CarlosLima

55b915c642b20_black.jpg


Hi. I use the dark theme, but the side menu has the fonts in the dark as well and are unreadable. (1)
Changing the color of these sources for white ?

Link to post
Share on other sites
mediacowboy

@, try this.

 

.sidebarLinkText{color: #fff;}
Edited by mediacowboy
Link to post
Share on other sites
shorty1483

Guys, how do I change the colors (Play-green, Trailer-orange, sync-blue, shar-purple...) in the Details screen of an item in webview (Chrome)?

Link to post
Share on other sites
primecut

This turns them all blue. You can get the rgb values from i.e. paint

/* Buttons */
.btnPlay {
background: rgba(51,136,204,0.9) !important;
}
.btnSync {
background: rgba(51,136,204,0.9) !important;
}
.btnShare {
background: rgba(51,136,204,0.9) !important;
}
.btnMoreCommands {
background: rgba(51,136,204,0.9) !important;
}
Edited by primecut
  • Like 1
Link to post
Share on other sites
bigjohn

Please help. How can I change the white colour and darken the vertical scrolls? Thanks.

 

https://www.dropbox.com/s/r8ibu05nxeylsji/dashboard.JPG?dl=0

 

 

The white session boxes should already be handled by my css from post #21 of this thread (at least it works for me) in this section:

.activeSession:not(.playingSession) .sessionNowPlayingInnerContent {
  background-color: #252525;
  color: #f2f2f2;
  border: 1px solid #555;
}

.

.

.

.

I believe the scrollbar is browser dependent. What browser do you use?

Link to post
Share on other sites

The white session boxes should already be handled by my css from post #21 of this thread (at least it works for me) in this section:

.activeSession:not(.playingSession) .sessionNowPlayingInnerContent {
  background-color: #252525;
  color: #f2f2f2;
  border: 1px solid #555;
}

.

.

.

.

I believe the scrollbar is browser dependent. What browser do you use?

 

Checked. That section was missing so I deleted what I had and inserted that from post#21. All ok now. Thanks again. Using Chrome

Edited by lja
Link to post
Share on other sites
bigjohn

Chrome uses Webkit, so you can adjust the scrollbar using these selectors:

::-webkit-scrollbar
::-webkit-scrollbar-button
::-webkit-scrollbar-track
::-webkit-scrollbar-track-piece  
::-webkit-scrollbar-thumb
::-webkit-scrollbar-corner
::-webkit-resizer

Here is an example, though you obviously wouldn't want to use these colors:

::-webkit-scrollbar {
    width: 20px;
}
::-webkit-scrollbar-track {
    background-color: #00f;
    border-left: solid 1px #0f0;
}
::-webkit-scrollbar-thumb {
    background-color: #f00;
}
::-webkit-scrollbar-thumb:hover {
    background-color: #0f0;
}
Link to post
Share on other sites

 

Chrome uses Webkit, so you can adjust the scrollbar using these selectors:

::-webkit-scrollbar
::-webkit-scrollbar-button
::-webkit-scrollbar-track
::-webkit-scrollbar-track-piece  
::-webkit-scrollbar-thumb
::-webkit-scrollbar-corner
::-webkit-resizer

Here is an example, though you obviously wouldn't want to use these colors:

::-webkit-scrollbar {
    width: 20px;
}
::-webkit-scrollbar-track {
    background-color: #00f;
    border-left: solid 1px #0f0;
}
::-webkit-scrollbar-thumb {
    background-color: #f00;
}
::-webkit-scrollbar-thumb:hover {
    background-color: #0f0;
}

Thanks. Researching different colours.

Link to post
Share on other sites
Blueeyiz702

Is there a way to lighten up or even transparent images so that the backdrop shows thru,so you can actually see it better?

maybe make top layer of images transparent and the backdrop just a little lighter?55c508b219d2f_screenshot1921680204809620

Link to post
Share on other sites
Happy2Play

Is there a way to lighten up or even transparent images so that the backdrop shows thru,so you can actually see it better?

maybe make top layer of images transparent and the backdrop just a little lighter?

 

This should be what you are looking for.  Adjust the last number (.94) lower.

.backdropPage.ui-page-theme-b:not(.pageWithAbsoluteTabs), .backdropPage.pageWithAbsoluteTabs .pageBackground {background-color: rgba(20,20,20, .94) !important;}
Link to post
Share on other sites
Blueeyiz702

 

This should be what you are looking for.  Adjust the last number (.94) lower.

.backdropPage.ui-page-theme-b:not(.pageWithAbsoluteTabs), .backdropPage.pageWithAbsoluteTabs .pageBackground {background-color: rgba(20,20,20, .94) !important;}

Im still learning css happy2play,so where would i paste this? 

Edited by blueeyiz7021
Link to post
Share on other sites

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...