ColumnWrapper.vue
2 years ago
CxVuiCollapseMini.vue
2 years ago
CxVuiDate.vue
2 years ago
CxVuiFSelect.vue
2 years ago
CxVuiPopup.vue
2 years ago
CxVuiSelect.vue
2 years ago
CxVuiTabs.vue
2 years ago
CxVuiTabsPanel.vue
2 years ago
Delimiter.vue
2 years ago
DetailsTable.vue
2 years ago
DetailsTableRow.vue
2 years ago
DetailsTableRowValue.vue
2 years ago
ExternalLink.vue
2 years ago
ListComponents.vue
2 years ago
PrintButton.vue
2 years ago
RowWrapper.vue
2 years ago
Tooltip.vue
2 years ago
ExternalLink.vue
43 lines
| 1 | <template> |
| 2 | <a |
| 3 | :href="href" |
| 4 | target="_blank" |
| 5 | class="cx-vui-external-link" |
| 6 | rel="external noreferrer noopener" |
| 7 | > |
| 8 | <slot></slot> |
| 9 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" |
| 10 | class="cx-vui-external-link__icon" aria-hidden="true" focusable="false"> |
| 11 | <path |
| 12 | d="M18.2 17c0 .7-.6 1.2-1.2 1.2H7c-.7 0-1.2-.6-1.2-1.2V7c0-.7.6-1.2 1.2-1.2h3.2V4.2H7C5.5 4.2 4.2 5.5 4.2 7v10c0 1.5 1.2 2.8 2.8 2.8h10c1.5 0 2.8-1.2 2.8-2.8v-3.6h-1.5V17zM14.9 3v1.5h3.7l-6.4 6.4 1.1 1.1 6.4-6.4v3.7h1.5V3h-6.3z"></path> |
| 13 | </svg> |
| 14 | </a> |
| 15 | </template> |
| 16 | |
| 17 | <script> |
| 18 | import i18n from '../mixins/i18n'; |
| 19 | |
| 20 | export default { |
| 21 | name: 'ExternalLink', |
| 22 | mixins: [ |
| 23 | i18n, |
| 24 | ], |
| 25 | props: { |
| 26 | href: { |
| 27 | type: String, |
| 28 | default: '', |
| 29 | }, |
| 30 | }, |
| 31 | }; |
| 32 | </script> |
| 33 | |
| 34 | <style lang="scss"> |
| 35 | .cx-vui-external-link { |
| 36 | &__icon { |
| 37 | width: 1em; |
| 38 | height: 1em; |
| 39 | fill: currentcolor; |
| 40 | vertical-align: middle; |
| 41 | } |
| 42 | } |
| 43 | </style> |