fix: audio preview sizing issue

This commit is contained in:
Tomáš Mládek 2023-04-13 23:18:39 +02:00
parent 06787ada24
commit be7cc11e36

View file

@ -61,8 +61,9 @@
} }
</script> </script>
<div class="preview" bind:clientHeight> <div class="preview">
{#if handled} {#if handled}
<div class="inner" bind:clientHeight>
{#if !loaded} {#if !loaded}
<Spinner centered="absolute" /> <Spinner centered="absolute" />
{/if} {/if}
@ -114,7 +115,7 @@
on:error={() => (handled = false)} on:error={() => (handled = false)}
/> />
{#if mediaDuration} {#if mediaDuration}
<div class="duration" style="--font-size: {clientHeight * 0.28}px"> <div class="duration" style="--font-size: {clientHeight * 0.66}px">
{mediaDuration} {mediaDuration}
</div> </div>
{/if} {/if}
@ -138,6 +139,7 @@
/> />
</div> </div>
{/if} {/if}
</div>
{:else} {:else}
<div class="hashbadge"> <div class="hashbadge">
<HashBadge {address} /> <HashBadge {address} />
@ -153,6 +155,10 @@
min-height: 0; min-height: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.inner {
display: relative;
}
} }
.hashbadge { .hashbadge {
@ -201,8 +207,8 @@
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr);
padding: .25rem; padding: 0.25rem;
gap: .25rem; gap: 0.25rem;
border: 1px solid var(--foreground); border: 1px solid var(--foreground);
border-radius: 4px; border-radius: 4px;