Button
10 months ago
HostingerTools
10 months ago
Icon
10 months ago
Loaders
10 months ago
Modals
10 months ago
AccordionCard.vue
10 months ago
Card.vue
10 months ago
CircleLoader.vue
10 months ago
CopyField.vue
10 months ago
Label.vue
10 months ago
NoResults.vue
10 months ago
Notice.vue
1 year ago
OverheadButton.vue
10 months ago
PluginSplitNotice.vue
10 months ago
Stepper.vue
10 months ago
Toggle.vue
10 months ago
Notice.vue
31 lines
| 1 | <script setup lang="ts"> |
| 2 | |
| 3 | import Icon from "@/components/Icon/Icon.vue"; |
| 4 | |
| 5 | type Props = { |
| 6 | text: string; |
| 7 | }; |
| 8 | const props = defineProps<Props>(); |
| 9 | |
| 10 | </script> |
| 11 | <template> |
| 12 | <div class="hostinger-notice d-flex align-items-center w-100 mt-3"> |
| 13 | <Icon |
| 14 | name="icon-info" |
| 15 | color="gray-dark" |
| 16 | /> |
| 17 | <p class="text-body-3">{{props?.text}}</p> |
| 18 | </div> |
| 19 | </template> |
| 20 | |
| 21 | <style lang="scss" scoped> |
| 22 | .hostinger-notice { |
| 23 | background: var(--gray-light); |
| 24 | color: var(--gray-dark); |
| 25 | border: 1px solid var(--gray-border); |
| 26 | border-radius: 12px; |
| 27 | padding: 12px 16px; |
| 28 | font-size: var(--font-size-sm); |
| 29 | gap: 1em; |
| 30 | } |
| 31 | </style> |