mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[fix] realm ui

Browse Source
This commit is contained in:
kwaroran
2023-06-05 06:16:02 +09:00
parent b2a7861364
commit 9e8b73be62
1 changed files with 23 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/lib/UI/Hub.svelte
View File

@@ -53,31 +53,33 @@
</div> </div>
</div> </div>
<div class="w-full flex gap-4 p-2 flex-wrap justify-center"> <div class="w-full flex gap-4 p-2 flex-wrap justify-center">
{#each charas as chara} {#key charas}
<button class="bg-darkbg rounded-lg p-4 flex flex-col hover:bg-selected transition-colors relative lg:w-96 w-full items-start" on:click={() => { {#each charas as chara}
openedData = chara <button class="bg-darkbg rounded-lg p-4 flex flex-col hover:bg-selected transition-colors relative lg:w-96 w-full items-start" on:click={() => {
}}> openedData = chara
<div class="flex gap-2 w-full"> }}>
<img class="w-20 min-w-20 h-20 sm:h-28 sm:w-28 rounded-md object-top object-cover" alt={chara.name} src={`${hubURL}/resource/` + chara.img}> <div class="flex gap-2 w-full">
<div class="flex flex-col flex-grow min-w-0"> <img class="w-20 min-w-20 h-20 sm:h-28 sm:w-28 rounded-md object-top object-cover" alt={chara.name} src={`${hubURL}/resource/` + chara.img}>
<span class="text-white text-lg min-w-0 max-w-full text-ellipsis whitespace-nowrap overflow-hidden text-start">{chara.name}</span> <div class="flex flex-col flex-grow min-w-0">
<span class="text-gray-400 text-xs min-w-0 max-w-full text-ellipsis break-words max-h-8 whitespace-nowrap overflow-hidden text-start">{chara.desc}</span> <span class="text-white text-lg min-w-0 max-w-full text-ellipsis whitespace-nowrap overflow-hidden text-start">{chara.name}</span>
<div class="flex flex-wrap"> <span class="text-gray-400 text-xs min-w-0 max-w-full text-ellipsis break-words max-h-8 whitespace-nowrap overflow-hidden text-start">{chara.desc}</span>
{#each chara.tags as tag, i} <div class="flex flex-wrap">
{#if i < 4} {#each chara.tags as tag, i}
<div class="text-xs p-1 text-blue-400">{tag}</div> {#if i < 4}
{:else if i === 4} <div class="text-xs p-1 text-blue-400">{tag}</div>
<div class="text-xs p-1 text-blue-400">...</div> {:else if i === 4}
{/if} <div class="text-xs p-1 text-blue-400">...</div>
{/each} {/if}
{/each}
</div>
</div> </div>
</div> </div>
</div> </button>
</button> {/each}
{/each} {/key}
</div> </div>
<div class="w-full flex justify-center"> <div class="w-full flex justify-center">
<div> <div class="flex">
<button class="bg-darkbg h-14 w-14 min-w-14 rounded-lg ml-2 flex justify-center items-center hover:ring transition-shadow" on:click={() => { <button class="bg-darkbg h-14 w-14 min-w-14 rounded-lg ml-2 flex justify-center items-center hover:ring transition-shadow" on:click={() => {
if(page > 0){ if(page > 0){
page -= 1 page -= 1