Files
enfrancais-app/src/components/globals/ButtonClose.vue
T
2021-06-04 18:07:18 +02:00

49 lines
671 B
Vue

<template>
<b-button
v-on="$listeners"
v-bind="$attrs"
variant="link"
class="btn-close"
>
<svg viewBox="0 0 19 19">
<path d="m 2,2 15,15" />
<path d="m 17,2 -15,15" />
</svg>
</b-button>
</template>
<script>
export default {
name: 'ButtonClose'
}
</script>
<style lang="scss" scoped>
.btn-close {
padding: 3px;
width: $btn-size;
height: $btn-size;
border: 0;
line-height: 0;
&:hover,
&:focus {
path {
stroke: $black;
}
}
svg {
width: 100%;
height: 100%;
}
path {
fill: none;
stroke: lighten($black, 30%);
stroke-width: 4px;
stroke-linecap: round;
}
}
</style>