Publishing the complete config is a bit too much info i think, so this is a snip for the title blocks
Code: Select all
var blocks = {}
// -------------------------------------------------------------------------------
// TITLE BLOCKS
// -------------------------------------------------------------------------------
blocks['Title_Lichtschakelaars']= {width: 12,type: 'blocktitle',title: 'Schakelaars',image : 'patrick/blue_switch-on.png'}
blocks['Title_Dials'] = {width: 4,type: 'blocktitle',title: 'Functies',image : 'patrick/blue_switch-on.png'}
blocks['Title_Garbage'] = {width: 12,type: 'blocktitle',title: 'Afval',image : 'patrick/garbage.png'}
blocks['miniclock'] = {width: 8};
// --------------------------------------------------------------------------------------------
// BLOCKS
// --------------------------------------------------------------------------------------------
blocks[gr_tuin] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_garden.png', title:'Tuin'}
blocks[gr_kamer] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_desk_lamp.png', title:'Kamer'}
blocks[dimmer_hal] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_hal_light.png', title:'Hal'}
blocks[ventilatie] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_fan.png', title:'Ventilatie'}
blocks['Slide_1'] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_blinds.png', title:'Screens',slide:2}
blocks['Slide_2'] = {width: 2, hide_data : true, last_update : false, image: 'patrick/blue_speaker.png', title:'Muziek' ,slide:3}
// --------------------------------------------------------------------------------------------
// columns
// --------------------------------------------------------------------------------------------
var columns = {}
columns['home1'] = {blocks: ['Title_Garbage','mygarbage'], width: 3}
columns['home2'] = {blocks: ['Title_Dials','miniclock',gr_tuin,gr_kamer,dimmer_hal,ventilatie,'Slide_1','Slide_2'], width: 9}
columns['home4'] = {blocks: ['Title_Lichtschakelaars','Somfy_blok1','Somfy_blok2','Somfy_woonkamer'], width: 12}
Code: Select all
/* ---------------Different fontsize & color for Column --------------- */
.blocktitle {height: 40px !important;background-color: rgba(130,130,130,0.2)!important;display: flex !important;justify-content: center !important; align-items: center !important;}
.blocktitle .dt_title {font-size: 24px;color: rgba(255,255,255,1); text-shadow: 4px 4px 4px #000000;padding-top: 4px !important}
.blocktitle img {max-width: 34px !important;padding-bottom: 10px !important}
.miniclock {font-size: 24px;color: rgba(255,255,255,1); text-shadow: 4px 4px 4px #000000;padding-top: 4px !important;height: 40px !important;background-color: rgba(130,130,130,0.2)!important;text-align: right !important}
/*---------------CHANGE ICON SIZES---------------*/
.mh .fas,
.mh .far,
.mh .wi {font-size: 28px !important;}
/* ---------------GARBAGE--------------- */
[data-id='mygarbage'] {height: 130px !important;background-color: rgba(77, 77, 222, 0.2) !important;border: 3px solid rgba(255,255,255,0) !important;border-radius: 1px !important}
[data-id='mygarbage'].garbage .trashdate {width: 50% !important}
[data-id='mygarbage'].garbage .trashtype {width: 50% !important}
[data-id='mygarbage'].garbage .trashtoday {font-size: 14px; font-weight: bold; color:yellow !important;text-align:right !important;}
[data-id='mygarbage'].garbage .trashtomorrow {font-size: 14px; font-weight: bold; color:yellow !important;text-align:right !important;}
[data-id='mygarbage'].garbage .trashrow {font-size: 14px; font-weight: normal; color:white!important;text-align:right !important;opacity: 0.7 !important}
[data-id='mygarbage'].garbage img {max-width: 75px !important;display:inline-block;position: relative; top: -10px !important;}}
/* --------------- LIGHT SWITCHES --------------- */
.block_59,
.block_64,
.block_69,
.block_96,
.block_276,
.block_455,
.block_355,
.block_431,
.block_264,
.block_540,
.block_237,
.block_559,
.block_256,
.block_267,
.block_454,
.block_638 {height: 100px !important;background-color: rgba(77, 77, 222, 0.2) !important;border: 3px solid rgba(255,255,255,0) !important;border-radius: 1px !important;text-align: center !important}
.block_59 .icon,
.block_64 .icon,
.block_69 .icon,
.block_96 .icon,
.block_276 .icon,
.block_455 .icon,
.block_355 .icon,
.block_431 .icon,
.block_264 .icon,
.block_540 .icon,
.block_237 .icon,
.block_559 .icon,
.block_256 .icon,
.block_267 .icon,
.block_454 .icon,
.block_638 .icon {font-size: 40px !important;}
.block_59 img,
.block_64 img,
.block_69 img,
.block_96 img,
.block_276 img,
.block_455 img,
.block_355 img,
.block_431 img,
.block_264 img,
.block_540 img,
.block_237 img,
.block_559 img,
.block_256 img,
.block_267 img,
.block_454 img,
.block_207 img,
.block_198 img,
.block_464 img,
.block_630 img,
.block_638 img,
.block_721 img {max-width: 65px !important;}
.block_673 .off.icon {opacity: 1 !important}
.block_454 .value {font-size: 20px !important;}
.block_59 .state,
.block_64 .state,
.block_69 .state,
.block_96 .state,
.block_276 .state,
.block_455 .state,
.block_355 .state,
.block_431 .state,
.block_264 .state,
.block_540 .state,
.block_237 .state,
.block_559 .state,
.block_256 .state,
.block_267 .state,
.block_454 .state,
.block_638 .state {display: none !important}
.block_59 .title,
.block_64 .title,
.block_69 .title,
.block_96 .title,
.block_276 .title,
.block_455 .title,
.block_355 .title,
.block_431 .title,
.block_264 .title,
.block_540 .title,
.block_237 .title,
.block_559 .title,
.block_256 .title,
.block_267 .title,
.block_454 .title,
.block_207 .title,
.block_198 .title,
.block_464 .title,
.block_630 .title,
.block_638 .title {font-size: 18px !important;color:lightyellow !important;}