New theme - Plex inspired look

[Mr_Scumbag 8]

I love the look of this. Is there any way to keep the nav drawer open while also displacing the page content (rather than hovering over it)?

[BlackDub 41]

On 5/26/2022 at 10:49 PM, Mr_Scumbag said:

I love the look of this. Is there any way to keep the nav drawer open while also displacing the page content (rather than hovering over it)?

Try my custom plex theme: 

**Do not post code like this**

Edited June 3, 2022 by Abobader
Removing long code

[fillidill 168]

On 26/05/2022 at 21:49, Mr_Scumbag said:

I love the look of this. Is there any way to keep the nav drawer open while also displacing the page content (rather than hovering over it)?

If you add the following snippet to be bottom of the CSS code it should give you what you want 

 

.mainDrawer.drawer-docked { width: 15em!important; }
@media (min-width: 80em){ .skinBody-withFullDrawer .withTabs.page, .skinBody-withFullDrawer .page { padding-left: 18rem!important; } }
@media (min-width: 50em){ .skinHeader-withfulldrawer { padding-left: 18em!important; } }

 

[Locutus64 124]

@BlackDub nice but how about putting that in a .txt file, uploading it to your post, and edit your post to remove the code?

[Locutus64 124]

Looks like I'm the only one telling @BlackDub to fix their post. What happened to the forum staff cause at least one of you should of either fixed it for them or said something to them.

[BlackDub 41]

7 hours ago, Locutus64 said:

Looks like I'm the only one telling @BlackDub to fix their post. What happened to the forum staff cause at least one of you should of either fixed it for them or said something to them.

Whats your problem ?

[Locutus64 124]

I think you got your answer when a staff member removed your code. 

Edited June 3, 2022 by Locutus64

[lenpox 1]

really good theme, thanks!

[fillidill 168]

New version can be found in the main post compatible with the latest version of Emby Stable v.4.7.5.0 (and current beta). It fixes some small graphical elements that changed in the latest updates. It also makes the intro skip button only visible a couple of seconds and then disappears, until the mouse is moved.

[Locutus64 124]

New CSS seems to have bugs. I just got my 4.7.5.0 update and added your custom CSS to it and when I click a library I'm taken to it but I can't use the back arrow in Emby, and the home button either doesn't do anything or my my browser full screen. When I remove the CSS code everything in Emby goes back to working normally.

Emby-Stable-style-v2.3.txt

Edited June 30, 2022 by Locutus64

[fillidill 168]

32 minutes ago, Locutus64 said:

New CSS seems to have bugs. I just got my 4.7.5.0 update and added your custom CSS to it and when I click a library I'm taken to it but I can't use the back arrow in Emby, and the home button either doesn't do anything or my my browser full screen. When I remove the CSS code everything in Emby goes back to working normally.

Emby-Stable-style-v2.3.txt 99.8 kB · 0 downloads

Ah sorry about that if that is the case. Unfortunately I am away on vacation two weeks so won't be able to take a look at it until then. Sorry for the inconvenience! 

[Locutus64 124]

39 minutes ago, fillidill said:

Ah sorry about that if that is the case. Unfortunately I am away on vacation two weeks so won't be able to take a look at it until then. Sorry for the inconvenience! 

No inconvenience at all. No hurry what so ever. Enjoy your vacation.

[Locutus64 124]

Yesterday I login in to my other XeroLinux and I don't have the issue in Emby there, So looks like it's something specific to Vivaldi in the one.

[chef 3804]

@fillidill man your css skills are exceptional.

Really good, pro stuff there. 

 

[Happy2Play 9289]

On 6/30/2022 at 4:07 AM, fillidill said:

On 6/30/2022 at 3:33 AM, Locutus64 said:

New CSS seems to have bugs. I just got my 4.7.5.0 update and added your custom CSS to it and when I click a library I'm taken to it but I can't use the back arrow in Emby, and the home button either doesn't do anything or my my browser full screen. When I remove the CSS code everything in Emby goes back to working normally.

Emby-Stable-style-v2.3.txt 99.8 kB · 0 downloads

Ah sorry about that if that is the case. Unfortunately I am away on vacation two weeks so won't be able to take a look at it until then. Sorry for the inconvenience! 

The issue is when you moved headermiddle up you did not adjust width to not cover headerleft buttons.

 

 

[Locutus64 124]

1 hour ago, Happy2Play said:

The issue is when you moved headermiddle up you did not adjust width to not cover headerleft buttons.

 

 

The above should be the same as this, and this works without issue.

Per.sonal Emby Text.txt

[Happy2Play 9289]

2 minutes ago, Locutus64 said:

The above should be the same as this, and this works without issue.

Per.sonal Emby Text.txt 96.97 kB · 0 downloads

Both have the same issue, the headermiddle requires width as it covers headerleft buttons.

added width to existing code

@media (min-width: 80em) {
	.headerMiddle.sectionTabs.headerMiddle-withSectionTabs {
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  width: 60%;
	}
}

 

 

 

 

[Locutus64 124]

There was no reason to remove my post since it was a fair question about if I was looking at the right part of the CSS code. That said after thinking about what you posted @Happy2Play the only thing I removed from the code since I first started using it was the blur from background images and added two pieces of CSS above that edited code, so I don't know why what I posted would have any other changes unless they were already in there when I downloaded it.

Edited July 4, 2022 by Locutus64

[fillidill 168]

23 hours ago, chef said:

@fillidill man your css skills are exceptional.

Really good, pro stuff there. 

 

Thanks Chef. That means a lot coming from you! 

[Locutus64 124]

On 7/2/2022 at 11:05 AM, Happy2Play said:

The issue is when you moved headermiddle up you did not adjust width to not cover headerleft buttons.

 

 

Looks like the issue is not something I did. I just tested the new CSS with only the background blur removed and nothing else added to it and the issue pops up. I then tested the new CSS without changing anything and the issue pops up. So the issue is in the CSS right out of the gate. Since it will make my browser (Vivaldi) go fullscreen if clicked right maybe something in the code and something in Vivaldi aren't playing nice.

Edited July 4, 2022 by Locutus64

[Locutus64 124]

On 7/2/2022 at 1:08 PM, Happy2Play said:

Both have the same issue, the headermiddle requires width as it covers headerleft buttons.

added width to existing code

@media (min-width: 80em) {
	.headerMiddle.sectionTabs.headerMiddle-withSectionTabs {
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  width: 60%;
	}
}

 

 

 

 

 

Finally realize you meant add that code. Seems to be good now. Thanks.

[Sknight117 0]

The link to the css no longer works

[Happy2Play 9289]

9 hours ago, Sknight117 said:

The link to the css no longer works

What link?

[fillidill 168]

I have now updated the main post with a new version for the back button fix (thanks Happy2Play!).

 

23 hours ago, Sknight117 said:

The link to the css no longer works

Not sure what you mean. If you mean the CSS file you can find it at the bottom of the main post in this thread and it works for me. 

[tomibi 1]

Hi @fillidillin your latest css file you have local links in your file. These does not work for us.

.page[data-type="home"] .section4 .card:nth-of-type(10):before {
  background-image: url(http://192.168.1.4:8096/emby/Items/2348019/Images/Primary?maxHeight=220&quality=90);
}