Coffee journaling on ATProto (alpha)
alpha.arabica.social
coffee
fix: styling fix
+23
-23
+23
-23
internal/templates/manage.tmpl
+23
-23
internal/templates/manage.tmpl
···
412
412
413
413
<!-- Bean Form Modal -->
414
414
<div x-show="showBeanForm" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center z-50">
415
-
<div class="bg-white rounded-lg p-8 max-w-md w-full mx-4">
416
-
<h3 class="text-xl font-semibold mb-4" x-text="editingBean ? 'Edit Bean' : 'Add Bean'"></h3>
415
+
<div class="bg-brown-100 rounded-lg border border-brown-300 p-8 max-w-md w-full mx-4">
416
+
<h3 class="text-xl font-semibold mb-4 text-gray-800" x-text="editingBean ? 'Edit Bean' : 'Add Bean'"></h3>
417
417
<div class="space-y-4">
418
418
<input type="text" x-model="beanForm.name" placeholder="Name *"
419
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
419
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
420
420
<input type="text" x-model="beanForm.origin" placeholder="Origin *"
421
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
422
-
<select x-model.number="beanForm.roaster_id" class="w-full rounded-md border-gray-300 py-2 px-3">
421
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
422
+
<select x-model.number="beanForm.roaster_id" class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3">
423
423
<option value="">Select Roaster (Optional)</option>
424
424
{{range .Roasters}}
425
425
<option value="{{.ID}}">{{.Name}}</option>
426
426
{{end}}
427
427
</select>
428
-
<select x-model="beanForm.roast_level" class="w-full rounded-md border-gray-300 py-2 px-3">
428
+
<select x-model="beanForm.roast_level" class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3">
429
429
<option value="">Select Roast Level (Optional)</option>
430
430
<option value="Ultra-Light">Ultra-Light</option>
431
431
<option value="Light">Light</option>
···
435
435
<option value="Dark">Dark</option>
436
436
</select>
437
437
<input type="text" x-model="beanForm.process" placeholder="Process (e.g. Washed, Natural, Honey)"
438
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
438
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
439
439
<textarea x-model="beanForm.description" placeholder="Description" rows="3"
440
-
class="w-full rounded-md border-gray-300 py-2 px-3"></textarea>
440
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3"></textarea>
441
441
<div class="flex gap-2">
442
442
<button @click="saveBean()"
443
443
class="flex-1 bg-brown-600 text-white px-4 py-2 rounded hover:bg-brown-700">Save</button>
···
450
450
451
451
<!-- Roaster Form Modal -->
452
452
<div x-show="showRoasterForm" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center z-50">
453
-
<div class="bg-white rounded-lg p-8 max-w-md w-full mx-4">
454
-
<h3 class="text-xl font-semibold mb-4" x-text="editingRoaster ? 'Edit Roaster' : 'Add Roaster'"></h3>
453
+
<div class="bg-brown-100 rounded-lg border border-brown-300 p-8 max-w-md w-full mx-4">
454
+
<h3 class="text-xl font-semibold mb-4 text-gray-800" x-text="editingRoaster ? 'Edit Roaster' : 'Add Roaster'"></h3>
455
455
<div class="space-y-4">
456
456
<input type="text" x-model="roasterForm.name" placeholder="Name *"
457
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
457
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
458
458
<input type="text" x-model="roasterForm.location" placeholder="Location"
459
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
459
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
460
460
<input type="url" x-model="roasterForm.website" placeholder="Website"
461
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
461
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
462
462
<div class="flex gap-2">
463
463
<button @click="saveRoaster()"
464
464
class="flex-1 bg-brown-600 text-white px-4 py-2 rounded hover:bg-brown-700">Save</button>
···
471
471
472
472
<!-- Grinder Form Modal -->
473
473
<div x-show="showGrinderForm" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center z-50">
474
-
<div class="bg-white rounded-lg p-8 max-w-md w-full mx-4">
475
-
<h3 class="text-xl font-semibold mb-4" x-text="editingGrinder ? 'Edit Grinder' : 'Add Grinder'"></h3>
474
+
<div class="bg-brown-100 rounded-lg border border-brown-300 p-8 max-w-md w-full mx-4">
475
+
<h3 class="text-xl font-semibold mb-4 text-gray-800" x-text="editingGrinder ? 'Edit Grinder' : 'Add Grinder'"></h3>
476
476
<div class="space-y-4">
477
477
<input type="text" x-model="grinderForm.name" placeholder="Name *"
478
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
479
-
<select x-model="grinderForm.grinder_type" class="w-full rounded-md border-gray-300 py-2 px-3">
478
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
479
+
<select x-model="grinderForm.grinder_type" class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3">
480
480
<option value="">Select Grinder Type *</option>
481
481
<option value="Hand">Hand</option>
482
482
<option value="Electric">Electric</option>
483
483
<option value="Electric Hand">Electric Hand</option>
484
484
</select>
485
-
<select x-model="grinderForm.burr_type" class="w-full rounded-md border-gray-300 py-2 px-3">
485
+
<select x-model="grinderForm.burr_type" class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3">
486
486
<option value="">Select Burr Type (Optional)</option>
487
487
<option value="Conical">Conical</option>
488
488
<option value="Flat">Flat</option>
489
489
</select>
490
490
<textarea x-model="grinderForm.notes" placeholder="Notes" rows="3"
491
-
class="w-full rounded-md border-gray-300 py-2 px-3"></textarea>
491
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3"></textarea>
492
492
<div class="flex gap-2">
493
493
<button @click="saveGrinder()"
494
494
class="flex-1 bg-brown-600 text-white px-4 py-2 rounded hover:bg-brown-700">Save</button>
···
501
501
502
502
<!-- Brewer Form Modal -->
503
503
<div x-show="showBrewerForm" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center z-50">
504
-
<div class="bg-white rounded-lg p-8 max-w-md w-full mx-4">
505
-
<h3 class="text-xl font-semibold mb-4" x-text="editingBrewer ? 'Edit Brewer' : 'Add Brewer'"></h3>
504
+
<div class="bg-brown-100 rounded-lg border border-brown-300 p-8 max-w-md w-full mx-4">
505
+
<h3 class="text-xl font-semibold mb-4 text-gray-800" x-text="editingBrewer ? 'Edit Brewer' : 'Add Brewer'"></h3>
506
506
<div class="space-y-4">
507
507
<input type="text" x-model="brewerForm.name" placeholder="Name *"
508
-
class="w-full rounded-md border-gray-300 py-2 px-3" />
508
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3" />
509
509
<textarea x-model="brewerForm.description" placeholder="Description" rows="3"
510
-
class="w-full rounded-md border-gray-300 py-2 px-3"></textarea>
510
+
class="w-full rounded-md border-gray-300 bg-white shadow-sm py-2 px-3"></textarea>
511
511
<div class="flex gap-2">
512
512
<button @click="saveBrewer()"
513
513
class="flex-1 bg-brown-600 text-white px-4 py-2 rounded hover:bg-brown-700">Save</button>