Mirrors/koel
2
0
Fork 0
mirror of https://github.com/koel/koel synced 2024-11-24 21:23:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

Fix artist/album name overflow on mobile

Browse source
This commit is contained in:
An Phan 2016-07-08 08:48:12 +08:00
parent 1661d7861f
commit c6ab0ed14e
No known key found for this signature in database
GPG key ID: 05536BB4BCDC02A2
3 changed files with 22 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
resources/assets/js/components/shared/album-item.vue
View file

@ -6,13 +6,15 @@
</a>
</span>
<footer>
<a class="name" @click.prevent="viewAlbumDetails(album)">{{ album.name }}</a>
<span class="sep">by</span>
<a class="artist" v-if="isNormalArtist"
@click.prevent="viewArtistDetails(album.artist)">
{{ album.artist.name }}
</a>
<span class="artist nope" v-else>{{ album.artist.name }}</span>
<div class="info">
<a class="name" @click.prevent="viewAlbumDetails(album)">{{ album.name }}</a>
<span class="sep">by</span>
<a class="artist" v-if="isNormalArtist"
@click.prevent="viewArtistDetails(album.artist)">
{{ album.artist.name }}
</a>
<span class="artist nope" v-else>{{ album.artist.name }}</span>
</div>
<p class="meta">
<span class="left">
{{ album.songs.length | pluralize('song') }}

4
resources/assets/js/components/shared/artist-item.vue
View file

@ -6,7 +6,9 @@
</a>
</span>
<footer>
<a class="name" @click.prevent="viewArtistDetails(artist)">{{ artist.name }}</a>
<div class="info">
<a class="name" @click.prevent="viewArtistDetails(artist)">{{ artist.name }}</a>
</div>
<p class="meta">
<span class="left">
{{ artist.albums.length | pluralize('album') }}

10
resources/assets/sass/partials/_mixins.scss
View file

@ -129,6 +129,7 @@
padding: 16px;
background: #333;
flex: 1;
overflow: hidden;
}
.name {
@ -166,6 +167,15 @@
.as-list & {
display: inline;
white-space: inherit;
}
}
.info {
.as-list & {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}