New dark theme

[G3rard]

I made a new dark theme for Domoticz. It is based on Sverto's Dark Theme which was posted here earlier, but I have made a lot of changes to it.

You can find the theme on Github https://github.com/gerard33/dark-th3me.
Edit: The theme is part of the standard Domoticz themes since v3.6745.

You can send a pull request if you found any errors or strange stuff.
And as I am not a developer, you will certainly find some strange stuff in the code

The quickest way to test changes to the theme is via the development console in Chrome (open it with F12).
- choose the Sources tab
- choose acctheme and custom.css
- any changes will be visible directly
- if you want to implement these changes then edit these in domoticz/www/styles/dark-th3me/custom.css

Desktop

theme1.jpg (170.77 KiB) Viewed 12541 times

theme2.jpg (254.31 KiB) Viewed 12541 times

iPad

iPad

theme3.jpg (90.99 KiB) Viewed 12541 times

[maluko]

Looks pretty, good work

[stlaha2007]

Nice, very nice.
Would love to implement it.

Perhaps can you make the backgrounds a bit more darker??

And/or implement a screensaver. As my 'old' sony tablet is suffering ghosting from lighter lines. Have implemented a javascript screensaver on the default theme and embedded it in your NewFrontpage version. Saves my screen from that side effect.

[fkok]

Nice, i'm sure i'm going to use it!!

[koowee]

Looks really good

[sic79]

Looks great! Good work

[stingone]

Realy nice love this one

[G3rard]

Thanks for your replies!

Will try to update the theme this weekend and will then upload it here.

Nice, very nice.
Would love to implement it.

Perhaps can you make the backgrounds a bit more darker??

And/or implement a screensaver. As my 'old' sony tablet is suffering ghosting from lighter lines. Have implemented a javascript screensaver on the default theme and embedded it in your NewFrontpage version. Saves my screen from that side effect.

The background can be easily changed. Will show you where it is in the code once I posted it.
I have a picture as a background for screens with a width > 1025px, otherwise the background is a solid grey colour. See the third picture.

[G3rard]

I updated the start post with the link to the theme on Github.
Let me know if you are happy with this new theme.

[rron]

Looks great, perfect

[G3rard]

Nice, very nice.
Would love to implement it.

Perhaps can you make the backgrounds a bit more darker??

And/or implement a screensaver. As my 'old' sony tablet is suffering ghosting from lighter lines. Have implemented a javascript screensaver on the default theme and embedded it in your NewFrontpage version. Saves my screen from that side effect.

You can change the background color in this part of the code.
https://github.com/gerard33/dark-th3me/ ... ss#L77-L86
It is showing a grey background (#7d7e7d) when the screen width is smaller then 1024px. Otherwise it will show a picture.
If you don't want the picture you can remove the @media part.

[NietGiftig]

I'm using this one now, nice & clean
Thanks for sharing
Very minor question
The selector switch in button mode has white bg/black letters for unselected buttons, they become Grey/yellow when you hover over them.
Is it possible to change this the other way round. or tell me where I can change it.
It makes the dark side of the theme darker

[Sergio]

Nice theme G3rard! I really like it.
I like messing with web pages. I'll try to contribute whenever I have time.

For example in spanish as the words are much longer, the bottom buttons on switches wrap on to two lines.
If you reduce left and/or right margins only two points total on ".btnsmall, .btnsmall-dis" tag it will fit on a single line without messing anything.

[tjabas]

Nice!!

but how do i install this?

i must add that i have never installed a skin before.

[NietGiftig]

but how do i install this?

On github https://github.com/gerard33/dark-th3me

Installation: copy dark-th3me folder to domoticz/www/styles/

[tjabas]

but how do i install this?

On github https://github.com/gerard33/dark-th3me

Installation: copy dark-th3me folder to domoticz/www/styles/

ok, but i guess this is a very stupid question, how do i copy the content to domoticz/www/styles/, can i FTP it?

[tjabas]

but how do i install this?

On github https://github.com/gerard33/dark-th3me

Installation: copy dark-th3me folder to domoticz/www/styles/

ok, but i guess this is a very stupid question, how do i copy the content to domoticz/www/styles/, can i FTP it?

im really new to this rasperry pi.

[NietGiftig]

im really new to this rasperry pi.

Yes, I see.
I think you must Google a little.
There are thousands of pages over linux/raspberrys/filetransfer/ftp.
I do not think that this forum is a good place
And then, what we had to write down here, would be a repeat of all those other articles about that subject.
Use the search Luke, use the search.

[tjabas]

im really new to this rasperry pi.

Yes, I see.
I think you must Google a little.
There are thousands of pages over linux/raspberrys/filetransfer/ftp.
I do not think that this forum is a good place
And then, what we had to write down here, would be a repeat of all those other articles about that subject.
Use the search Luke, use the search.

ok, i will do that, thank you

[Mooseknuckle]

It really looks great, thank you.