wip: scrollable recording ui

This commit is contained in:
karishmas6
2024-10-18 19:07:31 +05:30
parent 7a1f3be2eb
commit ba0bea348b
3 changed files with 7 additions and 5 deletions

View File

@@ -106,7 +106,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
const columns = tableData.length > 0 ? Object.keys(tableData[0]) : []; const columns = tableData.length > 0 ? Object.keys(tableData[0]) : [];
return ( return (
<div> <div style={{ width: '900px', height: '500px' }}>
<button <button
onClick={toggleDrawer(true)} onClick={toggleDrawer(true)}
style={{ style={{
@@ -114,7 +114,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
background: '#3f4853', background: '#3f4853',
border: 'none', border: 'none',
padding: '10px 20px', padding: '10px 20px',
width: 1280, width: 900,
textAlign: 'left' textAlign: 'left'
}}> }}>
Interpretation Log Interpretation Log
@@ -129,7 +129,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
background: 'white', background: 'white',
color: 'black', color: 'black',
padding: '10px', padding: '10px',
height: 720, height: 500,
width: width - 10, width: width - 10,
display: 'flex' display: 'flex'
} }

View File

@@ -115,7 +115,7 @@ export const BrowserContent = () => {
}, []) }, [])
return ( return (
<div style={{ width: '900px', height: '500px' }}> <div style={{ flexGrow: 1 }}>
<BrowserTabs <BrowserTabs
tabs={tabs} tabs={tabs}
handleTabChange={handleTabChange} handleTabChange={handleTabChange}

View File

@@ -316,7 +316,7 @@ export const BrowserWindow = () => {
return ( return (
<div onClick={handleClick} style={{ width: '900px', height: '500px'}} id="browser-window"> <div onClick={handleClick} style={{ width: '900px'}} id="browser-window">
{ {
getText === true || getList === true ? ( getText === true || getList === true ? (
<GenericModal <GenericModal
@@ -356,6 +356,7 @@ export const BrowserWindow = () => {
</GenericModal> </GenericModal>
) : null ) : null
} }
<div style={{ height: '500px', overflowY: 'auto' }}> {/* Make this section scrollable */}
{((getText === true || getList === true) && !showAttributeModal && highlighterData?.rect != null && highlighterData?.rect.top != null) && canvasRef?.current ? {((getText === true || getList === true) && !showAttributeModal && highlighterData?.rect != null && highlighterData?.rect.top != null) && canvasRef?.current ?
<Highlighter <Highlighter
unmodifiedRect={highlighterData?.rect} unmodifiedRect={highlighterData?.rect}
@@ -370,6 +371,7 @@ export const BrowserWindow = () => {
width={900} width={900}
height={500} height={500}
/> />
</div>
</div> </div>
); );
}; };