increase size of icon display
This commit is contained in:
parent
43a69e22b9
commit
f03a2ac0cc
|
@ -8,20 +8,21 @@
|
||||||
let selectedColor
|
let selectedColor
|
||||||
|
|
||||||
let iconsList = [
|
let iconsList = [
|
||||||
{ icon: "Actions", color: "" },
|
"Actions",
|
||||||
{ icon: "Algorithm", color: "" },
|
"Algorithm",
|
||||||
{ icon: "App", color: "" },
|
"App",
|
||||||
{ icon: "Briefcase", color: "" },
|
"Briefcase",
|
||||||
{ icon: "Money", color: "" },
|
"Money",
|
||||||
{ icon: "ShoppingCart", color: "" },
|
"ShoppingCart",
|
||||||
{ icon: "Form", color: "" },
|
"Form",
|
||||||
{ icon: "Help", color: "" },
|
"Help",
|
||||||
{ icon: "Monitoring", color: "" },
|
"Monitoring",
|
||||||
{ icon: "Sandbox", color: "" },
|
"Sandbox",
|
||||||
{ icon: "Project", color: "" },
|
"Project",
|
||||||
{ icon: "Organisations", color: "" },
|
"Organisations",
|
||||||
{ icon: "Magnify", color: "" },
|
"Magnify",
|
||||||
{ icon: "Launch", color: "" },
|
"Launch",
|
||||||
|
"Actions",
|
||||||
]
|
]
|
||||||
export const show = () => {
|
export const show = () => {
|
||||||
modal.show()
|
modal.show()
|
||||||
|
@ -60,10 +61,10 @@
|
||||||
{#each iconsList as item}
|
{#each iconsList as item}
|
||||||
<div
|
<div
|
||||||
class="icon-item"
|
class="icon-item"
|
||||||
style="color: {item.icon === selectedIcon ? selectedColor : ''}"
|
style="color: {item === selectedIcon ? selectedColor : ''}"
|
||||||
on:click={() => (selectedIcon = item.icon)}
|
on:click={() => (selectedIcon = item.icon)}
|
||||||
>
|
>
|
||||||
<Icon name={item.icon} />
|
<Icon name={item} />
|
||||||
</div>
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
@ -85,7 +86,7 @@
|
||||||
<style>
|
<style>
|
||||||
.scrollable-icons {
|
.scrollable-icons {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
height: 120px;
|
height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.grid {
|
.grid {
|
||||||
|
|
Loading…
Reference in New Issue