Better design

This commit is contained in:
Florian Hoss 2022-10-23 19:02:51 +02:00
parent 6817fe60ee
commit 05af2c773d
2 changed files with 23 additions and 10 deletions

2
go.mod
View file

@ -1,6 +1,6 @@
module godash
go 1.18
go 1.19
require (
github.com/dariubs/percent v1.0.0

View file

@ -62,35 +62,48 @@
{{ if .System.Static.CPU.Name }}
<div class="grid grid-cols-1 md:grid-cols-3 gap-5 mb-6 md:mb-10 select-none text-sm">
<div class="flex items-center">
<svg class="h-6 w-6 shrink-0 mr-2 text-slate-300">
<svg class="h-8 w-8 shrink-0 mr-2 text-slate-700 dark:text-slate-300">
<use xlink:href="#cpu"></use>
</svg>
<div class="w-full truncate">
<div class="truncate">{{ .System.Static.CPU.Name }}</div>
<div class="bg-slate-700 h-px mt-1">
<div id="systemCpuPercentage" class="transition-[width] duration-700 bg-slate-200 h-px" style="width: {{ .System.Live.CPU.Percentage }}%"></div>
<div class="text-slate-700 dark:text-slate-300 truncate">{{ .System.Static.CPU.Threads }} Threads</div>
<div class="bg-slate-300 dark:bg-slate-700 h-px mt-1">
<div
id="systemCpuPercentage"
class="transition-[width] duration-700 bg-slate-800 dark:bg-slate-200 h-px"
style="width: {{ .System.Live.CPU.Percentage }}%"
></div>
</div>
</div>
</div>
<div class="flex items-center">
<svg class="h-6 w-6 shrink-0 mr-2 text-slate-300">
<svg class="h-8 w-8 shrink-0 mr-2 text-slate-700 dark:text-slate-300">
<use xlink:href="#ram"></use>
</svg>
<div class="w-full truncate">
<div class="truncate">{{ .System.Live.Ram.Value }} / {{ .System.Static.Ram }}</div>
<div class="bg-slate-700 h-px mt-1">
<div id="systemRamPercentage" class="transition-[width] duration-700 bg-slate-200 h-px" style="width: {{ .System.Live.Ram.Percentage }}%"></div>
<div class="bg-slate-300 dark:bg-slate-700 h-px mt-1">
<div
id="systemRamPercentage"
class="transition-[width] duration-700 bg-slate-800 dark:bg-slate-200 h-px"
style="width: {{ .System.Live.Ram.Percentage }}%"
></div>
</div>
</div>
</div>
<div class="flex items-center">
<svg class="h-6 w-6 shrink-0 mr-2 text-slate-300">
<svg class="h-8 w-8 shrink-0 mr-2 text-slate-700 dark:text-slate-300">
<use xlink:href="#disk"></use>
</svg>
<div class="w-full truncate">
<div class="truncate">{{ .System.Live.Disk.Value }} / {{ .System.Static.Disk }}</div>
<div class="bg-slate-700 h-px mt-1">
<div id="systemDiskPercentage" class="transition-[width] duration-700 bg-slate-200 h-px" style="width: {{ .System.Live.Disk.Percentage }}%"></div>
<div class="bg-slate-300 dark:bg-slate-700 h-px mt-1">
<div
id="systemDiskPercentage"
class="transition-[width] duration-700 bg-slate-800 dark:bg-slate-200 h-px"
style="width: {{ .System.Live.Disk.Percentage }}%"
></div>
</div>
</div>
</div>