fix: Fix truncation on public shares

Signed-off-by: Christopher Ng <chrng8@gmail.com>

core/css/header.scss

@@ -230,6 +230,17 @@
 	flex: 1 1 100%;
 }
 
+.header-info {
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+}
+
+.header-title {
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
 .header-shared-by  {
 	color: var(--color-primary-element-text);
 	position: relative;

core/templates/layout.public.php

@@ -48,17 +48,21 @@ p($theme->getTitle());
 					<div class="logo logo-icon"></div>
 				<?php endif; ?>
 
-				<?php if (isset($template) && $template->getHeaderTitle() !== '') { ?>
+				<div class="header-info">
-					<?php p($template->getHeaderTitle()); ?>
+					<span class="header-title">
-				<?php } else { ?>
+						<?php if (isset($template) && $template->getHeaderTitle() !== '') { ?>
-					<?php	p($theme->getName()); ?>
+							<?php p($template->getHeaderTitle()); ?>
-				<?php } ?>
+						<?php } else { ?>
-			</div>
+							<?php	p($theme->getName()); ?>
-			<?php if (isset($template) && $template->getHeaderDetails() !== '') { ?>
+						<?php } ?>
-				<div class="header-shared-by">
+					</span>
-					<?php p($template->getHeaderDetails()); ?>
+					<?php if (isset($template) && $template->getHeaderDetails() !== '') { ?>
+						<span class="header-shared-by">
+							<?php p($template->getHeaderDetails()); ?>
+						</span>
+					<?php } ?>
 				</div>
-			<?php } ?>
+			</div>
 		</div>
 
 		<div class="header-right">