More icon updates for consistency
This commit is contained in:
parent
f9156765c0
commit
567cbf3ef8
|
@ -14,6 +14,7 @@
|
||||||
export let disabled = false
|
export let disabled = false
|
||||||
export let color
|
export let color
|
||||||
export let tooltip
|
export let tooltip
|
||||||
|
export let newStyles = false
|
||||||
|
|
||||||
$: rotation = getRotation(direction)
|
$: rotation = getRotation(direction)
|
||||||
|
|
||||||
|
@ -28,6 +29,7 @@
|
||||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||||
<div
|
<div
|
||||||
class="icon"
|
class="icon"
|
||||||
|
class:newStyles
|
||||||
on:mouseover={() => (showTooltip = true)}
|
on:mouseover={() => (showTooltip = true)}
|
||||||
on:focus={() => (showTooltip = true)}
|
on:focus={() => (showTooltip = true)}
|
||||||
on:mouseleave={() => (showTooltip = false)}
|
on:mouseleave={() => (showTooltip = false)}
|
||||||
|
@ -60,6 +62,9 @@
|
||||||
display: grid;
|
display: grid;
|
||||||
place-items: center;
|
place-items: center;
|
||||||
}
|
}
|
||||||
|
.newStyles {
|
||||||
|
color: var(--spectrum-global-color-gray-700);
|
||||||
|
}
|
||||||
|
|
||||||
svg.hoverable {
|
svg.hoverable {
|
||||||
pointer-events: all;
|
pointer-events: all;
|
||||||
|
@ -72,7 +77,10 @@
|
||||||
svg.hoverable:active {
|
svg.hoverable:active {
|
||||||
color: var(--spectrum-global-color-blue-400) !important;
|
color: var(--spectrum-global-color-blue-400) !important;
|
||||||
}
|
}
|
||||||
|
.newStyles svg.hoverable:hover,
|
||||||
|
.newStyles svg.hoverable:active {
|
||||||
|
color: var(--spectrum-global-color-gray-900) !important;
|
||||||
|
}
|
||||||
svg.disabled {
|
svg.disabled {
|
||||||
color: var(--spectrum-global-color-gray-500) !important;
|
color: var(--spectrum-global-color-gray-500) !important;
|
||||||
pointer-events: none !important;
|
pointer-events: none !important;
|
||||||
|
|
|
@ -65,7 +65,7 @@
|
||||||
{/if}
|
{/if}
|
||||||
<span />
|
<span />
|
||||||
{#if !empty}
|
{#if !empty}
|
||||||
<Icon name="Copy" hoverable on:click={copy} />
|
<Icon name="Copy" hoverable newStyles on:click={copy} />
|
||||||
{/if}
|
{/if}
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue