alert.php
69 lines
| 1 | <?php |
| 2 | |
| 3 | /** |
| 4 | * Alert component. |
| 5 | * @var string $title |
| 6 | * @var string $desc |
| 7 | * @var string $buttonText |
| 8 | * @var string $buttonUrl |
| 9 | * @var bool $closeable |
| 10 | * @var string $id |
| 11 | * @var string $style |
| 12 | * @var string $class |
| 13 | * @var string $variant info|success|warning|danger |
| 14 | * |
| 15 | * @package WPStaging\Component |
| 16 | * @see \WPStaging\Component\Alert::render() |
| 17 | */ |
| 18 | ?> |
| 19 | <div |
| 20 | <?php if (!empty($id)) : ?> |
| 21 | id="<?php echo esc_attr($id); ?>" |
| 22 | <?php endif; ?> |
| 23 | class="wpstg-callout wpstg-callout-<?php echo esc_attr($variant); ?> wpstg-mt-4 wpstg-mb-2 <?php echo esc_attr($class); ?>" |
| 24 | style="<?php echo esc_attr($style); ?>"> |
| 25 | <?php if ($variant === 'success') : ?> |
| 26 | <svg class="wpstg-w-5 wpstg-h-5 wpstg-flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> |
| 27 | <circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path> |
| 28 | </svg> |
| 29 | <?php elseif ($variant === 'info') : ?> |
| 30 | <svg class="wpstg-w-5 wpstg-h-5 wpstg-flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> |
| 31 | <circle cx="12" cy="12" r="10"></circle><path d="M12 16v-4"></path><path d="M12 8h.01"></path> |
| 32 | </svg> |
| 33 | <?php elseif ($variant === 'warning') : ?> |
| 34 | <svg class="wpstg-w-5 wpstg-h-5 wpstg-flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> |
| 35 | <path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"></path><path d="M12 9v4"></path><path d="M12 17h.01"></path> |
| 36 | </svg> |
| 37 | <?php else : ?> |
| 38 | <svg class="wpstg-w-5 wpstg-h-5 wpstg-flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> |
| 39 | <circle cx="12" cy="12" r="10"></circle><path d="m15 9-6 6"></path><path d="m9 9 6 6"></path> |
| 40 | </svg> |
| 41 | <?php endif; ?> |
| 42 | <div class="wpstg-flex-1 wpstg-min-w-0"> |
| 43 | <span class="wpstg-banner-text"></span> |
| 44 | <?php if (!empty($title)) : ?> |
| 45 | <p class="wpstg-m-0 wpstg-font-semibold"> |
| 46 | <?php echo esc_html($title); ?> |
| 47 | </p> |
| 48 | <?php endif; ?> |
| 49 | <?php if (!empty($desc)) : ?> |
| 50 | <p class="wpstg-m-0 <?php echo !empty($title) ? 'wpstg-mt-1' : ''; ?>"> |
| 51 | <?php echo wp_kses_post($desc); ?> |
| 52 | </p> |
| 53 | <?php endif; ?> |
| 54 | <?php if (!empty($buttonText)) : ?> |
| 55 | <?php $url = !empty($buttonUrl) ? esc_url($buttonUrl) : '#'; ?> |
| 56 | <a href="<?php echo esc_url($url); ?>" target="_blank" rel="noopener" class="wpstg-btn wpstg-btn-sm wpstg-btn-danger wpstg-mt-2"> |
| 57 | <?php echo esc_html($buttonText); ?> |
| 58 | </a> |
| 59 | <?php endif; ?> |
| 60 | </div> |
| 61 | <?php if ($closeable) : ?> |
| 62 | <button type="button" class="wpstg-banner-close" title="<?php esc_attr_e('Close', 'wp-staging'); ?>" aria-label="<?php esc_attr_e('Close', 'wp-staging'); ?>"> |
| 63 | <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> |
| 64 | <path d="M18 6 6 18"/><path d="m6 6 12 12"/> |
| 65 | </svg> |
| 66 | </button> |
| 67 | <?php endif; ?> |
| 68 | </div> |
| 69 |