github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-22 14:33:33 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 20

Fixed varying card height on smaller screens

Browse source
This commit is contained in:
hay-kot 2021-02-19 18:27:48 -09:00
commit 31f281c069
1 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/components/UI/RecipeCard.vue
View file

@ -14,12 +14,16 @@
style="height: 100%;" style="height: 100%;"
> >
<v-card-text class="v-card--text-show white--text"> <v-card-text class="v-card--text-show white--text">
{{ description }} {{ description | truncate(300) }}
</v-card-text> </v-card-text>
</div> </div>
</v-expand-transition> </v-expand-transition>
</v-img> </v-img>
<v-card-title class="my-n3 mb-n6">{{ name | truncate(30) }}</v-card-title> <v-card-title class="my-n3 mb-n6 ">
<div class="headerClass">
{{ name }}
</div>
</v-card-title>
<v-card-actions class=""> <v-card-actions class="">
<v-row dense align="center"> <v-row dense align="center">
@ -75,4 +79,10 @@ export default {
.v-card--text-show { .v-card--text-show {
opacity: 1 !important; opacity: 1 !important;
} }
.headerClass {
white-space: nowrap;
word-break: normal;
overflow: hidden;
text-overflow: ellipsis;
}
</style> </style>