Cutlery/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-09 03:04:54 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix: text overflow on RecipeCard (#1830)

Browse Source 
* fix the text overflow on RecipeCard

* add a wrapper class for description text for recipes
This commit is contained in:
Jambaldorj Ochirpurev 2022-11-27 20:33:03 +01:00 committed by GitHub
parent 01aac0ca5d
commit ac6554efdd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/components/Domain/Recipe/RecipeCard.vue
View File

@ -19,7 +19,9 @@
<v-expand-transition v-if="description">
<div v-if="hover" class="d-flex transition-fast-in-fast-out secondary v-card--reveal" style="height: 100%">
<v-card-text class="v-card--text-show white--text">
{{ description }}
<div class="descriptionWrapper">
{{ description}}
</div>
</v-card-text>
</div>
</v-expand-transition>
@ -143,4 +145,10 @@ export default defineComponent({
overflow: hidden;
text-overflow: ellipsis;
}
.descriptionWrapper{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 8;
overflow: hidden;
}
</style>