Fix topic tags, some styling fixes

This commit is contained in:
austinkelsay 2024-04-24 11:19:31 -05:00
parent bd2969dd8c
commit d452cfec19
5 changed files with 29 additions and 18 deletions

View File

@ -50,7 +50,7 @@ const ResourceTemplate = (resource) => {
<h4 className="mb-1 font-bold text-lg font-blinker line-clamp-2">
{resource.title}
</h4>
<p className="text-sm text-gray-500 line-clamp-2">{resource.summary}</p>
<p className="text-sm text-gray-500 min-h-[40px] line-clamp-2">{resource.summary}</p>
<div className="flex flex-row justify-between items-center mt-2">
<p className="text-xs text-gray-400">
{formatTimestampToHowLongAgo(resource.published_at)}

View File

@ -96,8 +96,8 @@ export default function Details() {
useEffect(() => {
if (event) {
const { id, pubkey, content, title, summary, image, published_at, d } = parseEvent(event);
setProcessedEvent({ id, pubkey, content, title, summary, image, published_at, d });
const { id, pubkey, content, title, summary, image, published_at, d, topics } = parseEvent(event);
setProcessedEvent({ id, pubkey, content, title, summary, image, published_at, d, topics });
}
}, [event]);
@ -116,15 +116,16 @@ export default function Details() {
return (
<div className='w-full px-24 pt-12 mx-auto mt-4 max-tab:px-0 max-mob:px-0 max-tab:pt-2 max-mob:pt-2'>
<div className='w-full flex flex-row justify-between max-tab:flex-col max-mob:flex-col'>
{/* <i className='pi pi-arrow-left pl-8 cursor-pointer hover:opacity-75 max-tab:pl-2 max-mob:pl-2' onClick={() => router.push('/')} /> */}
<i className='pi pi-arrow-left pl-8 cursor-pointer hover:opacity-75 max-tab:pl-2 max-mob:pl-2' onClick={() => router.push('/')} />
<div className='w-[75vw] mx-auto flex flex-row items-start justify-between max-tab:flex-col max-mob:flex-col max-tab:w-[95vw] max-mob:w-[95vw]'>
<div className='flex flex-col items-start max-w-[45vw] max-tab:max-w-[100vw] max-mob:max-w-[100vw]'>
<div className='pt-2 flex flex-row justify-start w-full'>
<Tag className='mr-2' value="Primary"></Tag>
<Tag className='mr-2' severity="success" value="Success"></Tag>
<Tag className='mr-2' severity="info" value="Info"></Tag>
<Tag className='mr-2' severity="warning" value="Warning"></Tag>
<Tag className='mr-2' severity="danger" value="Danger"></Tag>
{processedEvent && processedEvent.topics && processedEvent.topics.length > 0 && (
processedEvent.topics.map((topic, index) => (
<Tag className='mr-2 text-white' key={index} value={topic}></Tag>
))
)
}
</div>
<h1 className='text-4xl mt-6'>{processedEvent?.title}</h1>
<p className='text-xl mt-6'>{processedEvent?.summary}</p>

View File

@ -39,7 +39,7 @@ export default function Details() {
const router = useRouter();
const {showToast} = useToast();
const { showToast } = useToast();
const { publishAll } = useNostr();
@ -60,7 +60,7 @@ export default function Details() {
const handleSubmit = async () => {
if (draft) {
const {unsignedEvent, type} = buildEvent(draft);
const { unsignedEvent, type } = buildEvent(draft);
if (unsignedEvent) {
await publishEvent(unsignedEvent, type);
@ -117,7 +117,7 @@ export default function Details() {
const NewDTag = uuidv4();
let event = {};
let type;
switch (draft?.type) {
case 'resource':
event = {
@ -173,7 +173,7 @@ export default function Details() {
event = null;
type = 'unknown';
}
return { unsignedEvent: event, type };
};
@ -184,11 +184,14 @@ export default function Details() {
<div className='w-[75vw] mx-auto flex flex-row items-start justify-between max-tab:flex-col max-mob:flex-col max-tab:w-[95vw] max-mob:w-[95vw]'>
<div className='flex flex-col items-start max-w-[45vw] max-tab:max-w-[100vw] max-mob:max-w-[100vw]'>
<div className='pt-2 flex flex-row justify-start w-full'>
<Tag className='mr-2' value="Primary"></Tag>
<Tag className='mr-2' severity="success" value="Success"></Tag>
<Tag className='mr-2' severity="info" value="Info"></Tag>
<Tag className='mr-2' severity="warning" value="Warning"></Tag>
<Tag className='mr-2' severity="danger" value="Danger"></Tag>
{/* List out topics */}
{draft?.topics && draft.topics.map((topic, index) => {
if (topic === "plebdevs") return;
return (
<Tag className='mr-2 text-white' key={index} value={topic}></Tag>
)
})
}
</div>
<h1 className='text-4xl mt-6'>{draft?.title}</h1>
<p className='text-xl mt-6'>{draft?.summary}</p>

View File

@ -40,6 +40,7 @@ export const parseEvent = (event) => {
summary: '',
image: '',
published_at: '',
topics: [], // Added to hold all topics
};
// Iterate over the tags array to extract data
@ -63,6 +64,9 @@ export const parseEvent = (event) => {
case 'd':
eventData.d = tag[1];
break;
case 't':
tag[1] !== "plebdevs" && eventData.topics.push(tag[1]);
break;
default:
break;
}

View File

@ -7,6 +7,9 @@ module.exports = {
],
theme: {
extend: {
colors: {
white: "#f8f8ff"
},
screens: {
'max-mob': {'max': '475px'},
'max-tab': {'max': '768px'},