LP1979080 Lengthy titles in a carousel should be truncated.
authorGarry Collum <gcollum@gmail.com>
Fri, 17 Jun 2022 17:39:36 +0000 (17:39 +0000)
committerJane Sandberg <sandbergja@gmail.com>
Mon, 5 Sep 2022 18:04:56 +0000 (11:04 -0700)
Lengthy titles in a carousel push the content that is below the carousel
down sometimes resulting in odd displays.

This patch truncates lengthy titles to 4 lines ending with an ellipsis.

To test.

1. Create a couple of manual carousels and populate them with some bibs that
have lengthy titles.
2. Notice that there is odd spacing below the carousels.
3. Apply the patch.
4. The lengthy titles are now truncated and end with an ellipsis.  There
is now normal spacing below the carousels.

Signed-off-by: Garry Collum <gcollum@gmail.com>
Signed-off-by: John Amundson <jamundson@cwmars.org>
Signed-off-by: Jane Sandberg <sandbergja@gmail.com>

Open-ILS/src/templates-bootstrap/opac/css/style.css.tt2

index 06c67ec..128adb3 100755 (executable)
@@ -3855,6 +3855,15 @@ label[for*=expert_]
 .carousel-entry {
     max-width: 150px;
 }
+
+/* Truncate titles within carousel to 4 lines */
+.carousel-entry div.titleText {
+    display: -webkit-box;
+       -webkit-line-clamp: 4;
+       -webkit-box-orient: vertical;
+       overflow: hidden;
+}
+
 .carousel-entry-image {
     width: 100%;
     height: auto;