Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update <KExternalLink> with icon and noopener noreferrer attr #142

Merged
merged 13 commits into from
Jan 5, 2021
Merged

Update <KExternalLink> with icon and noopener noreferrer attr #142

Changes from 6 commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
41ff3c0
adds boolean prop openInNewTab
sairina Dec 1, 2020
3e76a9a
Update lib/buttons-and-links/KExternalLink.vue
sairina Dec 1, 2020
eaa6167
Add noopener noreferrer attr
sairina Dec 4, 2020
dfa66a6
Add noopener noreferrer attr and icon
sairina Dec 24, 2020
b669296
Merge remote-tracking branch 'upstream/v0.2.x' into kexternallink-fix
sairina Dec 24, 2020
eb6660a
Fix linting error
sairina Dec 24, 2020
c062a77
Update lib/buttons-and-links/KExternalLink.vue
sairina Dec 25, 2020
cd3b174
Add rtlFlip to make mirror-image of icon for rtl langs
sairina Dec 25, 2020
4c786b7
Merge remote-tracking branch 'origin/kexternallink-fix' into kexterna…
sairina Dec 25, 2020
70a766a
Remove icon prop and add space between icon and text
sairina Dec 25, 2020
7bfa833
Add check for whether or not is true to fix margin when link does no…
sairina Jan 4, 2021
fb5c1b5
Fix linting
sairina Jan 4, 2021
2d6a3dc
Fix margins for RTL-lang external links
sairina Jan 5, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 10 additions & 15 deletions lib/buttons-and-links/KExternalLink.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,23 +5,18 @@
:class="buttonClasses"
:href="href"
:download="download"
:openInNewTab="openInNewTab"
:target="openInNewTab ? '_blank' : false"
rel="noopener noreferrer"
dir="auto"
@mouseenter="hovering = true"
@mouseleave="hovering = false"
>
<slot name="icon">
<KIcon
v-if="icon"
:icon="icon"
style="top: 4px;"
:color="hovering ? $themeTokens.primaryDark : $themeTokens.primary"
/>
</slot>
<span class="link-text" :style="spanStyle">{{ text }}</span>
<slot name="iconAfter">
<slot name="openInNewTab">
<KIcon
v-if="iconAfter"
:icon="iconAfter"
v-if="openInNewTab"
icon="openNewTab"
style="top: 4px;"
:color="hovering ? $themeTokens.primaryDark : $themeTokens.primary"
/>
Expand Down Expand Up @@ -64,11 +59,11 @@
required: false,
},
/**
* If provided, shows a KIcon after the text
* If provided, opens link in new tab
sairina marked this conversation as resolved.
Show resolved Hide resolved
*/
iconAfter: {
type: String,
required: false,
openInNewTab: {
type: Boolean,
default: false,
},
},
data() {
Expand Down