update(News Widget 1 spaltig): adds padding and updates colors of the time and content when hovered

This commit is contained in:
SimonGschnell
2025-07-22 13:50:34 +02:00
parent 9ddb9f46fd
commit 6c57c17eb5
3 changed files with 21 additions and 7 deletions
+17
View File
@@ -96,6 +96,11 @@
}
}
.widgets-news{
padding: 0 .5rem;
overflow-y: auto;
}
.widgets-news img
{
max-width: 100%;
@@ -165,10 +170,22 @@
.fhc-news-items-lg .row:hover{
background-color: var(--fhc-primary);
color: var(--fhc-light) !important;
cursor: pointer;
}
.fhc-news-items-lg .row .news-truncate span{
color: var(--fhc-primary);
cursor: pointer;
}
.fhc-news-items-lg .row:hover .news-truncate span {
color: var(--fhc-light);
cursor: pointer;
}
.news-truncate {
display: -webkit-box;
-webkit-line-clamp: 2;
+1 -1
View File
@@ -189,7 +189,7 @@ export default {
</div>
</Transition>
</div>
<div v-if="ready" class="card-body overflow-hidden" style="padding: 0px;">
<div v-if="ready" class="card-body overflow-hidden" style="padding: .5em 0;">
<component :is="component" v-model:shared-data="sharedData" :config="arguments" :width="width" :height="height" @setConfig="setConfig" @change="changeConfigManually"></component>
</div>
<div v-else class="card-body overflow-hidden text-center d-flex flex-column justify-content-center"><i class="fa-solid fa-spinner fa-pulse fa-3x"></i></div>
+3 -6
View File
@@ -23,9 +23,6 @@ export default {
sizeClass() {
return 'fhc-news-' + ['xs', 'sm', 'md', 'lg'][this.size];
},
getNewsWidgetStyle() {
return this.width == 1 ? "padding: 1rem 1rem;" : "padding: 0px;"
},
newsList() {
//Return news amount depending on widget width and size
// let quantity = this.width;
@@ -219,7 +216,7 @@ export default {
},
template: /*html*/ `
<div ref="container" class="widgets-news h-100" :class="sizeClass" :style="getNewsWidgetStyle">
<div ref="container" class="widgets-news h-100" :class="sizeClass" >
<div class="d-flex flex-column h-100">
<div class="h-100 fhc-news-items-sm" style="overflow-y: auto" v-show="width == 1" >
<div v-for="(news, index) in newsList" :key="news.news_id" class="py-2">
@@ -239,8 +236,8 @@ export default {
<template v-for="news in newsList" :key="'menu-'+news.news_id" >
<div class="row m-0 py-2" @click="setSelected(news)">
<div class="col-md-12 d-flex mb-2">
<span class="small">{{ formatDate(news.insertamum) }} </span>
<span class="ms-auto small">{{ formatTime(news.insertamum) }} </span>
<span class="small ">{{ formatDate(news.insertamum) }} </span>
<span class="ms-auto small ">{{ formatTime(news.insertamum) }} </span>
</div>
<div class="col-md-12 news-truncate">
<span >{{ news.content_obj.betreff?news.content_obj.betreff:getDate(news.insertamum) }}</span>