initial implementation for lyrics

src/renderer/features/lyrics/lyric-line.tsx

@@ -0,0 +1,20 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { TextTitle } from '/@/renderer/components/text-title';
+
+interface LyricLineProps extends ComponentPropsWithoutRef<'div'> {
+  active: boolean;
+  lyric: string;
+}
+
+export const LyricLine = ({ lyric: text, active, ...props }: LyricLineProps) => {
+  return (
+    <TextTitle
+      lh={active ? '4rem' : '3.5rem'}
+      sx={{ fontSize: active ? '2.5rem' : '2rem' }}
+      weight={active ? 800 : 100}
+      {...props}
+    >
+      {text}
+    </TextTitle>
+  );
+};