michael/MusicTopus
1
0
Fork 0
forked from dbroqua/MusicTopus
Code Pull requests Activity

Some fixes on css

Browse source
This commit is contained in:
Damien Broqua 2022-02-23 08:41:30 +01:00
parent e2f4ddeb5a
commit c02d5e9ebd
12 changed files with 152 additions and 120 deletions
Download patch file Download diff file Expand all files Collapse all files

67
views/pages/mon-compte/ma-collection.ejs
View file

@ -1,4 +1,5 @@
<section class="layout-maxed ma-collection" id="app">
<main class="layout-maxed ma-collection" id="app">
<h1>Ma collection</h1>
<div class="filters">
<div class="field">
<label for="artist">Artiste</label>
@ -36,40 +37,40 @@
</select>
</div>
</div>
<div class="list" v-if="!loading" v-for="item in items">
<span class="title">
{{ item.artists_sort}} - {{ item.title }}
<span class="icon" @click="showConfirmDelete(item._id)">
&#xf1f8;
<div class="grid grid-cols-1 md:grid-cols-2 list">
<div class="item" v-if="!loading" v-for="item in items">
<span class="title">
{{ item.artists_sort}} - {{ item.title }}
<i class="icon-trash" @click="showConfirmDelete(item._id)"></i>
</span>
</span>
<div class="grid grid-cols-2 md:grid-cols-4">
<div>
<img :src="item.thumb" :alt="item.title" style="max-width: 120px;"/>
</div>
<div class="md:col-span-3">
<span><strong>Année :</strong> {{ item.year }}</span>
<br />
<span><strong>Pays :</strong> {{ item.country }}</span>
<br />
<span>
<strong>Format : </strong>
<span v-for="(format, index) in item.formats">
{{ format.name }}
<template v-if="format.descriptions">
(<template v-for="(description, j) in format.descriptions">
{{description}}<template v-if="j < format.descriptions.length - 1">, </template>
</template>)
</template>
<template v-if="index < item.formats.length - 1">, </template>
<div class="grid grid-cols-2 md:grid-cols-4">
<div>
<img :src="item.thumb" :alt="item.title" />
</div>
<div class="md:col-span-3">
<span><strong>Année :</strong> {{ item.year }}</span>
<br />
<span><strong>Pays :</strong> {{ item.country }}</span>
<br />
<span>
<strong>Format : </strong>
<span v-for="(format, index) in item.formats">
{{ format.name }}
<template v-if="format.descriptions">
(<template v-for="(description, j) in format.descriptions">
{{description}}<template v-if="j < format.descriptions.length - 1">, </template>
</template>)
</template>
<template v-if="index < item.formats.length - 1">, </template>
</span>
</span>
</span>
<br />
<span><strong>Genre :</strong> <template v-for="(genre, index) in item.genres">{{ genre }}<template v-if="index < item.genres.length - 1">, </template></template></span>
<br />
<span><strong>Style :</strong> <template v-for="(style, index) in item.styles">{{ style }}<template v-if="index < item.styles.length - 1">, </template></template></span>
<br />
<span><strong>Genre :</strong> <template v-for="(genre, index) in item.genres">{{ genre }}<template v-if="index < item.genres.length - 1">, </template></template></span>
<br />
<span><strong>Style :</strong> <template v-for="(style, index) in item.styles">{{ style }}<template v-if="index < item.styles.length - 1">, </template></template></span>
</div>
</div>
</div>
</div>
</div>
<div class="total">
<strong>Nombre total d'éléments : </strong>{{total}}
@ -106,7 +107,7 @@
</footer>
</div>
</div>
</section>
</main>
<script>
Vue.createApp({