|
|
@ -23,15 +23,13 @@ |
|
|
class:active |
|
|
class:active |
|
|
class="spectrum-Button spectrum-Button--size{size.toUpperCase()}" |
|
|
class="spectrum-Button spectrum-Button--size{size.toUpperCase()}" |
|
|
{disabled} |
|
|
{disabled} |
|
|
on:click|preventDefault |
|
|
on:click|preventDefault> |
|
|
> |
|
|
|
|
|
{#if icon} |
|
|
{#if icon} |
|
|
<svg |
|
|
<svg |
|
|
class="spectrum-Icon spectrum-Icon--size{size.toUpperCase()}" |
|
|
class="spectrum-Icon spectrum-Icon--size{size.toUpperCase()}" |
|
|
focusable="false" |
|
|
focusable="false" |
|
|
aria-hidden="true" |
|
|
aria-hidden="true" |
|
|
aria-label={icon} |
|
|
aria-label={icon}> |
|
|
> |
|
|
|
|
|
<use xlink:href="#spectrum-icon-18-{icon}" /> |
|
|
<use xlink:href="#spectrum-icon-18-{icon}" /> |
|
|
</svg> |
|
|
</svg> |
|
|
{/if} |
|
|
{/if} |
|
|
@ -46,4 +44,7 @@ |
|
|
overflow: hidden; |
|
|
overflow: hidden; |
|
|
text-overflow: ellipsis; |
|
|
text-overflow: ellipsis; |
|
|
} |
|
|
} |
|
|
|
|
|
.active { |
|
|
|
|
|
color: var(--spectrum-global-color-blue-600) !important; |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |
|
|
|