diff --git a/src/lib/components/uncap/TranscendenceStar.svelte b/src/lib/components/uncap/TranscendenceStar.svelte index 7a4c69f3..afa84a9e 100644 --- a/src/lib/components/uncap/TranscendenceStar.svelte +++ b/src/lib/components/uncap/TranscendenceStar.svelte @@ -11,6 +11,7 @@ editable?: boolean interactive?: boolean tabindex?: number + size?: 'regular' | 'small' onStarClick?: () => void onFragmentClick?: (newStage: number) => void onFragmentHover?: (newStage: number) => void @@ -23,6 +24,7 @@ editable = false, interactive = false, tabindex, + size = 'regular', onStarClick, onFragmentClick, onFragmentHover @@ -165,6 +167,7 @@ class:stage3={stage === 3} class:stage4={stage === 4} class:stage5={stage === 5} + class:small={size === 'small'} onclick={handleClick} onmouseleave={interactive ? handleMouseLeave : undefined} bind:this={starElement} @@ -211,6 +214,10 @@ position: relative; cursor: pointer; + &.small { + --size: 12px; + } + &:hover { transform: scale(1.2); } @@ -332,6 +339,10 @@ transform: scale(1.2); } } + + &.small .figure { + --size: 12px; + } } .popover { diff --git a/src/lib/components/uncap/UncapIndicator.svelte b/src/lib/components/uncap/UncapIndicator.svelte index 82dd0c23..2c555d61 100644 --- a/src/lib/components/uncap/UncapIndicator.svelte +++ b/src/lib/components/uncap/UncapIndicator.svelte @@ -15,6 +15,8 @@ special?: boolean | undefined className?: string | undefined editable?: boolean | undefined + contained?: boolean | undefined + size?: 'regular' | 'small' | undefined updateUncap?: ((index: number) => void) | undefined updateTranscendence?: ((index: number) => void) | undefined } @@ -27,6 +29,7 @@ ulb?: boolean index: number tabindex?: number + size?: 'regular' | 'small' onStarClick: (index: number, empty: boolean) => void } @@ -38,6 +41,7 @@ editable?: boolean interactive?: boolean tabindex?: number + size?: 'regular' | 'small' onStarClick?: () => void onFragmentClick?: (newStage: number) => void onFragmentHover?: (newStage: number) => void @@ -58,6 +62,8 @@ special = false, className, editable = false, + contained = false, + size = 'regular', updateUncap, updateTranscendence }: Props = $props() @@ -119,6 +125,7 @@ type, editable, interactive: editable, + size, onFragmentClick: editable ? handleTranscendenceUpdate : undefined } } @@ -137,6 +144,7 @@ ulb: options.ulb, special: options.special, tabindex: editable ? 0 : undefined, + size, onStarClick: editable ? toggleStar : () => {} } } @@ -194,7 +202,7 @@ } -