From 92aa9af052368eaacd2a197fa995839f45efa8fd Mon Sep 17 00:00:00 2001 From: Julie Lenaerts Date: Tue, 30 Jan 2024 18:46:30 +0100 Subject: [PATCH 1/7] Fix truncating logic to take into account bulletpoints and text written on separate lines --- .../DashboardWidgets/NewsItem.vue | 33 +++++++++++++++---- 1 file changed, 26 insertions(+), 7 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue index f4a7cd0eb..723cb3855 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue @@ -41,6 +41,11 @@ const props = defineProps({ type: Number, required: false, default: 200, + }, + maxLines: { + type: Number, + required: false, + default: 3 } }) @@ -58,14 +63,26 @@ const closeModal = () => { }; const shouldTruncate = (content: string): boolean => { - return content.length > props.maxLength; + const lines = content.split('\n'); + + // Check if any line exceeds the maximum length + const tooManyLines = lines.length > props.maxLines; + + return content.length > props.maxLength || tooManyLines; }; const truncateContent = (content: string): string => { - if (shouldTruncate(content)) { + // if (shouldTruncate(content)) { let truncatedContent = content.slice(0, props.maxLength); let linkDepth = 0; let linkStartIndex = -1; + const lines = content.split('\n'); + + // Truncate if amount of lines are too many + if (lines.length > props.maxLines) { + const truncatedContent = lines.slice(0, props.maxLines).join('\n').trim(); + return truncatedContent + '...'; + } for (let i = 0; i < truncatedContent.length; i++) { const char = truncatedContent[i]; @@ -98,13 +115,15 @@ const truncateContent = (content: string): string => { truncatedContent += '...'; return truncatedContent; - } else { - return content; - } + // } + // else { + // return content; + // } }; const convertMarkdownToHtml = (markdown: string): string => { const rawHtml = marked(markdown); + // console.log(rawHtml) return DOMPurify.sanitize(rawHtml) }; @@ -130,7 +149,7 @@ h2 { } .content { - max-height: 100px; /* Adjust the max height as needed */ + max-height: 12em; overflow: hidden; } @@ -144,7 +163,7 @@ button { } .read-more { - color: #3498db; /* Adjust the color as needed */ + color: #3498db; cursor: pointer; } From fd48d458728aee1f285529e5e5b3369fe091da11 Mon Sep 17 00:00:00 2001 From: Julie Lenaerts Date: Wed, 31 Jan 2024 18:38:09 +0100 Subject: [PATCH 2/7] =?UTF-8?q?Improve=20styling=20of=20actualit=C3=A9s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../HomepageWidget/DashboardWidgets/News.vue | 13 +- .../DashboardWidgets/NewsItem.vue | 123 +++++++++++------- .../public/vuejs/HomepageWidget/MyCustoms.vue | 16 ++- 3 files changed, 96 insertions(+), 56 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/News.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/News.vue index 6f85a5678..0fb2e17f1 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/News.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/News.vue @@ -35,15 +35,16 @@ onMounted(() => { ul { list-style: none; padding: 0; + //columns: 2; + //-webkit-columns: 2; + //-moz-columns: 2; } -/* -.scrollable { - overflow-y: auto; - max-height: 150px; !* Same as .content max-height *! - margin-bottom: 10px; !* To give space for the scrollbar *! +h1 { + font: 600 2rem/1 'Oswald', sans-serif; + text-transform: uppercase; + text-align: center; } -*/ diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue index 723cb3855..337b6e46f 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/HomepageWidget/DashboardWidgets/NewsItem.vue @@ -1,9 +1,10 @@