chore: update launch button to be more present

This commit is contained in:
2025-12-06 12:40:37 +01:00
parent adf40b70cb
commit 3029cc66fb

View File

@@ -114,11 +114,6 @@
const tabs = [ const tabs = [
{ name: 'Home', key: 'home', show: true }, { name: 'Home', key: 'home', show: true },
{
name: 'Skins',
key: 'skins',
show: false,
},
{ {
name: 'Settings', name: 'Settings',
key: 'settings', key: 'settings',
@@ -1035,11 +1030,12 @@
</div> </div>
<Button <Button
size="lg" size="lg"
class="text-xl h-16 px-16 border-2 border-violet-500/40"
disabled={$launching || $osuInstallationPath === '' || $serverConnectionFails > 1} disabled={$launching || $osuInstallationPath === '' || $serverConnectionFails > 1}
onclick={launch} onclick={launch}
> >
<Play /> <Play class="!size-5" />
{$serverConnectionFails > 1 ? 'No connection' : 'Launch'} {$launching ? 'Launching...' : $serverConnectionFails > 1 ? 'No connection' : 'Launch'}
</Button> </Button>
</div> </div>
<div <div
@@ -1087,8 +1083,6 @@
</span> </span>
</div> </div>
</div> </div>
{:else if selectedTab === 'skins'}
<p>list of skins here, option to set current skin (also a subpage to download new skins?)</p>
{:else if selectedTab === 'settings'} {:else if selectedTab === 'settings'}
<div <div
class="bg-theme-900/90 flex flex-col justify-center gap-3 border border-theme-800/90 rounded-lg" class="bg-theme-900/90 flex flex-col justify-center gap-3 border border-theme-800/90 rounded-lg"
@@ -1290,3 +1284,27 @@
{/if} {/if}
</div> </div>
</div> </div>
<style>
.launch {
margin-top: 24px;
padding: 16px 48px;
font-size: 1.1rem;
font-weight: 600;
background: linear-gradient(135deg, #c7a6ff, #9f7cff);
color: #120a1f;
border-radius: 14px;
box-shadow: 0 8px 30px rgba(160, 120, 255, 0.4);
transition:
transform 120ms ease,
box-shadow 120ms ease;
}
.launch:hover {
transform: translateY(-1px);
box-shadow: 0 12px 42px rgba(160, 120, 255, 0.6);
}
</style>