lfk/frontend
2
0
Fork 0
Code Issues 3 Pull Requests Actions Projects Releases Wiki Activity

feat(about): cleanup ui

Browse Source
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
1 changed files with 189 additions and 203 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/components/general/About.svelte
View File

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