style: add text to iconbuttons
This commit is contained in:
parent
e29cfa4005
commit
279f8f85e3
2 changed files with 25 additions and 4 deletions
|
@ -50,7 +50,9 @@
|
|||
name="pencil"
|
||||
on:click={() => (editable = !editable)}
|
||||
active={editable}
|
||||
/>
|
||||
>
|
||||
Edit
|
||||
</IconButton>
|
||||
<IconButton
|
||||
name={detail ? "zoom-out" : "zoom-in"}
|
||||
on:click={() => {
|
||||
|
@ -58,13 +60,19 @@
|
|||
detailChanged = true;
|
||||
}}
|
||||
active={detail}
|
||||
/>
|
||||
<IconButton name="link" on:click={() => visit()} disabled={only} />
|
||||
>
|
||||
Detail
|
||||
</IconButton>
|
||||
<IconButton name="link" on:click={() => visit()} disabled={only}>
|
||||
Link
|
||||
</IconButton>
|
||||
<IconButton
|
||||
name="x-circle"
|
||||
on:click={() => dispatch("close")}
|
||||
disabled={only}
|
||||
/>
|
||||
>
|
||||
Close
|
||||
</IconButton>
|
||||
</header>
|
||||
<Inspect
|
||||
{address}
|
||||
|
|
|
@ -9,10 +9,17 @@
|
|||
|
||||
<button on:click class:active {disabled} {title}>
|
||||
<Icon {name} />
|
||||
<div class="text">
|
||||
<slot />
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<style lang="scss">
|
||||
button {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
border: 0;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
|
@ -35,4 +42,10 @@
|
|||
color: gray;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 0.66em;
|
||||
text-align: center;
|
||||
margin-top: 0.2em;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue