From 0baa6f448871f39d1a6d7492fb723c31f1b7449b Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Mon, 2 Jan 2023 18:17:06 -0800
Subject: [PATCH] Adjust header styles

---
 .../features/shared/components/library-header-bar.tsx         | 4 ++++
 src/renderer/features/shared/components/library-header.tsx    | 3 ++-
 src/renderer/styles/mixins.ts                                 | 1 -
 3 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/renderer/features/shared/components/library-header-bar.tsx b/src/renderer/features/shared/components/library-header-bar.tsx
index 9f0b0304..cf7e73ec 100644
--- a/src/renderer/features/shared/components/library-header-bar.tsx
+++ b/src/renderer/features/shared/components/library-header-bar.tsx
@@ -2,17 +2,21 @@ import { ReactNode } from 'react';
 import { Group } from '@mantine/core';
 import { TextTitle } from '/@/renderer/components';
 import { PlayButton as PlayBtn } from '/@/renderer/features/shared/components/play-button';
+import { useShouldPadTitlebar } from '/@/renderer/hooks';
 
 interface LibraryHeaderBarProps {
   children: ReactNode;
 }
 
 export const LibraryHeaderBar = ({ children }: LibraryHeaderBarProps) => {
+  const padRight = useShouldPadTitlebar();
+
   return (
     <Group
       noWrap
       align="center"
       h="100%"
+      mr={padRight ? '170px' : 0}
       px="1rem"
       spacing="xl"
     >
diff --git a/src/renderer/features/shared/components/library-header.tsx b/src/renderer/features/shared/components/library-header.tsx
index e9a1be44..7d2694d3 100644
--- a/src/renderer/features/shared/components/library-header.tsx
+++ b/src/renderer/features/shared/components/library-header.tsx
@@ -143,9 +143,10 @@ export const LibraryHeader = forwardRef(
           </Group>
           <TextTitle
             fw="900"
-            lh="1.15"
+            lh="1"
             lineClamp={2}
             mt=".08em"
+            overflow="hidden"
             sx={{ fontSize: titleSize, overflow: 'hidden' }}
           >
             {title}
diff --git a/src/renderer/styles/mixins.ts b/src/renderer/styles/mixins.ts
index 099f3a40..90542448 100644
--- a/src/renderer/styles/mixins.ts
+++ b/src/renderer/styles/mixins.ts
@@ -1,7 +1,6 @@
 import { css } from 'styled-components';
 
 export const textEllipsis = css`
-  overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
 `;