Update navigation links to open in new window.
This commit is contained in:
parent
a878edab19
commit
a88e0108c6
2 changed files with 21 additions and 24 deletions
|
|
@ -41,12 +41,12 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body d-flex flex-column">
|
<div class="modal-body d-flex flex-column">
|
||||||
<textLink
|
<textLink
|
||||||
linkType="navigation"
|
linkType="newWindowLink"
|
||||||
text="Terms of use"
|
text="Terms of use"
|
||||||
href="//www.safelite.com/terms-of-use"
|
href="//www.safelite.com/terms-of-use"
|
||||||
target="_blank" />
|
target="_blank" />
|
||||||
<textLink
|
<textLink
|
||||||
linkType="navigation"
|
linkType="newWindowLink"
|
||||||
text="Your privacy choices"
|
text="Your privacy choices"
|
||||||
href="//www.safelite.com/privacy-center"
|
href="//www.safelite.com/privacy-center"
|
||||||
target="_blank">
|
target="_blank">
|
||||||
|
|
@ -58,12 +58,12 @@
|
||||||
</template>
|
</template>
|
||||||
</textLink>
|
</textLink>
|
||||||
<textLink
|
<textLink
|
||||||
linkType="navigation"
|
linkType="newWindowLink"
|
||||||
text="Warranty"
|
text="Warranty"
|
||||||
href="//www.safelite.com/national-lifetime-warranty"
|
href="//www.safelite.com/national-lifetime-warranty"
|
||||||
target="_blank" />
|
target="_blank" />
|
||||||
<textLink
|
<textLink
|
||||||
linkType="navigation"
|
linkType="newWindowLink"
|
||||||
text="Notice at collection"
|
text="Notice at collection"
|
||||||
href="https://www.safelite.com/ccpa-privacy-policy"
|
href="https://www.safelite.com/ccpa-privacy-policy"
|
||||||
target="_blank" />
|
target="_blank" />
|
||||||
|
|
@ -177,9 +177,6 @@ export default {
|
||||||
.modal-fullscreen {
|
.modal-fullscreen {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
}
|
}
|
||||||
.navigation-link {
|
|
||||||
margin-bottom: 1.5rem;
|
|
||||||
}
|
|
||||||
.modal-footer {
|
.modal-footer {
|
||||||
border-top: none;
|
border-top: none;
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
|
|
|
||||||
|
|
@ -1,20 +1,28 @@
|
||||||
<template>
|
<template>
|
||||||
<loadingModal v-if="useLoadingModal" notFullScreen ref="loadingModal" />
|
<loadingModal v-if="useLoadingModal" notFullScreen ref="loadingModal" />
|
||||||
<a v-if="linkType === 'navigation'" @click="handleClick" class="navigation-link" :href="href"
|
<a v-if="linkType === 'navigation'"
|
||||||
|
@click="handleClick"
|
||||||
|
class="navigation-link"
|
||||||
|
:href="href"
|
||||||
>{{ text }}<slot name="after-text"></slot
|
>{{ text }}<slot name="after-text"></slot
|
||||||
></a>
|
></a>
|
||||||
<a
|
<a
|
||||||
v-else-if="linkType === 'footer'"
|
v-else-if="linkType === 'newWindowLink'"
|
||||||
@click="handleClick"
|
@click="handleClick"
|
||||||
class="footer-link"
|
class="new-window-link"
|
||||||
:href="href"
|
:href="href"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>{{ text }}<slot name="after-text"></slot
|
>{{ text }}<slot name="after-text"></slot
|
||||||
></a>
|
></a>
|
||||||
<a v-else-if="linkType === 'textSmall'" @click="handleClick" class="small" :href="href"
|
<a v-else-if="linkType === 'textSmall'"
|
||||||
|
@click="handleClick"
|
||||||
|
class="small"
|
||||||
|
:href="href"
|
||||||
>{{ text }}<slot name="after-text"></slot
|
>{{ text }}<slot name="after-text"></slot
|
||||||
></a>
|
></a>
|
||||||
<a v-else-if="linkType === 'text'" @click="handleClick" :href="href"
|
<a v-else-if="linkType === 'text'"
|
||||||
|
@click="handleClick"
|
||||||
|
:href="href"
|
||||||
>{{ text }}<slot name="after-text"></slot
|
>{{ text }}<slot name="after-text"></slot
|
||||||
></a>
|
></a>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -74,23 +82,15 @@ a {
|
||||||
color: $blue-700;
|
color: $blue-700;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.navigation-link {
|
&.navigation-link,
|
||||||
|
&.new-window-link {
|
||||||
color: $black;
|
color: $black;
|
||||||
line-height: 26px;
|
line-height: 26px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
&.footer-link {
|
&.new-window-link {
|
||||||
color: $gray-600;
|
margin-bottom: 1.5rem;
|
||||||
text-decoration: none;
|
|
||||||
line-height: 20px;
|
|
||||||
padding: 0 0 2px 0;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
&:hover {
|
|
||||||
padding: 0 0 2px 0;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue