selfhostyourtech/reflector
2
0
Fork 0
mirror of https://github.com/Monadical-SAS/reflector.git synced 2025-12-21 12:49:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

prevent overflow, smaller fonts

Browse Source
This commit is contained in:
Sara
2023-10-04 15:30:19 +02:00
parent 0cd8958bf1
commit 12ad721c1f
6 changed files with 43 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
www/app/layout.tsx
View File

@@ -67,7 +67,7 @@ export default function RootLayout({ children }) {
<ErrorMessage /> <ErrorMessage />
<div <div
id="container" id="container"
className="items-center h-[100svh] p-2 md:p-4 grid grid-rows-layout gap-2 md:gap-4" className="items-center h-[100svh] w-[100svw] p-2 md:p-4 grid grid-rows-layout gap-2 md:gap-4"
> >
<header className="flex justify-between items-center w-full"> <header className="flex justify-between items-center w-full">
{/* Logo on the left */} {/* Logo on the left */}

16
www/app/transcripts/[transcriptId]/page.tsx
View File

@@ -35,7 +35,12 @@ export default function TranscriptDetails(details: TranscriptDetails) {
); );
} }
const fullTranscript = topics.topics?.map(topic => topic.transcript).join('\n\n').replace(/ +/g, ' ').trim() || ''; const fullTranscript =
topics.topics
?.map((topic) => topic.transcript)
.join("\n\n")
.replace(/ +/g, " ")
.trim() || "";
return ( return (
<> <>
@@ -58,10 +63,13 @@ export default function TranscriptDetails(details: TranscriptDetails) {
useActiveTopic={useActiveTopic} useActiveTopic={useActiveTopic}
autoscroll={false} autoscroll={false}
/> />
<div className="w-full h-full grid grid-rows-layout-one gap-2 lg:gap-4"> <div className="w-full h-full grid grid-rows-layout-one grid-cols-1 gap-2 lg:gap-4">
<section className=" bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4 h-full"> <section className=" bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4 h-full">
{transcript?.response?.longSummary && ( {transcript?.response?.longSummary && (
<FinalSummary fullTranscript={fullTranscript} summary={transcript?.response?.longSummary} /> <FinalSummary
fullTranscript={fullTranscript}
summary={transcript?.response?.longSummary}
/>
)} )}
</section> </section>
@@ -73,7 +81,7 @@ export default function TranscriptDetails(details: TranscriptDetails) {
size={98} size={98}
/> />
</div> </div>
<div className="flex-grow"> <div className="flex-grow max-w-full">
<ShareLink /> <ShareLink />
</div> </div>
</section> </section>

8
www/app/transcripts/finalSummary.tsx
View File

@@ -34,9 +34,11 @@ export default function FinalSummary(props: FinalSummaryProps) {
return ( return (
<div className="overflow-y-auto h-auto max-h-full"> <div className="overflow-y-auto h-auto max-h-full">
<div className="flex flex-row justify-between items-center"> <div className="flex flex-row flex-wrap-reverse justify-between items-center">
<h2 className="text-xl md:text-2xl font-bold">Final Summary</h2> <h2 className="text-lg sm:text-xl md:text-2xl font-bold">
<div className="ml-auto flex space-x-2"> Final Summary
</h2>
<div className="ml-auto flex space-x-2 mb-2">
<button <button
onClick={handleCopyTranscriptClick} onClick={handleCopyTranscriptClick}
className={ className={

3
www/app/transcripts/recorder.tsx
View File

@@ -110,8 +110,7 @@ export default function Recorder(props: RecorderProps) {
: undefined, : undefined,
}); });
if (!props.transcriptId) if (!props.transcriptId) {
{
const _wshack: any = _wavesurfer; const _wshack: any = _wavesurfer;
_wshack.renderer.renderSingleCanvas = () => {}; _wshack.renderer.renderSingleCanvas = () => {};
} }

2
www/app/transcripts/shareLink.tsx
View File

@@ -39,7 +39,7 @@ const ShareLink = () => {
value={currentUrl} value={currentUrl}
ref={inputRef} ref={inputRef}
onChange={() => {}} onChange={() => {}}
className="border rounded-lg md:rounded-xl p-2 flex-grow mr-2 text-sm bg-slate-100 outline-slate-400" className="border rounded-lg md:rounded-xl p-2 flex-grow flex-shrink overflow-auto mr-2 text-sm bg-slate-100 outline-slate-400"
/> />
<button <button
onClick={handleCopyClick} onClick={handleCopyClick}

6
www/app/transcripts/topicList.tsx
View File

@@ -61,10 +61,10 @@ export function TopicList({
}, [activeTopic, autoscroll]); }, [activeTopic, autoscroll]);
return ( return (
<section className="relative w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4 flex flex-col justify-center align-center"> <section className="relative w-full h-full bg-blue-400/20 rounded-lg md:rounded-xl p-1 sm:p-2 md:px-4 flex flex-col justify-center align-center">
{topics.length > 0 ? ( {topics.length > 0 ? (
<> <>
<h2 className="md:text-lg font-bold mb-2">Topics</h2> <h2 className="ml-2 md:text-lg font-bold mb-2">Topics</h2>
{autoscroll && ( {autoscroll && (
<ScrollToBottom <ScrollToBottom
@@ -86,7 +86,7 @@ export function TopicList({
setActiveTopic(activeTopic?.id == topic.id ? null : topic) setActiveTopic(activeTopic?.id == topic.id ? null : topic)
} }
> >
<div className="w-full flex justify-between items-center rounded-lg md:rounded-xl text-lg md:text-xl font-bold leading-tight"> <div className="w-full flex justify-between items-center rounded-lg md:rounded-xl xs:text-base sm:text-lg md:text-xl font-bold leading-tight">
<p> <p>
<span className="font-light font-mono text-slate-500 text-base md:text-lg"> <span className="font-light font-mono text-slate-500 text-base md:text-lg">
[{formatTime(topic.timestamp)}]&nbsp; [{formatTime(topic.timestamp)}]&nbsp;