infojune.old/src/components/SoftBox.vue

52 lines
853 B
Vue
Executable File

<template>
<div id="softbox">
<img width="200px" :src="getImgUrl(img)" :alt='name'>
<h3>{{name}}</h3>
<p>{{desc}}</p>
<div class="btn-container-softbox">
<a class="sb button buttons" v-for="item in href_array" :key="item" target="_blank" :href="item"></a>
</div>
</div>
</template>
<script>
export default {
created: function(){
this.split();
},
props: {
img:String,
name:String,
desc:String,
href:String,
pubkey:String,
},
methods: {
getImgUrl(pic) {
return require('../assets/'+pic)
},
split: function(){
this.href_array = this.href.split(",");
}
}
}
</script>
<style>
#softbox{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.btn-container-softbox{
display:grid;
grid-template-columns: repeat(2, 50%);
}
.buttons{
margin-right:10px;
}
</style>