Jump to content

Custom CSS with Emby Web App


Luke

Recommended Posts

CarlosLima

When a user tries to log out of the allowed hours, a message is displayed for him to log in later.

 

Is it possible to use CSS to change this message?

Link to comment
Share on other sites

When a user tries to log out of the allowed hours, a message is displayed for him to log in later.

 

Is it possible to use CSS to change this message?

 

No.

 

Please create a feature request topic.

Link to comment
Share on other sites

  • 2 weeks later...
CarlosLima

Hello, the current version of Emby Server has again broken this code.

I like to hide the titles under the main menu images, so I apply the titles in the image itself.
I would like to know what new code I should use now so that ONLY the titles under the main menu images are hidden.

 

Thank you for that.

 

div.sections.homeSectionsContainer div.section0 .cardTextCentered {display: none;}

 

 

5993298460cc1_Capturar.jpg

Edited by CarlosLima
Link to comment
Share on other sites

Happy2Play

Hello, the current version of Emby Server has again broken this code.

I like to hide the titles under the main menu images, so I apply the titles in the image itself.
I would like to know what new code I should use now so that ONLY the titles under the main menu images are hidden.

 

Thank you for that.

 

div.sections.homeSectionsContainer div.section0 .cardTextCentered {display: none;}

 

 

5993298460cc1_Capturar.jpg

 

I am still using that code and it works on stable 3.2.27.0 and beta 3.2.27.1.

Link to comment
Share on other sites

CarlosLima

That's interesting. I've been revising and in fact I'm using stable version # 3.2.27.0 and this code broke, ie it no longer hides the titles that are below the images.

Link to comment
Share on other sites

CarlosLima
Using CSS, this is my current login screen.

 

I think it's interesting to see the customizations made by users.

 

599373bb9a957_Capturar.jpg

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

arrbee99

Just wondering if anyone might know some custom css to make the main picture for both of these bigger please ?

 

Movie screen

 

5998c822b220c_EmbyMainPictureMovie.jpg

 

TV screen

 

5998c84a3fe0a_EmbyMainPictureTV.jpg

Link to comment
Share on other sites

arrbee99

Yes that's true. But I still like to fiddle (even if I have to rely on other peoples generous help).

Link to comment
Share on other sites

PenkethBoy

Yes that's true. But I still like to fiddle (even if I have to rely on other peoples generous help).

Hi

 

Try these

/* ----- Change Movie Active Thumbnail Image Size ----- */
#itemDetailPage .portraitDetailImageContainer {
    width: 15% !important;
}

/* ----- Change TV Active Episode Thumbnail Image Size ----- */
#itemDetailPage .thumbDetailImageContainer {
    width: 20% !important;
}

obviously change the xx% to suit

 

they working in beta 27.3 - not tried in 28.1 yet

  • Like 1
Link to comment
Share on other sites

arrbee99

Hi

 

Try these

/* ----- Change Movie Active Thumbnail Image Size ----- */
#itemDetailPage .portraitDetailImageContainer {
    width: 15% !important;
}

/* ----- Change TV Active Episode Thumbnail Image Size ----- */
#itemDetailPage .thumbDetailImageContainer {
    width: 20% !important;
}

obviously change the xx% to suit

 

they working in beta 27.3 - not tried in 28.1 yet

 

Thanks very much. Working well on 28.1

Link to comment
Share on other sites

  • 1 month later...
CarlosLima
Hello everyone,

The new stable version of Emby Server has broken some custom CSS codes, while others work perfect.

One of those that I would like to continue using, but currently broken, is this one that is below and I come here to ask for help for adequacy.

Thank you very much

 

PS: If I use it as it is, the user name and password fields disappear from the screen.

 

Código CSS:

 



/* CSS#4 - Custom Login Page */
.logoLibraryMenuButtonText {
display: none;
}

.imgLogoIcon {
display: none;
}

img[src*="css/images/mblogoicon.png"] {
display: none;
}
#loginPage {
padding-top: 100px;
}
#loginPage:before {
position: absolute;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
top: 0px;
content: " ";
background: url(https://i.imgur.com/HgychzO.jpg);
background-size: 100% 100%;
width: 1920px;
height: 1080px;
}

Link to comment
Share on other sites

Happy2Play

 

Hello everyone,
The new stable version of Emby Server has broken some custom CSS codes, while others work perfect.
One of those that I would like to continue using, but currently broken, is this one that is below and I come here to ask for help for adequacy.
Thank you very much
 
PS: If I use it as it is, the user name and password fields disappear from the screen.
 
Código CSS:
 
/* CSS#4 - Custom Login Page */
.logoLibraryMenuButtonText {
  display: none;
}

.imgLogoIcon {
    display: none;
}

img[src*="css/images/mblogoicon.png"] {
    display: none;
}
#loginPage {
    padding-top: 100px;
}
#loginPage:before {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 0px;
    content: " ";
    background: url(https://i.imgur.com/HgychzO.jpg);
    background-size: 100% 100%;
    width: 1920px;
    height: 1080px;
}

 

 

Just drop the ':before" from "#loginPage:before".

  • Like 1
Link to comment
Share on other sites

  • 2 months later...
CarlosLima

Can someone please tell me the code to increase the size of these featured fonts?
It would be best if you could change the font style too.
Thank you

 

5a26ec926e0c3_Capturar.png

Link to comment
Share on other sites

Diedrich

Can someone please tell me the code to increase the size of these featured fonts?

It would be best if you could change the font style too.

Thank you

body {

font-family: Segoe UI;

font-size: 1em;

}

 

Or whatever font you have on your OS. That's just for general text, I'd have to look at the code to see what class is used for the text you want to change.

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

Diedrich

Tagline CSS class name was changed. Here is how to remove the tag line from movies, for example.

 

/*Tagline - remove*/

h3.tagline {display: none;}

  • Like 1
Link to comment
Share on other sites

  • 2 months later...
  • 2 weeks later...
CarlosLima

Hello,

 

anyone helping with css changing login screen like CarlosLima.

 

Thank you. 

 

Hi,

This image is from my current custom login screen.

I leave the CSS code to be useful to some.

I remember the need to change the link in the image.

I'm available for any questions.

 

5a9ddb2b9ddf7_Capturar.jpg

/* Custom login screen */
.logoLibraryMenuButtonText {
  display: none;
}

.imgLogoIcon {
    display: none;
}

img[src*="css/images/mblogoicon.png"] {
    display: none;
}
#loginPage {
    padding-top: 100px;
}
#loginPage {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 0px;
    content: " ";
    background: url(IMAGE LINK);
    background-size: 100% 100%;
    width: 1920px;
    height: 1080px;
}
Edited by CarlosLima
  • Like 1
Link to comment
Share on other sites

ageborn

Where is the code?

Trying from the begining of the post with the offered code but nothing happens.

Can't change anything.

Link to comment
Share on other sites

CarlosLima

Where is the code?

Trying from the begining of the post with the offered code but nothing happens.

Can't change anything.

 

Look above.

Link to comment
Share on other sites

ageborn

lol now showed up to me!!

maybe internet problem!

thank you Happy2play and CarlosLima.

I will try again and back to you for info..

:)

Link to comment
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...