You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

simple-alert.blade.php 3.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. @props([
  2. 'actions' => null,
  3. 'actionsVerticalAlignment' => 'center',
  4. 'border' => false,
  5. 'color' => null,
  6. 'description' => null,
  7. 'icon' => null,
  8. 'iconVerticalAlignment' => 'center',
  9. 'link' => null,
  10. 'linkBlank' => false,
  11. 'linkLabel' => null,
  12. 'title' => null,
  13. ])
  14. @php
  15. use function Filament\Support\get_color_css_variables;
  16. $colors = \Illuminate\Support\Arr::toCssStyles([
  17. get_color_css_variables($color, shades: [50, 100, 400, 500, 700, 800]),
  18. ]);
  19. @endphp
  20. <div x-data="{}"
  21. @class([
  22. 'filament-simple-alert rounded-md bg-custom-50 p-4 dark:bg-custom-400/10',
  23. 'ring-1 ring-custom-100 dark:ring-custom-500/70' => $border,
  24. ])
  25. style="{{ $colors }}">
  26. <div class="flex gap-3">
  27. @if($icon)
  28. <div @class([
  29. 'flex-shrink-0',
  30. $iconVerticalAlignment === 'start' ? 'self-start' : 'self-center',
  31. ])>
  32. <x-filament::icon
  33. :icon="$icon"
  34. class="h-5 w-5 text-custom-400"
  35. />
  36. </div>
  37. @endif
  38. <div class="items-center flex-1 md:flex md:justify-between space-y-3 md:space-y-0 md:gap-3">
  39. @if($title || $description)
  40. <div class="space-y-0.5">
  41. @if($title)
  42. <p class="text-sm font-medium text-custom-800 dark:text-white">
  43. {{ $title }}
  44. </p>
  45. @endif
  46. @if($description)
  47. <p class="text-sm text-custom-700 dark:text-white">
  48. {{ $description }}
  49. </p>
  50. @endif
  51. </div>
  52. @endif
  53. @if($link || $actions)
  54. <div @class([
  55. 'flex items-center gap-3',
  56. $actionsVerticalAlignment === 'start' ? 'self-start' : 'self-center',
  57. ])>
  58. <div class="flex items-center whitespace-nowrap gap-3">
  59. @if($link)
  60. <p class="text-sm md:mt-0 self-center">
  61. <a href="{{ $link }}" {{ $linkBlank ? 'target="_blank"' : '' }} class="whitespace-nowrap font-medium text-custom-400 hover:text-custom-500">
  62. {{ $linkLabel }}
  63. <span aria-hidden="true"> &rarr;</span>
  64. </a>
  65. </p>
  66. @endif
  67. @if($actions)
  68. <div class="gap-3 flex items-center justify-start">
  69. @foreach ($actions as $action)
  70. @if ($action->isVisible())
  71. {{ $action }}
  72. @endif
  73. @endforeach
  74. </div>
  75. @endif
  76. </div>
  77. </div>
  78. @endif
  79. </div>
  80. </div>
  81. </div>