src/components/PluginSearchRedirectButton.vue

<script setup lang="ts">

import Icon from "@/components/Icon.vue";

defineProps<{
    link: string
}>();

defineEmits<{
    (e: 'redirect-click'): void;
}>()


</script>

<template>
    <a class="redirect-button" :href="link" target="_blank" @click="$emit('redirect-click')">
        <span>Show more results</span>
        <icon class="category-icon" name="arrow" />
    </a>
</template>

<style scoped lang="scss">
@import '@/assets/mixins';
@import '@plugin/assets/_variables_override.scss';

.redirect-button {
    background: $complementary-900;

    @include button-orange;
    width: 100%;

    @media (max-width: $mobile-768-breakpoint) {
        padding: 16px 24px;
        width: 70%;
        > span {
            @include semibold-18-24;
        }
    }

    @media (min-width: $mobile-768-breakpoint) {
        width: 250px;
        margin-inline: auto;
    }

}
</style>