Joururi/spellsaurus
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Bound main schools to spell card class

Browse Source
This commit is contained in:
Alexis
2020-06-05 09:01:50 +02:00
parent d2dfe0fad9
commit e50a2158dc
3 changed files with 21 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/public/index.html
View File

@@ -7,7 +7,6 @@
<link rel="icon" href="<%= BASE_URL %>img/favicon.ico"> <link rel="icon" href="<%= BASE_URL %>img/favicon.ico">
<title>Spellsaurus</title> <title>Spellsaurus</title>
<link rel="stylesheet" href="<%= BASE_URL %>libs/style.css"> <link rel="stylesheet" href="<%= BASE_URL %>libs/style.css">
<script async defer src="<%= BASE_URL %>libs/masonry-4.2.2.min"></script>
</head> </head>
<body> <body>
<noscript> <noscript>

28
client/src/components/spells/spell-card.vue
View File

@@ -1,5 +1,7 @@
<template> <template>
<div class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer"> <div
:class="main_school"
class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer">
<div class="bg-white p-4 rounded text-dark border-primary shadow-sm" style="border-left:4px solid;"> <div class="bg-white p-4 rounded text-dark border-primary shadow-sm" style="border-left:4px solid;">
<div class="h3 font-display font-weight-bold text-wrap word-break line-height-100" :title="name"> <div class="h3 font-display font-weight-bold text-wrap word-break line-height-100" :title="name">
<a class="text-decoration-none text-primary" :href="'/spell/'+id">{{name}}</a> <a class="text-decoration-none text-primary" :href="'/spell/'+id">{{name}}</a>
@@ -20,10 +22,10 @@
<span v-for="(variable,index) in variables" :key="index"><span class="font-weight-bold"><span v-if="index!=0"><br></span>{{String.fromCharCode(120+index)}}</span> = {{variable.description}}</span> <span v-for="(variable,index) in variables" :key="index"><span class="font-weight-bold"><span v-if="index!=0"><br></span>{{String.fromCharCode(120+index)}}</span> = {{variable.description}}</span>
</div> </div>
</div> </div>
<!----><div class="text-right"> <div class="text-right">
<a class="h5 text-secondary mr-1" :href="'/spell/'+id+'/edit'"><i class="mad">edit</i></a> <a class="h5 text-secondary mr-1" :href="'/spell/'+id+'/edit'"><i class="mad">edit</i></a>
<a class="h5 text-danger" :href="'/spell/'+id+'/delete'"><i class="mad">delete</i></a> <a class="h5 text-danger" :href="'/spell/'+id+'/delete'"><i class="mad">delete</i></a>
</div><!----> </div>
</div> </div>
</div> </div>
</template> </template>
@@ -33,6 +35,7 @@
export default { export default {
name: 'spell-card', name: 'spell-card',
props: { props: {
// Model validation
id: Number, id: Number,
name: String, name: String,
description: String, description: String,
@@ -45,16 +48,25 @@ export default {
}, },
data() { data() {
return { return {
isFlipped: false, main_school: this.schools[0].name,
} }
}, },
created() {
this.main_school = this.main_school.toLowerCase();
},
methods: { methods: {
toggleCard: async function() {
this.isFlipped = !this.isFlipped;
}
}, },
} }
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped>
.spell-card {
&.lumomancie {
.border-primary {
border-left-color: #99dada !important;
color: #99dada;
}
}
}
</style>

4
client/src/components/spells/spells-list.vue
View File

@@ -46,7 +46,5 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.spells-list {
animation: none !important;
}
</style> </style>