'ThinkTheme' - a new flat design theme

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

'ThinkTheme' - a new flat design theme

Post by ThinkPad » Thursday 03 September 2015 20:24

So, i've spent some time in creating a new theme to be used with Domoticz:
Image

Save the code below as 'custom.css' in /www/styles/ThinkTheme/ and then choose 'ThinkTheme' from Setup > Settings > Theme
Grab latest CSS-code from Bitbucket here.

The icons are from this topic and can be downloaded here (mirror) but the theme also works fine with just the stock Domoticz icons.
No support, just grab this and enjoy it. Domoticz has updated to v3.9999999 ( :mrgreen: ) and my theme doesn't work anymore? Too bad, try to fix it yourself ;) Making this CSS stuff is quite time consuming so i can't help everyone if there is a little bug in my stylesheet.

Free to use and modify, but i would appreciate a link back to this topic if you use large parts of it in your own theme.
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

zofiel
Posts: 45
Joined: Sunday 19 July 2015 10:03
Target OS: -
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by zofiel » Friday 04 September 2015 8:25

great job!! thanks!!

User avatar
Derik
Posts: 2100
Joined: Friday 18 October 2013 23:33
Target OS: Raspberry Pi
Domoticz version: BETA
Location: Arnhem/Nijmegen Nederland
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by Derik » Friday 04 September 2015 21:52

Thanks....

Looks great....
Is this also working for a tablet @ portret ?
Or have any one a personal skin special for a portret tablet?
Xu4: Beta Extreme antenna RFXcomE,WU Fi Ping ip P1 Gen5 PVOutput Harmony HUE SolarmanPv OTG Winddelen Alive ESP Buienradar MySensors WOL Winddelen counting RPi: Beta SMAspot RFlinkTest Domoticz ...Different backups

l00pz
Posts: 49
Joined: Wednesday 01 April 2015 11:52
Target OS: Linux
Domoticz version: Beta
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by l00pz » Saturday 05 September 2015 22:27

Thanks for this nice Theme :)

User avatar
Minglarn
Posts: 150
Joined: Friday 21 August 2015 19:27
Target OS: Raspberry Pi
Domoticz version: v3.8153
Location: Stockholm / Sweden
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by Minglarn » Saturday 05 September 2015 23:10

Nice and clean. Using it now and is great on my iPad to.
When you eliminate the impossible, whatever remains, however improbable, must be the truth.” -Spock in Star Trek VI

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Sunday 06 September 2015 21:12

Some small updates (newest CSS always in first post):
- Made some more buttons 'flat' style
- Buttons of notification/timers of switches are also flat-style now
- Removed bold text from 'Create virtual sensor' / 'Setup' buttons as i didn't like it.
- Removed bold text from yellow warning message on hardware page
- Selected rows in table (Hardware/Devices/Notifications for example) are now petrol blue instead of light purple

And some other small fixes.

I want to make some more buttons flat & make table header+bottom also a color instead of gradient, but Bootstrap is annoying me. It overrides my style, even when supplying the '!important' tag after my style.
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

User avatar
galadril
Posts: 601
Joined: Monday 07 September 2015 10:32
Target OS: Raspberry Pi
Domoticz version: latest
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by galadril » Tuesday 08 September 2015 7:38

Thanks for this Theme, Looks good!
Solar panels of Ginlong, Omnik-Solar, Transenergy or Solarman?? Try my Android app:
https://play.google.com/store/apps/deta ... ongmonitor

bkanuka
Posts: 2
Joined: Saturday 26 September 2015 15:51
Target OS: Raspberry Pi
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by bkanuka » Saturday 26 September 2015 15:54

Hey, thanks for the theme. You might want to add the following (I think it made the dimmer sliders look better):

Code: Select all

dimslider {
    border-color: #333 !important;
    box-shadow: none !important;
}

.dimslider .ui-slider-range {
    border-radius: inherit;
}

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Sunday 27 September 2015 15:36

bkanuka wrote:Hey, thanks for the theme. You might want to add the following (I think it made the dimmer sliders look better):

Code: Select all

dimslider {
    border-color: #333 !important;
    box-shadow: none !important;
}

.dimslider .ui-slider-range {
    border-radius: inherit;
}
Thanks, looks better indeed! I have added it to the code in the first post.
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

CodeItAway
Posts: 36
Joined: Tuesday 11 February 2014 22:44
Target OS: Linux
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by CodeItAway » Monday 28 September 2015 21:32

Thanks for this template. I really like it!

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Monday 28 September 2015 21:58

CodeItAway wrote:Thanks for this template. I really like it!
Thanks, i appreciate your reaction!

I also really like it myself. Sometimes i see a screenshot passing by somewhere on this forum, and then i see that people are using my theme. And i think by myself: hmmm i actually did a pretty good job, it really looks nice!

:lol:
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

stlaha2007
Posts: 437
Joined: Monday 05 October 2015 10:16
Target OS: -
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by stlaha2007 » Thursday 22 October 2015 17:31

Thanks ThinkPad,

Nice work.
Keep up the works.

Using default icons, cause the custom are hard to read on a dimmed tablet.

However, do you have experience with a custom css which is able to rotate between day-night or timely switch between lighter and darker theme, to prevent burnin on tablet or eventually RPi with LCD like the Dutch Toon or Nest device?

Seen some other posts with javascript examples.... Like to use or yours as a startingpoint.

Grtz.

Sent from my D6503 using Tapatalk

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Thursday 22 October 2015 20:28

Have a look in the frontpage.html topic, they do it there. But it requires more than only CSS, so could be difficult.
And also have a look on Google "switch CSS day night time".
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

stlaha2007
Posts: 437
Joined: Monday 05 October 2015 10:16
Target OS: -
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by stlaha2007 » Thursday 22 October 2015 20:51

ThinkPad wrote:Have a look in the frontpage.html topic, they do it there. But it requires more than only CSS, so could be difficult.
And also have a look on Google "switch CSS day night time".
Thanks.

Must have missed that specific topic.

I was already looking at the Google Day-Night switch, which does a great part of my wishes.

Hardest part is implementing it.
Thanks again gor the direction.


Sent from my D6503 using Tapatalk

vdomotik
Posts: 1
Joined: Saturday 24 October 2015 23:20
Target OS: Raspberry Pi
Domoticz version:
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by vdomotik » Saturday 24 October 2015 23:24

Thanks !
I really like this theme...
I have just migrated from a Vera Lite and I am so happy with Domoticz and your theme...

User avatar
deejc
Posts: 173
Joined: Tuesday 22 September 2015 18:50
Target OS: Raspberry Pi
Domoticz version: 3.5641
Location: UK
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by deejc » Sunday 25 October 2015 17:43

just installed this theme and really like it, thanks
Domoticz 3.5641 on RPI (Raspbian GNU/Linux 8)

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Sunday 25 October 2015 21:25

Thanks for the positive reactions :D
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

User avatar
ThinkPad
Posts: 1754
Joined: Tuesday 30 September 2014 8:49
Target OS: Linux
Domoticz version: beta
Location: The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by ThinkPad » Wednesday 04 November 2015 22:38

Small style change to the log window, from a white background to a much softer (for your eyes) color + different font (Droid Sans Mono) & different color for lines that were first marked blue/greenish:

Image

Newest CSS-file in the topicstart. Or grab it from my Bitbucket where i post all my scripts/code: https://bitbucket.org/frankiepankie/domoscripts/src
ThinkTheme - theme for Domoticz
My (Dutch) blog: http://thinkpad.tweakblogs.net - My Domoticz scripts: Bitbucket
I'm not (very) active anymore on this forum as i don't use Domoticz anymore.

loyske
Posts: 18
Joined: Wednesday 19 August 2015 13:43
Target OS: Raspberry Pi
Domoticz version:
Location: Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by loyske » Wednesday 02 December 2015 15:58

Nice one Thinkpad, very "strak" theme :D

User avatar
mvveelen
Posts: 654
Joined: Friday 31 October 2014 11:22
Target OS: NAS (Synology & others)
Domoticz version: Beta
Location: Hoorn, The Netherlands
Contact:

Re: 'ThinkTheme' - a new flat design template

Post by mvveelen » Wednesday 02 December 2015 16:21

Using this for a while now, great work.

One thing though......when there is an error message (red), it's very hard to read on the dark background. I'd prefer another color. Where can I set / change it exactly ?
Synology DS414 DSM6.1 + RFXCOM rfxtrx433E + Xiaomi Gateway + Philips HUE Lights + Nefit Easy + Dashticz v2 + Domoticz latest Beta

Post Reply

Who is online

Users browsing this forum: No registered users and 3 guests