Merge pull request #21 from dissto/add-border

Add border

README.md

@@ -96,6 +96,16 @@ SimpleAlert::make('example')
     ->description('This is the description')
 ```
 
+### Border
+
+You can add a border to the alert by using the `border` method.
+
+```php
+use CodeWithDennis\SimpleAlert\Components\Infolists\SimpleAlert;
+
+SimpleAlert::make('example')
+    ->border(true)
+```
 ### Actions
 
 You can also add actions to the alert by using the `actions` method. All regular action features are supported.

resources/views/components/simple-alert-entry.blade.php

@@ -7,5 +7,6 @@
             :link="$getLink()"
             :link-label="$getLinkLabel()"
             :link-blank="$getLinkBlank()"
+            :border="$getBorder()"
     />
 </x-dynamic-component>

resources/views/components/simple-alert-field.blade.php

@@ -8,5 +8,6 @@
             :link-label="$getLinkLabel()"
             :link-blank="$getLinkBlank()"
             :actions="$getActions()"
+            :border="$getBorder()"
     />
 </x-dynamic-component>

resources/views/components/simple-alert.blade.php

@@ -1,5 +1,6 @@
 @props([
     'actions' => null,
+    'border' => false,
     'color' => null,
     'description' => null,
     'icon' => null,
@@ -13,13 +14,16 @@
     use function Filament\Support\get_color_css_variables;
 
     $colors = \Illuminate\Support\Arr::toCssStyles([
-           get_color_css_variables($color, shades: [50, 400, 500, 600, 700, 800]),
+           get_color_css_variables($color, shades: [50, 100, 400, 500, 600, 700, 800]),
    ]);
 @endphp
 
 <div
         x-data="{}"
-        class="filament-simple-alert rounded-md bg-custom-50 p-4 dark:bg-gray-900 dark:ring-white/10"
+        @class([
+          'filament-simple-alert rounded-md bg-custom-50 p-4 dark:bg-gray-900 ',
+          'ring-1 ring-custom-100 dark:ring-white/10' => $border,
+        ])
         style="{{ $colors }}">
     <div class="flex">
         @if($icon)

src/Components/Concerns/HasBorder.php

@@ -0,0 +1,22 @@
+<?php
+
+namespace CodeWithDennis\SimpleAlert\Components\Concerns;
+
+use Closure;
+
+trait HasBorder
+{
+    protected Closure|bool $border = false;
+
+    public function border(Closure|bool $condition = false): static
+    {
+        $this->border = $condition;
+
+        return $this;
+    }
+
+    public function getBorder(): bool
+    {
+        return $this->evaluate($this->border);
+    }
+}

src/Components/Forms/SimpleAlert.php

@@ -3,6 +3,7 @@
 namespace CodeWithDennis\SimpleAlert\Components\Forms;
 
 use Closure;
+use CodeWithDennis\SimpleAlert\Components\Concerns\HasBorder;
 use CodeWithDennis\SimpleAlert\Components\Concerns\HasColor;
 use CodeWithDennis\SimpleAlert\Components\Concerns\HasDescription;
 use CodeWithDennis\SimpleAlert\Components\Concerns\HasIcon;
@@ -13,6 +14,7 @@
 
 class SimpleAlert extends Field
 {
+    use HasBorder;
     use HasColor;
     use HasDescription;
     use HasIcon;