A bit more styling

Author: EduardoOliveira

frontend/public/index.css

@@ -2939,6 +2939,10 @@ input.tab:checked + .tab-content,
   margin: 0.5rem;
 }
 
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
 .mb-5 {
   margin-bottom: 1.25rem;
 }
@@ -3259,16 +3263,16 @@ input.tab:checked + .tab-content,
   padding-bottom: 0.5rem;
 }
 
-.pb-1 {
-  padding-bottom: 0.25rem;
-}
-
 .pb-2 {
   padding-bottom: 0.5rem;
 }
 
-.pt-1 {
-  padding-top: 0.25rem;
+.pt-0 {
+  padding-top: 0px;
+}
+
+.pt-2 {
+  padding-top: 0.5rem;
 }
 
 .text-left {

v2/library/web/comp/edit.templ

@@ -4,14 +4,14 @@ import "github.com/eduardooliveira/stLib/v2/utils"
 
 templ Edit(m *EditModel) {
 	<div
-		class="flex flex-col w-96 bg-base-200 rounded-box p-2"
+		class="flex flex-col w-96 bg-base-200 rounded-box p-2 pt-0"
 		:class="tab == 'edit' ? '' : 'hidden'"
 		hx-get="/lib/edit"
 		hx-trigger="tab-edit from:body"
 		hx-vals="js:{assetID:event.detail.assetID}"
 	>
 		if m!=nil {
-			<h1>Edit</h1>
+			<a class="btn btn-ghost text-xl">Edit</a>
 			<form hx-post="/lib/edit" hx-vals="unset">
 				<input type="hidden" name="id" value={ m.Asset.ID }/>
 				<div>

v2/library/web/comp/view3d.templ

@@ -11,14 +11,14 @@ templ View3D() {
 		class="flex flex-col w-96 bg-base-200 rounded-box p-2"
 		:class="tab == 'viewer' ? '' : 'hidden'"
 	>
-		<p>3D Viewer</p>
+		<a class="btn btn-ghost text-xl">3D Viewer</a>
 		<div
 			class="h-72 viewer-container bg-slate-400"
 			x-ref="viewerContainer"
 			hx-preserve="true"
 		></div>
 		<div
-			class="model-list flex flex-col pt-1"
+			class="model-list flex flex-col pt-2"
 			hx-get="/lib/viewer/list"
 			hx-vals="js:{assetID:event.detail.assetID}"
 			hx-trigger="viewer-model-list-add from:body"
@@ -28,9 +28,9 @@ templ View3D() {
 }
 
 templ ViewerAssetElement(asset entities.Asset) {
-	<div class="flex pb-1 bg-base-300">
-		<div class="avatar">
-			<div class="w-12 h-12 rounded">
+	<div class="flex mb-1 flex-row h-12 bg-base-300 rounded-lg">
+		<div class="avatar flex-none w-12">
+			<div class="rounded">
 				<img
 					src={ fmt.Sprintf("/lib/%s/file", utils.VoZ(asset.Thumbnail)) }
 					alt="Tailwind-CSS-Avatar-component"
@@ -43,7 +43,7 @@ templ ViewerAssetElement(asset entities.Asset) {
 		</div>
 		<div class="">
 			<button
-				class="btn btn-square w-12 h-12"
+				class="btn btn-square w-12 h-12 btn-ghost"
 				type="button"
 				name="delete"
 				@click={ fmt.Sprintf("deleteModel($el,'%s')", asset.ID) }