yadunut/clan-core
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Webview: css font and icon import transformation

Browse Source
This commit is contained in:
Johannes Kirschbauer
2024-05-30 18:22:38 +02:00
parent 5caba68a54
commit fc9f3e9da9
6 changed files with 158 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
pkgs/webview-ui/app/src/routes/machines/view.tsx
View File

@@ -20,7 +20,7 @@ export const MachineListView: Component = () => {
<Switch>
<Match when={loading()}>
{/* Loading skeleton */}
<li>
<div>
<div class="card card-side m-2 bg-base-100 shadow-lg">
<figure class="pl-2">
<div class="skeleton size-12"></div>
@@ -32,43 +32,45 @@ export const MachineListView: Component = () => {
<div class="skeleton h-8 w-72"></div>
</div>
</div>
</li>
</div>
</Match>
<Match when={!loading() && Object.entries(machines()).length === 0}>
No machines found
</Match>
<Match when={!loading()}>
<For each={list()}>
{(entry) => (
<li>
<div class="card card-side m-2 bg-base-100 shadow-lg">
<figure class="pl-2">
<span class="material-icons content-center text-5xl">
devices_other
</span>
</figure>
<div class="card-body flex-row justify-between">
<div class="flex flex-col">
<h2 class="card-title">{entry.machine_name}</h2>
<p
classList={{
"text-gray-400": !entry.machine_description,
"text-gray-600": !!entry.machine_description,
}}
>
{entry.machine_description || "No description"}
</p>
</div>
<div>
<button class="btn btn-ghost">
<span class="material-icons">more_vert</span>
</button>
<ul>
<For each={list()}>
{(entry) => (
<li>
<div class="card card-side m-2 bg-base-100 shadow-lg">
<figure class="pl-2">
<span class="material-icons content-center text-5xl">
devices_other
</span>
</figure>
<div class="card-body flex-row justify-between">
<div class="flex flex-col">
<h2 class="card-title">{entry.machine_name}</h2>
<p
classList={{
"text-gray-400": !entry.machine_description,
"text-gray-600": !!entry.machine_description,
}}
>
{entry.machine_description || "No description"}
</p>
</div>
<div>
<button class="btn btn-ghost">
<span class="material-icons">more_vert</span>
</button>
</div>
</div>
</div>
</div>
</li>
)}
</For>
</li>
)}
</For>
</ul>
</Match>
</Switch>
</div>