bigger icon kliko Topic is solved

[pvklink]

Is there a way to enlarge the kliko (kliko_purple.png) ?


css
/* GARBAGE .dt_state { height: 100%; overflow-y: auto} */
[data-id='mygarbage'].garbage {height: 200px !important; padding-top: 30px !important;}
[data-id='mygarbage'].garbage .col-icon { padding-left:20px !important}
[data-id='mygarbage'].garbage .col-data {font-size:12px !important; color: white !important; padding-left:20px !important}
[data-id='mygarbage'].garbage .dt_state .trashtoday {color: red !important}
[data-id='mygarbage'].garbage .dt_state .trashtomorrow {color: orange !important}

js
blocks['mygarbage'] = {
company: 'avalex',
zipcode: 'xxxxxxx',
street: 'xxxxxxxxxxx',
housenumber: xx,
housenumberadd: '',
layout: 1,
image: '',
url: 'https://www.avalex.nl/kalender/',
newwindow: 1,
width: 3,
hideicon: 0,
icon_use_colors:true,
use_colors:true,
use_names:true,
maxitems: 12,
garbage_mapping: {
rest: ['grof', 'grey', 'rest', 'grijs','grijze'],
gft: ['gft', 'tuin', 'refuse bin', 'green', 'groen', 'Biodégradables', 'snoei'],
pmd: ['plastic', 'pmd', 'verpakking', 'kunststof', 'valorlux'],
papier: ['papier', 'blauw', 'blue', 'recycling bin collection'],
kca: ['chemisch', 'kca','kga'],
brown: ['brown', 'verre'],
black: ['black', 'zwart'],
milieu: ['milieu'],
kerstboom: ['kerst'],},
garbage: {
gft: {kliko: 'green', code: '#FFFFFF', name: 'GFT', icon: 'img/garbage/kliko_green.png'},
pmd: {kliko: 'purple', code: '#FFFFFF', name: 'PMD', icon: 'img/garbage/kliko_purple.png'},
rest: {kliko: 'grey', code: '#FFFFFF', name: 'Restafval', icon: 'img/garbage/kliko_grey.png'},
papier: {kliko: 'blue', code: '#FFFFFF', name: 'Papier', icon: 'img/garbage/kliko_blue.png'},
kca: {kliko: 'red', code: '#FFFFFF', name: 'Chemisch afval', icon: 'img/garbage/kliko_red.png'},
brown: {kliko: 'brown', code: '#FFFFFF', name: 'Bruin', icon: 'img/garbage/kliko_brown.png'},
black: {kliko: 'black', code: '#FFFFFF', name: 'Zwart', icon: 'img/garbage/kliko_black.png'},
milieu: {kliko: 'yellow', code: '#FFFFFF', name: 'Geel', icon: 'img/garbage/kliko_yellow.png'},
kerstboom: {kliko: 'green', code: '#FFFFFF', name: 'Kerstboom', icon: 'img/garbage/tree.png'},},
}

[HansieNL]

Have you tried to use the class .trashcan?

Code: Select all

.trashcan { 
	width: 120% !important;
}

[pvklink]

Dank Hansie !

[pvklink]

mmm, does nothing ?

/* GARBAGE */
[data-id='mygarbage'].garbage {height: 200px !important; padding-top: 30px !important;}
[data-id='mygarbage'].garbage .col-icon { padding-left:20px !important}
[data-id='mygarbage'].garbage .col-data {font-size:12px !important; color: white !important; padding-left:20px !important}
[data-id='mygarbage'].garbage .dt_state .trashtoday {color: red !important}
[data-id='mygarbage'].garbage .dt_state .trashtomorrow {color: orange !important}
[data-id='mygarbage'].trashcan { width: 120% !important;}

/* also trie */
.trashcan { width: 120% !important;}

[madpatrick]

Try this

Code: Select all

[data-id='mygarbage'].garbage img			{max-width: 50px !important;}

or

Code: Select all

[data-id='mygarbage'].garbage img			{width: 120% !important;}

please use </> if you post code. This makes it better readable

[pvklink]

YESSSS it works, almost there! it looks great!
I will publish my new tile menu for my new touch screen when the last problems are solved...