Coffee journaling on ATProto (alpha)
alpha.arabica.social
coffee
feat: tweak recipe cards to match other card styles
authored by
Patrick Dewey
and committed by
Tangled
8739a5c7
4c75975d
+9
-10
+3
-3
internal/web/components/popular_recipes.templ
+3
-3
internal/web/components/popular_recipes.templ
···
58
58
}
59
59
<!-- Stats -->
60
60
<div class="grid grid-cols-3 gap-1.5 mb-2">
61
-
<div class="text-center bg-brown-50/60 rounded py-1">
61
+
<div class="text-center rounded py-1">
62
62
<span class="block text-[10px] text-brown-500 uppercase tracking-wide">Coffee</span>
63
63
<span class="block text-xs font-medium text-brown-900">{ formatAmount(recipe.CoffeeAmount) }</span>
64
64
</div>
65
-
<div class="text-center bg-brown-50/60 rounded py-1">
65
+
<div class="text-center rounded py-1">
66
66
<span class="block text-[10px] text-brown-500 uppercase tracking-wide">Water</span>
67
67
<span class="block text-xs font-medium text-brown-900">{ formatAmount(recipe.WaterAmount) }</span>
68
68
</div>
69
-
<div class="text-center bg-brown-50/60 rounded py-1">
69
+
<div class="text-center rounded py-1">
70
70
<span class="block text-[10px] text-brown-500 uppercase tracking-wide">Ratio</span>
71
71
<span class="block text-xs font-medium text-brown-900">{ formatRatio(recipe) }</span>
72
72
</div>
+6
-7
internal/web/pages/recipe_view.templ
+6
-7
internal/web/pages/recipe_view.templ
···
71
71
<h3 class="text-sm font-medium text-brown-600 uppercase tracking-wider mb-2"><span class="inline-flex items-center gap-1">@components.IconDroplet()
72
72
Pours</span></h3>
73
73
<div class="space-y-2">
74
-
for i, pour := range props.Recipe.Pours {
75
-
<div class="flex items-center gap-4 bg-brown-50 rounded-lg px-3 py-2 border border-brown-200">
76
-
<span class="text-sm font-medium text-brown-700">Pour { fmt.Sprintf("%d", i+1) }</span>
77
-
<span class="text-sm text-brown-900">{ fmt.Sprintf("%dg", pour.WaterAmount) }</span>
78
-
if pour.TimeSeconds > 0 {
79
-
<span class="text-sm text-brown-600">at { fmt.Sprintf("%ds", pour.TimeSeconds) }</span>
80
-
}
74
+
for _, pour := range props.Recipe.Pours {
75
+
<div class="flex justify-between items-center bg-white p-3 rounded-lg border border-brown-200">
76
+
<div class="flex gap-4 text-sm">
77
+
<span class="font-semibold text-brown-800">{ fmt.Sprintf("%dg", pour.WaterAmount) }</span>
78
+
<span class="text-brown-600">{ "for " + bff.FormatTime(pour.TimeSeconds) }</span>
79
+
</div>
81
80
</div>
82
81
}
83
82
</div>