Jump to content

Recommended Posts

mediacowboy
Posted (edited)

I have modified and merged together changes from other member and some of my own work to make this. Thanks to @@bigjohn & @@Koleckai Silvestri.

 

If you decide to use this theme and have any issue's or question's please fill free to ask or say something and I will see what I can do.

/* Smoke in the Night */

/*Enable vertical scrolling on the custom css text box*/
#txtCustomCss{
   overflow-y:scroll !important;
   height: 200px !important;
}

/*Remove 'Missing Trailer' icon in metadata editor*/
img[src='css/images/editor/missingtrailer.png'] {
   display:none;
}

/* Removes Blue Edit Buttons */
.accentButton {
   display: none;
}

/* Dark Dashboard theme */
.ui-page-theme-a {
  background-color: #2a2a2a !important;
  border-color: #454545;
  color: #ccc !important;
}
.ui-page-theme-a .ui-body-inherit{
  background-color:#252525;
  border-color:#1d1d1d;
  color: #ccc !important;
}
.ui-page-theme-a .content-secondary {
  background: #2a2a2a;
}
.ui-page-theme-a .ui-btn {
  background-color: #333 !important;
  border-color: #1f1f1f !important;
  color: #ccc !important;
}
.ui-page-theme-a .ui-btn:hover {
  background-color: #373737 !important;
  border-color: #1f1f1f !important;
  color: #ccc !important;
}
.ui-page-theme-a .ui-btn.ui-btn-active {
  background-color: #38c !important;
  border-color: #38c !important;
  color: #ccc !important;
}
.ui-page-theme-a .selectedSidebarLink {
  background-color: #474747 !important;
}
.sidebarLink:hover {
  background-color: #373737;
}
.ui-page-theme-a .ui-bar-inherit {
  border-color: #555;
  background-color: #555;
  color: #ccc !important;
}
.ui-page-theme-a .sidebarLinkIcon {
  color: #ccc !important;
}
.newsItem {
  border-bottom: 1px solid #555;
}
.ui-page-theme-a .detailSectionHeader {
  background-color: #333 !important;
  border-color: #1f1f1f !important;
  color: #ccc;
}
.ui-body-a {
  background-color: #111;
  color: #ccc !important;
}
.ui-body-a .ui-btn {
  border: 1px solid #555 !important;
  background-color: #333 !important;
  color: #ccc !important;
}
.ui-body-a .ui-btn:hover {
  border: 1px solid #555 !important;
  background-color: #373737 !important;
  color: #ccc !important;
}


.activeSession:not(.playingSession) .sessionNowPlayingInnerContent {
  background-color: #252525;
  color: #ccc;
  border: 1px solid #555;
}
.warningFieldDescription {
  color: #000;
}
.remoteImageDetails{
  background:#333;
}

.ui-overlay-a {
  background-color: #252525;
}
#fldConnectInfo {
  background: #333 !important;
}

.libraryViewNav .ui-btn-active {
  border-bottom-color: #ccc;
}
.libraryViewNav a:not(.ui-btn-active):hover {
color: #454545 !important;
}
.ui-page-theme-b a:visited, html .ui-bar-b a:visited, html .ui-body-b a:visited, html body .ui-group-theme-b a:visited {
  color: #ccc !important;
}
.ui-page-theme-b a:hover, html .ui-bar-b a:hover, html .ui-body-b a:hover, html body .ui-group-theme-b a:hover {
  color: #454545;
}

/*Change 'Played' icon background to red for better visual separation */
.ui-icon-check.ui-btn-icon-notext {
  display: block;
  position: absolute;
  top: -1px;
  text-align: center;
  vertical-align: middle;
  width: 25px;
  height: 20px;
  padding-top: 3px;
  border-radius: 50%;
  color: #ccc;
  background: rgb(153,0,0);
}

/* Changes the My Media(Buttons) to match the theme and remove the color*/
.smallBackdropCard .cardText {
border-radius:4px;
background-color: #111;
color: #ccc !important;
border: 2px solid rgba(204,204,204,0.75);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(204,204,204,0.75);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(204,204,204,.6);
}

.visualCardBox {
border-radius:4px;
background-color: #111;
color: #ccc !important;
border: 2px solid rgba(204,204,204,0.75);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(204,204,204,0.75);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(204,204,204,.6);
}

.sidebarLinkText{
color: #ccc !important;
}

.libraryMenuButtonText {
color: #ccc !important;
}

.headerButton {
color: #ccc !important;
}

.cardImage{
background-position: center center !important;
}

.paper-input {
color: #ccc !important;
}

*Updated to make it match more of then theme. Also had to adjust a few things to make it work with the newer server. If you want the old please download the attached file.

Smoke in the Night V1.txt

Edited by mediacowboy
  • Like 5
mediacowboy
Posted (edited)

Here are some screen snipping's.

 

First is the main screen you see when select media. It shows the my buttons change the red status indicator and the reason I call it smoke in the night.

post-348-0-97449100-1431834583_thumb.png

 

Second is the dashboard and how I removed all the color to keep it constant. This also shows the dark theme to the dashboard.

post-348-0-49259500-1431834598_thumb.png

 

Also had to fix the plugins, users, and other pages as they were showing a white background. So I made them look like the button's.

post-348-0-08008900-1431834606_thumb.png

Edited by mediacowboy
  • Like 1
Posted

Looks good man.

  • Like 1
mediacowboy
Posted

Thanks

Koleckai Silvestri
Posted

Nice changes.

Happy2Play
Posted
/*Change 'Played' icon background to red for better visual separation */ 
.ui-icon-check.ui-btn-icon-notext

How can I reverse this, making un-played red while leaving played green?

mediacowboy
Posted

Give this a try and let me know.

.ui-icon-check.ui-btn-icon-notext {
  display: block;
  position: absolute;
  top: -1px;
  text-align: center;
  vertical-align: middle;
  width: 25px;
  height: 20px;
  padding-top: 3px;
  border-radius: 50%;
  color: #fff;
  background: rgba(82,181,75,.8);
}

.playedIndicator {
  display: block;
  position: absolute;
  top: -1px;
  text-align: center;
  vertical-align: middle;
  width: 25px;
  height: 20px;
  padding-top: 3px;
  border-radius: 50%;
  color: #fff;
  background: rgb(153,0,0);
}

  • Like 1
Happy2Play
Posted

 

/*Change 'Played' icon background to red for better visual separation */
.ui-icon-check.ui-btn-icon-notext

 

Only side effect of this is you loose the movies "Select" button for creating playlist/grouping/collections.

  • 1 month later...
Posted

I'm trying your theme and I have to say it's pretty great ! =)

Just one thing: my left menu under the administration panel is written in black on black (but the emby menu with folders, etc... is white)

Do you an idea ?

Thanks !

mediacowboy
Posted

@@lokiii, here is the fix just add to the bottom. I am trying to figure out to change the icons back to white but this adjust the text. Once I get everything fixed I will update the main post.

.sidebarLinkText{
color: #fff;
}
mediacowboy
Posted

Not a problem

Blueeyiz702
Posted

 

I have modified and merged together changes from other member and some of my own work to make this. Thanks to @@bigjohn & @@Koleckai Silvestri.

 

If you decide to use this theme and have any issue's or question's please fill free to ask or say something and I will see what I can do.

/* Smoke in the Night */

/*Enable vertical scrolling on the custom css text box*/
#txtCustomCss{
   overflow-y:scroll;
}

/*Remove 'Missing Trailer' icon in metadata editor*/
img[src='css/images/editor/missingtrailer.png'] {
   display:none;
}

/* Removes Blue Edit Buttons */
.accentButton {
   display: none;
}

/* Dark Dashboard theme */
.ui-page-theme-a {
  background-color: #252525;
  border-color: #454545;
  color: #fff;
}
.ui-page-theme-a .ui-body-inherit{
  background-color:#2a2a2a;
  border-color:#1d1d1d;
  color: #fff;
}
.ui-page-theme-a .content-secondary {
  background: #2a2a2a;
}
.ui-page-theme-a .ui-btn {
  background-color: #333 !important;
  border-color: #1f1f1f !important;
  color: #fff !important;
}
.ui-page-theme-a .ui-btn:hover {
  background-color: #373737 !important;
  border-color: #1f1f1f !important;
  color: #fff !important;
}
.ui-page-theme-a .ui-btn.ui-btn-active {
  background-color: #38c !important;
  border-color: #38c !important;
  color: #fff !important;
}
.ui-page-theme-a .selectedSidebarLink {
  background-color: #474747 !important;
}
.sidebarLink:hover {
  background-color: #373737;
}
.ui-page-theme-a .ui-bar-inherit {
  border-color: #555;
  background-color: #555;
  color: #fff;
}
.ui-page-theme-a .sidebarLinkIcon {
  color: #fff;
}
.newsItem {
  border-bottom: 1px solid #555;
}
.ui-page-theme-a .detailSectionHeader {
  background-color: #333 !important;
  border-color: #1f1f1f !important;
  color: #fff;
}
.ui-body-a {
  background-color: #111;
  color: #fff;
}
.ui-body-a .ui-btn {
  border: 1px solid #555 !important;
  background-color: #333 !important;
  color: #fff !important;
}
.ui-body-a .ui-btn:hover {
  border: 1px solid #555 !important;
  background-color: #373737 !important;
  color: #fff !important;
}


.activeSession:not(.playingSession) .sessionNowPlayingInnerContent {
  background-color: #252525;
  color: #fff;
  border: 1px solid #555;
}
.warningFieldDescription {
  color: #000;
}
.remoteImageDetails{
  background:#333;
}

.ui-overlay-a {
  background-color: #252525;
}
#fldConnectInfo {
  background: #333 !important;
}

.libraryViewNav .ui-btn-active {
  border-bottom-color: #fff;
}
.libraryViewNav a:not(.ui-btn-active):hover {
color: #454545 !important;
}
.ui-page-theme-b a:visited, html .ui-bar-b a:visited, html .ui-body-b a:visited, html body .ui-group-theme-b a:visited {
  color: #454545;
}
.ui-page-theme-b a:hover, html .ui-bar-b a:hover, html .ui-body-b a:hover, html body .ui-group-theme-b a:hover {
  color: #454545;
}

/*Sets the Icon's in the Dashboard to White*/
.sidebarLinkIcon:before{
   color: #fff;
}

/*Change 'Played' icon background to red for better visual separation */
.ui-icon-check.ui-btn-icon-notext {
  display: block;
  position: absolute;
  top: -1px;
  text-align: center;
  vertical-align: middle;
  width: 25px;
  height: 20px;
  padding-top: 3px;
  border-radius: 50%;
  color: #fff;
  background: rgb(153,0,0);
}

/* Changes the My Media(Buttons) to match the theme and remove the color*/
.smallBackdropCard .cardText {
border-radius:4px;
background-color: #111;
color: #fff;
border: 2px solid rgba(255,255,255,0.75);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,255,255,0.75);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,255,255,.6);
}

.visualCardBox {
border-radius:4px;
background-color: #111;
color: #fff;
border: 2px solid rgba(255,255,255,0.75);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,255,255,0.75);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,255,255,.6);
}

thats wierd,i just copy and pasted this to my css,and pow,nothing changed?what the hay happen,any ideas mediacowboy why this would happen?

mediacowboy
Posted (edited)

Did you refresh the page? What part are you expecting to change?

Edited by mediacowboy
Blueeyiz702
Posted

Did you refresh the page? What part are you expecting to change?

yes refreshed page and restarted and the sever side didnt change at all?

mediacowboy
Posted

I don't know then. I have re done my server s few times and it works. Can you copy your custom css and paste it here or upload a text and I'll take a look.

Blueeyiz702
Posted

i got it to work mediacowboy,i had left out a part. thanks

mediacowboy
Posted

No problem glad all is working.

  • 2 weeks later...
Blueeyiz702
Posted

Your theme,with disparity icons,good stuff.55c086744c1c4_screenshot1921680204809620

  • Like 1

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