andrea/probo-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refine the main UI (add search button)

Browse source
This commit is contained in:
Andrea Fazzi 2023-06-30 18:20:42 +02:00
parent 6d40444de0
commit 931ba4ec68
2 changed files with 212 additions and 190 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
frontend/src/routes/+layout.svelte
View file

@ -25,23 +25,11 @@
target="_blank"
rel="noreferrer"
>
Discord
</a>
<a
class="btn btn-sm variant-ghost-surface"
href="https://twitter.com/SkeletonUI"
target="_blank"
rel="noreferrer"
>
Twitter
</a>
<a
class="btn btn-sm variant-ghost-surface"
href="https://github.com/skeletonlabs/skeleton"
target="_blank"
rel="noreferrer"
>
GitHub
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" />
</svg>
<span>Search</span>
</a>
</svelte:fragment>
</AppBar>

62
frontend/src/routes/+page.svelte
View file

@ -1,18 +1,15 @@
<!-- YOU CAN DELETE EVERYTHING IN THIS PAGE -->
<div class="h-full flex flex-col">
<div class="card p-4 m-4 font-heading-token">
<div class="card p-4 m-4 font-heading-token">
<header class="p-3 flex justify-end">
<span class="badge variant-filled"><h1 class="text-xs">1ad25d0000</h1></span>
</header>
<hr class="opacity-50" />
<p class="p-4">
Per intensità di corrente elettrica si intende
</p>
<form id="question1">
<div class="space-y-2 p-4">
<label class="flex items-center space-x-2">
@ -36,14 +33,13 @@
<hr class="opacity-50" />
<footer class="p-3 flex justify-start items-center space-x-4">
<div class="flex-auto flex gap-1">
<span class="badge chip variant-filled-tertiary">#foo</span>
<span class="badge variant-filled-tertiary">#bar</span>
<span class="badge variant-filled-tertiary">#biz</span>
<span class="badge chip variant-filled-tertiary">#corrente</span>
<span class="badge chip variant-filled-tertiary">#quinte</span>
<span class="badge chip variant-filled-tertiary">#circuiti</span>
</div>
<div class="flex-auto flex justify-end">
<small>Created on {new Date().toLocaleDateString()}</small>
</div>
</footer>
</div>
@ -51,9 +47,7 @@
<header class="p-3 flex justify-end">
<span class="badge variant-filled"><h1 class="text-xs">1ad25d0000</h1></span>
</header>
<hr class="opacity-50" />
<p class="p-4">
Affinché in un circuito possa circolare corrente continua, il generatore di tensione
</p>
@ -82,16 +76,56 @@
<footer class="p-3 flex justify-start items-center space-x-4">
<div class="flex-auto flex gap-1">
<span class="badge variant-filled-tertiary">#foo</span>
<span class="badge variant-filled-tertiary">#bar</span>
<span class="badge variant-filled-tertiary">#biz</span>
<span class="badge chip variant-filled-tertiary">#corrente</span>
<span class="badge chip variant-filled-tertiary">#quinte</span>
<span class="badge chip variant-filled-tertiary">#circuiti</span>
</div>
<div class="flex-auto flex justify-end">
<small>Created on {new Date().toLocaleDateString()}</small>
</div>
</footer>
</div>
<div class="card p-4 m-4 font-heading-token">
<header class="p-3 flex justify-end">
<span class="badge variant-filled"><h1 class="text-xs">1ad25d0000</h1></span>
</header>
<hr class="opacity-50" />
<p class="p-4">
Affinché in un circuito possa circolare corrente continua, il generatore di tensione
</p>
<form id="question_2">
<div class="space-y-2 p-4">
<label class="flex items-center space-x-2">
<input class="radio" type="radio" checked name="radio-direct" value="1" />
<p>Fornisce una potenza pari a quella dissipata per effetto Joule</p>
</label>
<label class="flex items-center space-x-2">
<input class="radio" type="radio" name="radio-direct" value="2" />
<p>Fornisce una potenza minore a quella dissipata per effetto Joule</p>
</label>
<label class="flex items-center space-x-2">
<input class="radio" type="radio" name="radio-direct" value="3" />
<p>Rallenta le cariche elettriche</p>
</label>
<label class="flex items-center space-x-2">
<input class="radio" type="radio" name="radio-direct" value="3" />
<p>Dev'essere spento</p>
</label>
</div>
</form>
<footer class="p-3 flex justify-start items-center space-x-4">
<div class="flex-auto flex gap-1">
<span class="badge chip variant-filled-tertiary">#corrente</span>
<span class="badge chip variant-filled-tertiary">#quinte</span>
<span class="badge chip variant-filled-tertiary">#circuiti</span>
</div>
<div class="flex-auto flex justify-end">
<small>Created on {new Date().toLocaleDateString()}</small>
</div>
</footer>
</div>
</div>