saulteafarmer/plebdevs
1
0
Fork 0
mirror of https://github.com/AustinKelsay/plebdevs.git synced 2025-06-06 18:31:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix video details layout

Browse Source
This commit is contained in:
austinkelsay 2024-10-16 17:10:42 -05:00
parent 708ef4a3ac
commit 97fa99aa3b
2 changed files with 27 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/content/documents/DocumentDetails.js
View File

@ -148,14 +148,14 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
<p key={index}>{line}</p> <p key={index}>{line}</p>
))} ))}
{processedEvent?.additionalLinks && processedEvent?.additionalLinks.length > 0 && ( {processedEvent?.additionalLinks && processedEvent?.additionalLinks.length > 0 && (
<> <div className="my-4">
<p>Additional Links:</p> <p>Additional Links:</p>
{processedEvent.additionalLinks.map((link, index) => ( {processedEvent.additionalLinks.map((link, index) => (
<a className="text-blue-500 hover:underline hover:text-blue-600" key={index} href={link} target="_blank" rel="noopener noreferrer"> <a className="text-blue-500 hover:underline hover:text-blue-600" key={index} href={link} target="_blank" rel="noopener noreferrer">
{link} {link}
</a> </a>
))} ))}
</> </div>
)} )}
<div className='flex items-center justify-between'> <div className='flex items-center justify-between'>
<div className='flex items-center'> <div className='flex items-center'>
@ -183,7 +183,7 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
{renderPaymentMessage()} {renderPaymentMessage()}
{authorView ? ( {authorView ? (
<div className='flex space-x-2 mt-4 sm:mt-0'> <div className='flex space-x-2 mt-4 sm:mt-0'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.d}/edit`)} label="Edit" severity='warning' outlined /> <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined /> <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
<GenericButton <GenericButton
tooltip={isMobileView ? null : "View Nostr Note"} tooltip={isMobileView ? null : "View Nostr Note"}

46
src/components/content/videos/VideoDetails.js
View File

@ -132,7 +132,14 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
<div className="bg-gray-800/90 rounded-lg p-4 m-4 max-mob:m-0 max-tab:m-0 max-mob:rounded-t-none max-tab:rounded-t-none"> <div className="bg-gray-800/90 rounded-lg p-4 m-4 max-mob:m-0 max-tab:m-0 max-mob:rounded-t-none max-tab:rounded-t-none">
<div className={`w-full flex flex-col items-start justify-start mt-2 px-2`}> <div className={`w-full flex flex-col items-start justify-start mt-2 px-2`}>
<div className="flex flex-col items-start gap-2 w-full"> <div className="flex flex-col items-start gap-2 w-full">
<h1 className='text-4xl'>{title}</h1> <div className="flex flex-row items-center justify-between gap-2 w-full">
<h1 className='text-4xl flex-grow'>{title}</h1>
<ZapDisplay
zapAmount={zapAmount}
event={processedEvent}
zapsLoading={zapsLoading && zapAmount === 0}
/>
</div>
<div className="flex flex-row items-center gap-2 w-full"> <div className="flex flex-row items-center gap-2 w-full">
{topics && topics.length > 0 && ( {topics && topics.length > 0 && (
topics.map((topic, index) => ( topics.map((topic, index) => (
@ -148,36 +155,31 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
<p key={index}>{line}</p> <p key={index}>{line}</p>
))} ))}
{processedEvent?.additionalLinks && processedEvent?.additionalLinks.length > 0 && ( {processedEvent?.additionalLinks && processedEvent?.additionalLinks.length > 0 && (
<> <div className="my-4">
<p>Additional Links:</p> <p>Additional Links:</p>
{processedEvent.additionalLinks.map((link, index) => ( {processedEvent.additionalLinks.map((link, index) => (
<a className="text-blue-500 hover:underline hover:text-blue-600" key={index} href={link} target="_blank" rel="noopener noreferrer"> <a className="text-blue-500 hover:underline hover:text-blue-600" key={index} href={link} target="_blank" rel="noopener noreferrer">
{link} {link}
</a> </a>
))} ))}
</> </div>
)} )}
</div> </div>
<div className='flex items-center'> </div>
<Image <div className='flex items-center'>
alt="avatar image" <Image
src={returnImageProxy(author?.avatar, author?.username)} alt="avatar image"
width={50} src={returnImageProxy(author?.avatar, author?.username)}
height={50} width={50}
className="rounded-full mr-4" height={50}
/> className="rounded-full mr-4"
<p className='text-lg text-white'>
By{' '}
<a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
{author?.username}
</a>
</p>
</div>
<ZapDisplay
zapAmount={zapAmount}
event={processedEvent}
zapsLoading={zapsLoading && zapAmount === 0}
/> />
<p className='text-lg text-white'>
By{' '}
<a rel='noreferrer noopener' target='_blank' className='text-blue-300 hover:underline'>
{author?.username}
</a>
</p>
</div> </div>
</div> </div>
<div className="w-full flex flex-row justify-end mt-4"> <div className="w-full flex flex-row justify-end mt-4">