feat(about): cleanup ui

This commit is contained in:
Philipp Dormann 2024-11-21 16:55:58 +01:00
parent 3532968b33
commit 84aa846b87
Signed by: philipp
GPG Key ID: 3BB9ADD52DCA4314

View File

@ -31,7 +31,7 @@
}} }}
> >
<div <div
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0" class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 sm:block sm:p-0"
> >
<div class="fixed inset-0 transition-opacity" aria-hidden="true"> <div class="fixed inset-0 transition-opacity" aria-hidden="true">
<div <div
@ -67,7 +67,7 @@
/></svg /></svg
> >
</div> </div>
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left"> <div class="mt-3 sm:mt-0 sm:ml-4 sm:text-left">
<h3 class="text-lg leading-6 font-medium"> <h3 class="text-lg leading-6 font-medium">
{$_("read-license")} {$_("read-license")}
</h3> </h3>
@ -96,41 +96,28 @@
</div> </div>
{/if} {/if}
<!-- /// --> <!-- /// -->
<div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12"> <section class="container p-5">
<div class="text-center mb-8"> <h4 class="mb-1 text-3xl font-extrabold leading-tight font-mono">
<h1
class="mt-9 font-display text-4xl leading-none font-semibold text-white sm:text-5xl lg:text-6xl"
>
{$_("about")} {$_("about")}
🧾 </h4>
</h1> <p class="mt-2 mb-2">
<p
class="mt-2 max-w-xl mx-auto text-xl lg:max-w-3xl lg:text-2xl text-gray-300"
>
Lauf für Kaya! Lauf für Kaya!
<strong class="text-white font-medium"> <strong class="font-medium">
{$_("by")} {$_("by")}
<a href="https://odit.services" class="underline">ODIT.Services</a> <a href="https://odit.services" class="underline">ODIT.Services</a>
</strong> </strong>
<br /> <br />
<span class="text-lg">{$_("lfk-is-os")}</span> <span>{$_("lfk-is-os")}</span>
</p> </p>
</div> <h4 class="mb-1 text-3xl font-extrabold leading-tight font-mono">
</div>
<div class="pt-0 pb-16 overflow-hidden lg:pt-12 lg:py-24">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-display font-semibold md:text-5xl">
{$_("credits")} {$_("credits")}
</h2> </h4>
<div class="max-w-3xl mx-auto text-xl leading-8 font-medium mt-8"> <p class="text-left">{$_("oss_credit_description")}</p>
<p class="text-center">{$_("oss_credit_description")}</p> <div class="mt-5 overflow-x-auto">
</div>
<div class="w-screen leading-8 pl-5 mt-5">
{#await license_promise} {#await license_promise}
<p class="text-center w-full">{$_("licenses-are-being-loaded")}</p> <p>{$_("licenses-are-being-loaded")}</p>
{:then} {:then}
<table> <table class="font-mono">
<thead class="border-b border-gray-400"> <thead class="border-b border-gray-400">
<tr class="odd:bg-white even:bg-gray-100"> <tr class="odd:bg-white even:bg-gray-100">
<th>{$_("dependency_name")}</th> <th>{$_("dependency_name")}</th>
@ -142,17 +129,17 @@
</thead> </thead>
<tbody> <tbody>
{#each licenses as l} {#each licenses as l}
<tr class="odd:bg-white even:bg-gray-100"> <tr class="odd:bg-white even:bg-gray-100 *:p-2">
<td>{l.name}</td> <td>{l.name}</td>
<td> <td>
{l.license || "?"}<br /><button <button
class="underline cursor-pointer" class="underline cursor-pointer"
on:click={() => { on:click={() => {
modal_open = true; modal_open = true;
currentlicense = l.name + "@" + l.version; currentlicense = l.name + "@" + l.version;
licensetext = licensetext =
l.licensetext || $_("no-license-text-could-be-found"); l.licensetext || $_("no-license-text-could-be-found");
}}>{$_("read-license")}</button }}>{l.license || "?"}</button
> >
</td> </td>
<td> <td>
@ -177,9 +164,9 @@
</div> </div>
{/await} {/await}
</div> </div>
<div class="w-full leading-8 mt-8"> <div class="w-full mt-8">
<p class="text-xl font-medium">{$_("icon-image-credits")}</p> <p class="font-medium">{$_("icon-image-credits")}</p>
<ul class="list-disc"> <ul class="list-disc ml-6">
<li> <li>
<a <a
class="underline" class="underline"
@ -206,5 +193,4 @@
</li> </li>
</ul> </ul>
</div> </div>
</div> </section>
</div>