MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch '694-narrow-cards' into 'master' 

Fix #694: resizing issues on album cards

See merge request funkwhale/funkwhale!591
This commit is contained in:
Eliot Berriot 2019-02-08 17:36:27 +01:00
parent d702f8f69f 53ff2027ef
commit 407d5585dc
3 changed files with 22 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
changes/changelog.d/694.bugfix Normal file
View File

@ -0,0 +1 @@
Fixed resizing issues for album cards on artist pages (#694)

28
front/src/components/audio/album/Card.vue
View File

@ -22,7 +22,8 @@
<td class="play-cell"> <td class="play-cell">
<play-button class="basic icon" :track="track" :discrete="true"></play-button> <play-button class="basic icon" :track="track" :discrete="true"></play-button>
</td> </td>
<td colspan="6"> <td class="content-cell" colspan="5">
<track-favorite-icon :track="track"></track-favorite-icon>
<router-link class="track discrete link" :to="{name: 'library.tracks.detail', params: {id: track.id }}"> <router-link class="track discrete link" :to="{name: 'library.tracks.detail', params: {id: track.id }}">
<template v-if="track.position"> <template v-if="track.position">
{{ track.position }}. {{ track.position }}.
@ -30,9 +31,6 @@
{{ track.title }} {{ track.title }}
</router-link> </router-link>
</td> </td>
<td>
<track-favorite-icon :track="track"></track-favorite-icon>
</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -92,16 +90,28 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss"> <style scoped lang="scss">
.content-cell {
table.fixed td.play-cell { .link,
overflow: auto; .button {
padding: 0.5em 0;
}
.link {
margin-left: 0.5em;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} }
tr { tr {
.favorite-icon:not(.favorited) { .favorite-icon:not(.favorited) {
display: none; visibility: hidden;
} }
&:hover .favorite-icon { &:hover .favorite-icon {
display: inherit; visibility: visible;
}
.favorite-icon {
float: right;
} }
} }
.expand { .expand {

6
front/src/components/library/Artist.vue
View File

@ -44,10 +44,8 @@
<h2> <h2>
<translate>Albums by this artist</translate> <translate>Albums by this artist</translate>
</h2> </h2>
<div class="ui stackable doubling three column grid"> <div class="ui cards" >
<div class="column" :key="album.id" v-for="album in albums"> <album-card :mode="'rich'" :album="album" :key="album.id" v-for="album in albums"></album-card>
<album-card :mode="'rich'" class="fluid" :album="album"></album-card>
</div>
</div> </div>
</section> </section>
<section v-if="tracks.length > 0" class="ui vertical stripe segment"> <section v-if="tracks.length > 0" class="ui vertical stripe segment">