From 1c984421d5dd87c5de6a9d802b70bfca299f8825 Mon Sep 17 00:00:00 2001 From: HuyNguyen Date: Mon, 24 Apr 2023 23:30:41 +0700 Subject: [PATCH] TF-1743: Hide Horizontal scroll bar in Email detail view (cherry picked from commit 491cd1d59c69e9a308700ee1bc4032b87284380c) --- .../utils/html_transformer/html_template.dart | 2 +- ...izontal-scroll-bar-in-email-detail-view.md | 24 +++++++++++++++++++ 2 files changed, 25 insertions(+), 1 deletion(-) create mode 100644 docs/adr/0026-fix-horizontal-scroll-bar-in-email-detail-view.md diff --git a/core/lib/presentation/utils/html_transformer/html_template.dart b/core/lib/presentation/utils/html_transformer/html_template.dart index d99e9b44c..5b2d5bc1e 100644 --- a/core/lib/presentation/utils/html_transformer/html_template.dart +++ b/core/lib/presentation/utils/html_transformer/html_template.dart @@ -53,7 +53,7 @@ String generateHtml(String content, { ${javaScripts ?? ''} - +
$content
diff --git a/docs/adr/0026-fix-horizontal-scroll-bar-in-email-detail-view.md b/docs/adr/0026-fix-horizontal-scroll-bar-in-email-detail-view.md new file mode 100644 index 000000000..18378728e --- /dev/null +++ b/docs/adr/0026-fix-horizontal-scroll-bar-in-email-detail-view.md @@ -0,0 +1,24 @@ +# 25. Hide Horizontal scroll bar in Email detail view + +Date: 2023-04-24 + +## Status + +- Issue: [#1743](https://github.com/linagora/tmail-flutter/issues/1743) + +## Context + +In email view always show horizontal scroll bar in Email detail view and don't wrap text instead + +## Root cause + +The horizontal scrollbar appears when the content inside the body element is wider than the width of the viewport. By default, the overflow property is set to "visible", which means that the content can overflow the element's boundaries. + +## Decision + +When you set `overflow-x: hidden`; on the body element, it prevents the content from overflowing the element's boundaries in the horizontal direction, +effectively disabling the horizontal scrollbar. However, if you don't set this property and the content is wider than the viewport, +the scrollbar will appear to allow the user to scroll horizontally to see the content that is outside the viewport. +## Consequences + +- Hide Horizontal scroll bar in Email detail view