From 0104e5a5af18ef5fc70783c42457506bc8c1d4b6 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Mon, 27 Oct 2025 22:49:22 +0700
Subject: [PATCH] refactor(formula): merubah tampilan card nya dan menyesuaikan
 quality di seeder

---
 database/seeders/FormulaSeeder.php                     |  6 +++---
 .../views/livewire/studio/master/formulas.blade.php    | 10 +++++++---
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/database/seeders/FormulaSeeder.php b/database/seeders/FormulaSeeder.php
index b020f3e..f7424ee 100644
--- a/database/seeders/FormulaSeeder.php
+++ b/database/seeders/FormulaSeeder.php
@@ -11,9 +11,9 @@ class FormulaSeeder extends Seeder
     public function run(): void
     {
         $ratios = [
-            'PREMIUM' => 2 / 3,
-            'SUPER PREMIUM' => 3 / 4,
-            'MURNI' => 1.0,
+            'Premium' => 2 / 3,
+            'Super Premium' => 3 / 4,
+            'Murni' => 1.0,
         ];
 
         $sizes = Bottle::distinct()->pluck('size');
diff --git a/resources/views/livewire/studio/master/formulas.blade.php b/resources/views/livewire/studio/master/formulas.blade.php
index 41eb78c..053f1b6 100644
--- a/resources/views/livewire/studio/master/formulas.blade.php
+++ b/resources/views/livewire/studio/master/formulas.blade.php
@@ -3,7 +3,7 @@
         <div>
             <flux:heading size="xl">{{ $pageTitle }}</flux:heading>
         </div>
-        @can ('create formula')
+        @can('create formula')
             <div>
                 <flux:modal.trigger name="form-modal">
                     <flux:button variant="primary" class="text-sm"
@@ -15,10 +15,14 @@
     </div>
 
     <div class="mt-6">
-        <div class="mt-6 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-6 gap-4">
+        <div class="mt-6 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
             @foreach ($formulas as $key => $formula)
                 <flux:card class="space-y-2">
-                    <flux:heading size="xl">Ukuran {{ $key }} ml</flux:heading>
+                    <div class="mb-4 pb-3 border-b border-gray-200">
+                        <flux:heading size="xl" class="flex items-center gap-2">
+                            <flux:badge color="blue" size="lg">{{ $key }} ml</flux:badge>
+                        </flux:heading>
+                    </div>
                     @foreach ($formula as $item)
                         <flux:callout variant="secondary" inline>
                             <div class="flex items-center space-x-1">