mirrors/pinafore
mirrors
/
pinafore
mirror of https://github.com/nolanlawson/pinafore.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add count to IconButton

This commit is contained in:
niu tech 2023-07-10 20:14:28 +02:00 committed by GitHub
parent 72a07ac40d
commit 5d61e6d0c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/routes/_components/IconButton.html
View File

@ -15,6 +15,9 @@
{#if checked}
<SvgIcon className="icon-button-svg icon-button-check" ref:check href="#fa-check" />
{/if}
{#if count}
<span class="icon-button-count">{count}</span>
{/if}
</button>
<style>
.icon-button {
@ -28,6 +31,11 @@
pointer-events: auto;
}
:global(.icon-button-count) {
margin-left: 10px;
color: var(--action-button-fill-color);
}
:global(.icon-button-svg) {
width: 24px;
height: 24px;
@ -77,6 +85,10 @@
* muted
*/
:global(.icon-button.muted-style .icon-button-count) {
color: var(--action-button-deemphasized-fill-color);
}
:global(.icon-button.muted-style .icon-button-svg) {
fill: var(--action-button-deemphasized-fill-color);
}
@ -141,7 +153,8 @@
sameColorWhenPressed: false,
ariaHidden: false,
clickListener: true,
checked: false
checked: false,
count: 0
}),
store: () => store,
computed: {