introducing size configuration

tallstackui · Sep 16, 2024 · 8255042 · 8255042
1 parent c905d71
commit 8255042
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 8 deletions.
diff --git a/config/envbar.php b/config/envbar.php
@@ -21,6 +21,16 @@
     */
     'disable_on_tests' => env('ENVBAR_DISABLE_ON_TESTS', true),
 
+    /*
+    |--------------------------------------------------------------------------
+    | Fixed
+    |--------------------------------------------------------------------------
+    |
+    | Determines the size of the EnvBar. Allowed: xs, sm, md, lg, xl.
+    |
+    */
+    'size' => env('ENVBAR_SIZE', 'md'),
+
     /*
     |--------------------------------------------------------------------------
     | Fixed

diff --git a/dist/app.css b/dist/app.css
diff --git a/resources/views/components/badge.blade.php b/resources/views/components/badge.blade.php
@@ -1,4 +1,9 @@
-<div @class([ 'eb-text-sm eb-font-medium eb-px-2.5 eb-py-0.5 eb-mx-1.5 eb-rounded-xl eb-shadow-inner', $color])>
+<div @class([
+        'eb-text-sm eb-font-medium eb-mx-1.5 eb-rounded-xl eb-shadow-inner',
+        'eb-px-1 eb-p' => $size === 'xs',
+        'eb-px-1 eb-p-0.5' => $size === 'sm',
+        'eb-px-2.5 eb-py-0.5' => $size === 'md' || $size === 'lg' || $size === 'xl',
+    $color])>
     @if ($icon)
         <div>
             {{ $icon }}

diff --git a/resources/views/components/envbar.blade.php b/resources/views/components/envbar.blade.php
@@ -1,14 +1,19 @@
 <div @class([
         'eb-border-l-6',
-        'eb-top-0 eb-p-3 eb-z-50',
+        'eb-top-0 eb-z-50',
+        'eb-p-0.5' => $configuration['size'] === 'xs',
+        'eb-p-1' => $configuration['size'] === 'sm',
+        'eb-p-3' => $configuration['size'] === 'md',
+        'eb-p-4' => $configuration['size'] === 'lg',
+        'eb-p-5' => $configuration['size'] === 'xl',
         'eb-sticky' => $configuration['fixed'],
         $colors['background']
     ]) x-data="envbar(@js($configuration))" x-show="show" id="envbar-{{ $id }}">
     <div class="eb-flex eb-flex-wrap eb-items-center eb-space-x-1 eb-gap-1">
         <div class="eb-inline-flex eb-items-center eb-gap-1">
             <x-envbar::icons.laravel @class($colors['icons']) />
             <p>@lang('envbar::messages.environment')</p>
-            <x-envbar::badge>
+            <x-envbar::badge :size="$configuration['size']">
                 {{ $environment['environment'] }}
             </x-envbar::badge>
         </div>
@@ -17,15 +22,15 @@
             <x-envbar::icons.fork @class($colors['icons']) />
             <div class="eb-inline-flex eb-items-center">
                 <p>@lang('envbar::messages.branch')</p>
-                <x-envbar::badge>{{ $environment['branch'] }}</x-envbar::badge>
+                <x-envbar::badge :size="$configuration['size']">{{ $environment['branch'] }}</x-envbar::badge>
             </div>
         </div>
         @endif
         @if ($environment['release'] !== null)
         <div class="eb-inline-flex eb-items-center eb-gap-1">
             <x-envbar::icons.tag @class($colors['icons']) />
             <p>@lang('envbar::messages.release')</p>
-            <x-envbar::badge>{{ $environment['release'] }}</x-envbar::badge>
+            <x-envbar::badge :size="$configuration['size']">{{ $environment['release'] }}</x-envbar::badge>
         </div>
         @endif
         @if ($configuration['warning_message'])
@@ -38,7 +43,7 @@
         <div class="eb-flex eb-items-center eb-absolute eb-right-2" id="envbar-{{ $id }}-right-side">
             @if ($configuration['tailwind_breaking_points'])
             <div class="eb-items-center eb-gap-1">
-                <x-envbar::badge><span x-text="resolution"></span></x-envbar::badge>
+                <x-envbar::badge :size="$configuration['size']"><span x-text="resolution"></span></x-envbar::badge>
             </div>
             @endif
             @if ($configuration['closable']['enabled'])

diff --git a/src/Compilers/EnvBarComponentCompiler.php b/src/Compilers/EnvBarComponentCompiler.php
@@ -25,6 +25,7 @@ public function __invoke(): array
         $variables = ['configuration', 'colors', 'environment'];
 
         foreach ([
+            'size',
             'fixed',
             'closable',
             'warning_message',

diff --git a/src/View/Components/Badge.php b/src/View/Components/Badge.php
@@ -9,9 +9,16 @@ class Badge extends BaseComponent
 {
     public function __construct(
         public ?string $text = null,
+        public ?string $size = null,
         public ComponentSlot|string|null $icon = null,
     ) {
-        //
+        $this->size = match ($this->size) {
+            'xs' => 'xs',
+            'sm' => 'sm',
+            'lg' => 'lg',
+            'xl' => 'xl',
+            default => 'md',
+        };
     }
 
     public function blade(): View