mirror of
https://github.com/AustinKelsay/plebdevs.git
synced 2025-06-06 18:31:00 +00:00
Styling fixes
This commit is contained in:
austinkelsay
parent
036b0767b4
commit
db6abcdb9a
@ -102,7 +102,8 @@ const HeroBanner = () => {
|
|||||||
)}
|
)}
|
||||||
<div
|
<div
|
||||||
className="mb-8 flex flex-row hover:opacity-70 cursor-pointer"
|
className="mb-8 flex flex-row hover:opacity-70 cursor-pointer"
|
||||||
onClick={() => window.open('https://www.udemy.com/user/austin-james-kelsay/', '_blank')}
|
onClick={() => !isMobile && window.open('https://www.udemy.com/user/austin-james-kelsay/', '_blank')}
|
||||||
|
style={{ cursor: isMobile ? 'default' : 'pointer' }}
|
||||||
>
|
>
|
||||||
<AvatarGroup>
|
<AvatarGroup>
|
||||||
<Avatar image={"https://pbs.twimg.com/profile_images/1674493492519751680/wxuiYCJA_400x400.jpg"} size={isMobile ? "normal" : "large"} shape="circle" />
|
<Avatar image={"https://pbs.twimg.com/profile_images/1674493492519751680/wxuiYCJA_400x400.jpg"} size={isMobile ? "normal" : "large"} shape="circle" />
|
||||||
|
|||||||
@ -157,13 +157,13 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
|
|||||||
<p>Additional Links:</p>
|
<p>Additional Links:</p>
|
||||||
{processedEvent.additionalLinks.map((link, index) => (
|
{processedEvent.additionalLinks.map((link, index) => (
|
||||||
<div key={index} className="mb-2">
|
<div key={index} className="mb-2">
|
||||||
<a
|
<a
|
||||||
className="text-blue-500 hover:underline hover:text-blue-600 break-words"
|
className="text-blue-500 hover:underline hover:text-blue-600 break-words"
|
||||||
href={link}
|
href={link}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
style={{
|
style={{
|
||||||
wordBreak: 'break-word',
|
wordBreak: 'break-word',
|
||||||
overflowWrap: 'break-word',
|
overflowWrap: 'break-word',
|
||||||
display: 'inline-block',
|
display: 'inline-block',
|
||||||
maxWidth: '100%'
|
maxWidth: '100%'
|
||||||
@ -198,34 +198,39 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className='w-full mt-8 flex flex-wrap justify-between items-center'>
|
<div className='w-full mt-8 flex flex-wrap justify-between items-center'>
|
||||||
{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.id}/edit`)} label="Edit" severity='warning' outlined />
|
{renderPaymentMessage()}
|
||||||
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
|
<div className="flex flex-row gap-2">
|
||||||
<GenericButton
|
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
|
||||||
tooltip={isMobileView ? null : "View Nostr Note"}
|
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
|
||||||
tooltipOptions={{ position: 'left' }}
|
<GenericButton
|
||||||
icon="pi pi-external-link"
|
tooltip={isMobileView ? null : "View Nostr Note"}
|
||||||
outlined
|
tooltipOptions={{ position: 'left' }}
|
||||||
onClick={() => {
|
icon="pi pi-external-link"
|
||||||
window.open(`https://habla.news/a/${nAddress}`, '_blank');
|
outlined
|
||||||
}}
|
onClick={() => {
|
||||||
/>
|
window.open(`https://habla.news/a/${nAddress}`, '_blank');
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="w-full flex flex-row justify-end gap-2">
|
<div className="w-full flex flex-row justify-between gap-2">
|
||||||
{course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
|
{renderPaymentMessage()}
|
||||||
<GenericButton
|
<div className="flex flex-row justify-end gap-2">
|
||||||
size={isMobileView ? 'small' : null}
|
{course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
|
||||||
tooltip={isMobileView ? null : "View Nostr Note"}
|
<GenericButton
|
||||||
tooltipOptions={{ position: 'left' }}
|
size={isMobileView ? 'small' : null}
|
||||||
icon="pi pi-external-link"
|
tooltip={isMobileView ? null : "View Nostr Note"}
|
||||||
outlined
|
tooltipOptions={{ position: 'left' }}
|
||||||
onClick={() => {
|
icon="pi pi-external-link"
|
||||||
window.open(`https://habla.news/a/${nAddress}`, '_blank');
|
outlined
|
||||||
}}
|
onClick={() => {
|
||||||
/>
|
window.open(`https://habla.news/a/${nAddress}`, '_blank');
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -137,13 +137,13 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
|
|||||||
<p>Additional Links:</p>
|
<p>Additional Links:</p>
|
||||||
{processedEvent.additionalLinks.map((link, index) => (
|
{processedEvent.additionalLinks.map((link, index) => (
|
||||||
<div key={index} className="mb-2">
|
<div key={index} className="mb-2">
|
||||||
<a
|
<a
|
||||||
className="text-blue-500 hover:underline hover:text-blue-600 break-words"
|
className="text-blue-500 hover:underline hover:text-blue-600 break-words"
|
||||||
href={link}
|
href={link}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
style={{
|
style={{
|
||||||
wordBreak: 'break-word',
|
wordBreak: 'break-word',
|
||||||
overflowWrap: 'break-word',
|
overflowWrap: 'break-word',
|
||||||
display: 'inline-block',
|
display: 'inline-block',
|
||||||
maxWidth: '100%'
|
maxWidth: '100%'
|
||||||
@ -207,9 +207,10 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
|
|||||||
</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">
|
||||||
{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'>
|
||||||
|
{renderPaymentMessage()}
|
||||||
|
<div className="flex flex-row justify-end">
|
||||||
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/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
|
||||||
@ -222,8 +223,11 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
</div>
|
||||||
<div className="w-full flex flex-row justify-end gap-2">
|
) : (
|
||||||
|
<div className="w-full flex flex-row justify-between">
|
||||||
|
{renderPaymentMessage()}
|
||||||
|
<div className="flex flex-row justify-end">
|
||||||
{course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
|
{course && <GenericButton size={isMobileView ? 'small' : null} outlined icon="pi pi-external-link" onClick={() => window.open(`/course/${course}`, '_blank')} label={isMobileView ? "Course" : "Open Course"} tooltip="This is a lesson in a course" tooltipOptions={{ position: 'top' }} />}
|
||||||
<GenericButton
|
<GenericButton
|
||||||
size={isMobileView ? 'small' : null}
|
size={isMobileView ? 'small' : null}
|
||||||
@ -236,7 +240,8 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,5 +1,4 @@
|
|||||||
import React, { useState, useEffect, useCallback } from 'react';
|
import React, { useState, useEffect, useCallback } from 'react';
|
||||||
import { Accordion, AccordionTab } from 'primereact/accordion';
|
|
||||||
import { useRouter } from 'next/router';
|
import { useRouter } from 'next/router';
|
||||||
import { useSession, signOut } from 'next-auth/react';
|
import { useSession, signOut } from 'next-auth/react';
|
||||||
import { useIsAdmin } from '@/hooks/useIsAdmin';
|
import { useIsAdmin } from '@/hooks/useIsAdmin';
|
||||||
@ -20,6 +19,12 @@ const Sidebar = ({ course = false }) => {
|
|||||||
|
|
||||||
// Helper function to determine if the path matches the current route
|
// Helper function to determine if the path matches the current route
|
||||||
const isActive = (path) => {
|
const isActive = (path) => {
|
||||||
|
if (path === '/content') {
|
||||||
|
return router.pathname === '/content';
|
||||||
|
}
|
||||||
|
if (path === '/feed') {
|
||||||
|
return router.pathname === '/feed';
|
||||||
|
}
|
||||||
return router.asPath === path;
|
return router.asPath === path;
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -121,30 +126,9 @@ const Sidebar = ({ course = false }) => {
|
|||||||
<div onClick={() => router.push('/')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/') ? 'bg-gray-700' : ''}`}>
|
<div onClick={() => router.push('/')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/') ? 'bg-gray-700' : ''}`}>
|
||||||
<i className="pi pi-home pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Home</p>
|
<i className="pi pi-home pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Home</p>
|
||||||
</div>
|
</div>
|
||||||
<Accordion className={styles['p-accordion']} style={{ marginBottom: '0px', paddingBottom: '0px' }}>
|
<div onClick={() => router.push('/content')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/content') || router.pathname === '/content' ? 'bg-gray-700' : ''}`}>
|
||||||
<AccordionTab
|
<i className="pi pi-play-circle pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Content</p>
|
||||||
pt={{
|
</div>
|
||||||
headerAction: ({ context }) => ({
|
|
||||||
className: `hover:bg-gray-700 rounded-lg ${isActive('/content') || router.pathname === '/content' ? 'bg-gray-700' : ''} ${styles['p-accordion-header-link']}`
|
|
||||||
}),
|
|
||||||
content: styles['p-accordion-content'],
|
|
||||||
header: 'text-lg'
|
|
||||||
}}
|
|
||||||
header={'Content'}>
|
|
||||||
<div onClick={() => router.push('/content?tag=all')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/content?tag=all') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-eye text-sm pr-1"></i> All</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/content?tag=courses')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/content?tag=courses') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-desktop text-sm pr-1"></i> Courses</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/content?tag=videos')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/content?tag=videos') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-video text-sm pr-1"></i> Videos</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/content?tag=documents')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/content?tag=documents') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-file text-sm pr-1"></i> Documents</p>
|
|
||||||
</div>
|
|
||||||
</AccordionTab>
|
|
||||||
</Accordion>
|
|
||||||
{isAdmin && (
|
{isAdmin && (
|
||||||
<div onClick={() => router.push('/create')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/create') ? 'bg-gray-700' : ''}`}>
|
<div onClick={() => router.push('/create')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/create') ? 'bg-gray-700' : ''}`}>
|
||||||
<i className="pi pi-plus pl-5 text-sm" /> <p className="pl-2 rounded-md font-bold text-lg">Create</p>
|
<i className="pi pi-plus pl-5 text-sm" /> <p className="pl-2 rounded-md font-bold text-lg">Create</p>
|
||||||
@ -153,40 +137,19 @@ const Sidebar = ({ course = false }) => {
|
|||||||
<div onClick={() => session ? router.push('/profile?tab=subscribe') : router.push('/subscribe')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/profile?tab=subscribe') || isActive('/subscribe') ? 'bg-gray-700' : ''}`}>
|
<div onClick={() => session ? router.push('/profile?tab=subscribe') : router.push('/subscribe')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/profile?tab=subscribe') || isActive('/subscribe') ? 'bg-gray-700' : ''}`}>
|
||||||
<i className="pi pi-star pl-5 text-sm" /> <p className="pl-2 rounded-md font-bold text-lg">Subscribe</p>
|
<i className="pi pi-star pl-5 text-sm" /> <p className="pl-2 rounded-md font-bold text-lg">Subscribe</p>
|
||||||
</div>
|
</div>
|
||||||
<Accordion className={styles['p-accordion']}>
|
<div onClick={() => router.push('/feed?channel=global')} className={`w-full flex flex-row items-center cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/feed') ? 'bg-gray-700' : ''}`}>
|
||||||
<AccordionTab
|
<i className="pi pi-comments pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Feeds</p>
|
||||||
pt={{
|
</div>
|
||||||
headerAction: ({ context }) => ({
|
|
||||||
className: `hover:bg-gray-700 rounded-lg ${isActive('/feed') ? 'bg-gray-700' : ''} ${styles['p-accordion-header-link']}`
|
|
||||||
}),
|
|
||||||
content: styles['p-accordion-content'],
|
|
||||||
header: 'text-lg'
|
|
||||||
}}
|
|
||||||
header={"Feeds"}>
|
|
||||||
<div onClick={() => router.push('/feed?channel=global')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/feed?channel=global') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-hashtag text-sm pr-1"></i> global</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/feed?channel=nostr')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/feed?channel=nostr') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-hashtag text-sm pr-1"></i> nostr</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/feed?channel=discord')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/feed?channel=discord') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-hashtag text-sm pr-1"></i> discord</p>
|
|
||||||
</div>
|
|
||||||
<div onClick={() => router.push('/feed?channel=stackernews')} className={`w-full cursor-pointer py-2 my-2 hover:bg-gray-700 rounded-lg ${isActive('/feed?channel=stackernews') ? 'bg-gray-700' : ''}`}>
|
|
||||||
<p className="pl-3 rounded-md font-bold text-lg"><i className="pi pi-hashtag text-sm pr-1"></i> stackernews</p>
|
|
||||||
</div>
|
|
||||||
</AccordionTab>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
// Collapsed sidebar content (icons only)
|
// Collapsed sidebar content (icons only)
|
||||||
!course && (
|
!course && (
|
||||||
<div className="flex flex-col items-center">
|
<div className="flex flex-col items-center">
|
||||||
<i className="pi pi-home my-4 cursor-pointer" onClick={() => router.push('/')} />
|
<i className="pi pi-home my-4 cursor-pointer" onClick={() => router.push('/')} />
|
||||||
<i className="pi pi-list my-4 cursor-pointer" onClick={() => router.push('/content')} />
|
<i className="pi pi-play-circle my-4 cursor-pointer" onClick={() => router.push('/content')} />
|
||||||
<i className="pi pi-plus my-4 cursor-pointer" onClick={() => router.push('/create')} />
|
<i className="pi pi-plus my-4 cursor-pointer" onClick={() => router.push('/create')} />
|
||||||
<i className="pi pi-star my-4 cursor-pointer" onClick={() => session ? router.push('/profile?tab=subscribe') : router.push('/auth/signin')} />
|
<i className="pi pi-star my-4 cursor-pointer" onClick={() => session ? router.push('/profile?tab=subscribe') : router.push('/auth/signin')} />
|
||||||
<i className="pi pi-users my-4 cursor-pointer" onClick={() => router.push('/feed')} />
|
<i className="pi pi-comments my-4 cursor-pointer" onClick={() => router.push('/feed?channel=global')} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -12,7 +12,7 @@ const appConfig = {
|
|||||||
"wss://relay.devs.tools/"
|
"wss://relay.devs.tools/"
|
||||||
],
|
],
|
||||||
// ganon "468f729dd409053dac5e7470622c3996aad88db6ed1de9165cb1921b5ab4fd5e",
|
// ganon "468f729dd409053dac5e7470622c3996aad88db6ed1de9165cb1921b5ab4fd5e",
|
||||||
authorPubkeys: ["8cb60e215678879cda0bef4d5b3fc1a5c5925d2adb5d8c4fa7b7d03b5f2deaea", "676c02247668d5b18479be3d1a80933044256f3fbd03640a8c234684e641b6d6", "f33c8a9617cb15f705fc70cd461cfd6eaf22f9e24c33eabad981648e5ec6f741", "c67cd3e1a83daa56cff16f635db2fdb9ed9619300298d4701a58e68e84098345"],
|
authorPubkeys: ["8cb60e215678879cda0bef4d5b3fc1a5c5925d2adb5d8c4fa7b7d03b5f2deaea", "676c02247668d5b18479be3d1a80933044256f3fbd03640a8c234684e641b6d6", "f33c8a9617cb15f705fc70cd461cfd6eaf22f9e24c33eabad981648e5ec6f741", "c67cd3e1a83daa56cff16f635db2fdb9ed9619300298d4701a58e68e84098345", "468f729dd409053dac5e7470622c3996aad88db6ed1de9165cb1921b5ab4fd5e"],
|
||||||
customLightningAddresses: [
|
customLightningAddresses: [
|
||||||
{
|
{
|
||||||
// todo remove need for lowercase
|
// todo remove need for lowercase
|
||||||
|
|||||||
@ -84,14 +84,12 @@ const Feed = () => {
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="min-bottom-bar:hidden">
|
<CommunityMenuTab
|
||||||
<CommunityMenuTab
|
items={allTopics}
|
||||||
items={allTopics}
|
selectedTopic={selectedTopic}
|
||||||
selectedTopic={selectedTopic}
|
onTabChange={handleTopicChange}
|
||||||
onTabChange={handleTopicChange}
|
className="max-w-[90%] mx-auto"
|
||||||
className="max-w-[90%] mx-auto"
|
/>
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{
|
{
|
||||||
selectedTopic === 'global' && <GlobalFeed searchQuery={searchQuery} />
|
selectedTopic === 'global' && <GlobalFeed searchQuery={searchQuery} />
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user