klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-08 05:39:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix rendering of teaser reference panel in mobile width

Browse Source
This commit is contained in:
sabaimran
2024-07-15 19:40:55 +05:30
parent 2e9275c0f3
commit 9a5bf4c701
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/interface/web/app/components/referencePanel/referencePanel.tsx
View File

@@ -297,6 +297,7 @@ export function TeaserReferencesSection(props: TeaserReferenceSectionProps) {
{ {
shouldShowShowMoreButton && shouldShowShowMoreButton &&
<ReferencePanel <ReferencePanel
isMobileWidth={props.isMobileWidth}
notesReferenceCardData={props.notesReferenceCardData} notesReferenceCardData={props.notesReferenceCardData}
onlineReferenceCardData={props.onlineReferenceCardData} /> onlineReferenceCardData={props.onlineReferenceCardData} />
} }
@@ -309,6 +310,7 @@ export function TeaserReferencesSection(props: TeaserReferenceSectionProps) {
interface ReferencePanelDataProps { interface ReferencePanelDataProps {
notesReferenceCardData: NotesContextReferenceData[]; notesReferenceCardData: NotesContextReferenceData[];
onlineReferenceCardData: OnlineReferenceData[]; onlineReferenceCardData: OnlineReferenceData[];
isMobileWidth: boolean;
} }
export default function ReferencePanel(props: ReferencePanelDataProps) { export default function ReferencePanel(props: ReferencePanelDataProps) {
@@ -320,8 +322,9 @@ export default function ReferencePanel(props: ReferencePanelDataProps) {
return ( return (
<Sheet> <Sheet>
<SheetTrigger <SheetTrigger
className='text-balance w-[200px] flex sm:justify-start md:justify-center overflow-hidden break-words p-0 bg-transparent border-none text-gray-400 align-middle items-center !m-0 inline-flex'> className={`text-balance flex sm:justify-start md:justify-start overflow-hidden break-words p-0 bg-transparent border-none text-gray-400 align-middle items-center !m-2 inline-flex ${props.isMobileWidth ? 'w-auto' : 'w-[200px]'}`}>
View references <ArrowRight className='m-1' /> View references
<ArrowRight className='m-1' />
</SheetTrigger> </SheetTrigger>
<SheetContent className="overflow-y-scroll"> <SheetContent className="overflow-y-scroll">
<SheetHeader> <SheetHeader>