Added LinkCard

LinkCard is the component that deals with links on the homepage.
This commit is contained in:
Louis Hollingworth 2022-05-21 22:10:00 +01:00
parent ca7034738b
commit b230abc48b
No known key found for this signature in database
GPG key ID: 1E66DEA3F5D623D1
4 changed files with 49 additions and 26 deletions

37
components/LinkCard.vue Normal file
View file

@ -0,0 +1,37 @@
<template>
<a class="card" :href="link">
<p>{{ title }}</p>
<p>{{ description }}</p>
</a>
</template>
<script>
export default {
props: ['title', 'description', 'link'],
};
</script>
<style lang="scss" scoped>
.card {
margin: 1rem;
padding: 1.5rem;
text-align: left;
color: inherit;
text-decoration: none;
border: 2px solid #000;
border-radius: 10px;
transition: color 0.15s ease, border-color 0.15s ease;
}
.card:link,
.card:visited {
color: #000;
}
.card:hover,
.card:focus,
.card:active {
color: #0070f3 !important;
border-color: #0070f3;
}
</style>