Compare commits

..

4 Commits

Author SHA1 Message Date
Ryderjj89
6e682188bb More display fixes 2025-11-25 08:44:33 -05:00
Ryderjj89
021edda0dc Fixed description display again 2025-11-25 08:35:48 -05:00
Ryderjj89
453d4eb5c6 Fixed description display 2025-11-25 08:28:35 -05:00
Ryderjj89
0f631c8755 Newer react quill 2025-11-25 08:12:32 -05:00
7 changed files with 75 additions and 16 deletions

View File

@@ -17,14 +17,13 @@
"@mui/icons-material": "^5.14.2",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"react-quill": "^2.0.0"
"react-quill-new": "^3.3.3"
},
"devDependencies": {
"@types/react": "^18.2.15",
"@types/react-dom": "^18.2.7",
"@types/react-router-dom": "^5.3.3",
"@types/axios": "^0.14.0",
"@types/react-quill": "^1.3.10",
"typescript": "^4.9.5",
"react-scripts": "5.0.1"
},

View File

@@ -839,8 +839,21 @@ const EventAdmin: React.FC = () => {
<Box sx={{ mb: 4 }}>
<Typography variant="subtitle1" gutterBottom>
<strong>Info:</strong> {event.description || 'None'}
<strong>Info:</strong>
</Typography>
<Box
sx={{
mb: 2,
pl: 2,
'& p': { margin: 0, lineHeight: 1.5 },
'& br': { display: 'block', content: '""', marginTop: '0.5em' },
'& ul, & ol': { marginLeft: 2, marginTop: '0.5em', marginBottom: '0.5em', paddingLeft: '1.5em' },
'& li': { marginBottom: 0, lineHeight: 1.5 },
'& h1, & h2, & h3': { marginTop: '0.75em', marginBottom: '0.5em' },
'& a': { color: 'primary.main' },
}}
dangerouslySetInnerHTML={{ __html: event.description || 'None' }}
/>
<Typography variant="subtitle1" gutterBottom>
<strong>Date:</strong> {new Date(event.date).toLocaleString()}
</Typography>

View File

@@ -109,10 +109,11 @@ const EventDetails: React.FC = () => {
</Typography>
<Box
sx={{
'& p': { marginBottom: 1 },
'& ul, & ol': { marginLeft: 2, marginBottom: 1 },
'& li': { marginBottom: 0.5 },
'& h1, & h2, & h3': { marginTop: 2, marginBottom: 1 },
'& p': { margin: 0, lineHeight: 1.5 },
'& br': { display: 'block', content: '""', marginTop: '0.5em' },
'& ul, & ol': { marginLeft: 2, marginTop: '0.5em', marginBottom: '0.5em', paddingLeft: '1.5em' },
'& li': { marginBottom: 0, lineHeight: 1.5 },
'& h1, & h2, & h3': { marginTop: '0.75em', marginBottom: '0.5em' },
'& a': { color: 'primary.main' },
}}
dangerouslySetInnerHTML={{ __html: event.description }}

View File

@@ -153,9 +153,26 @@ const EventList: React.FC = () => {
/>
</Box>
{event.description && (
<Typography variant="body2" color="text.secondary">
<strong>Info:</strong> {event.description}
</Typography>
<>
<Typography variant="body2" color="text.secondary" gutterBottom>
<strong>Info:</strong>
</Typography>
<Box
sx={{
pl: 2,
mb: 1,
color: 'text.secondary',
fontSize: '0.875rem',
'& p': { margin: 0, lineHeight: 1.5 },
'& br': { display: 'block', content: '""', marginTop: '0.5em' },
'& ul, & ol': { marginLeft: 2, marginTop: '0.5em', marginBottom: '0.5em', paddingLeft: '1.5em' },
'& li': { marginBottom: 0, lineHeight: 1.5 },
'& h1, & h2, & h3': { marginTop: '0.75em', marginBottom: '0.25em', fontSize: '1rem' },
'& a': { color: 'primary.main' },
}}
dangerouslySetInnerHTML={{ __html: event.description }}
/>
</>
)}
<Typography variant="body2" color="text.secondary">
<strong>Date:</strong> {new Date(event.date).toLocaleString()}

View File

@@ -187,8 +187,21 @@ const EventView: React.FC = () => {
<Box sx={{ mb: 4 }}>
<Typography variant="subtitle1" gutterBottom>
<strong>Info:</strong> {event.description || 'None'}
<strong>Info:</strong>
</Typography>
<Box
sx={{
mb: 2,
pl: 2,
'& p': { margin: 0, lineHeight: 1.5 },
'& br': { display: 'block', content: '""', marginTop: '0.5em' },
'& ul, & ol': { marginLeft: 2, marginTop: '0.5em', marginBottom: '0.5em', paddingLeft: '1.5em' },
'& li': { marginBottom: 0, lineHeight: 1.5 },
'& h1, & h2, & h3': { marginTop: '0.75em', marginBottom: '0.5em' },
'& a': { color: 'primary.main' },
}}
dangerouslySetInnerHTML={{ __html: event.description || 'None' }}
/>
<Typography variant="subtitle1" gutterBottom>
<strong>Date:</strong> {new Date(event.date).toLocaleString()}
</Typography>

View File

@@ -453,9 +453,25 @@ const RSVPForm: React.FC = () => {
{event.title}
</Typography>
{event.description && (
<Typography variant="body2" color="text.secondary">
<strong>Info:</strong> {event.description}
</Typography>
<>
<Typography variant="body2" color="text.secondary" gutterBottom>
<strong>Info:</strong>
</Typography>
<Box
sx={{
pl: 2,
color: 'text.secondary',
fontSize: '0.875rem',
'& p': { margin: 0, lineHeight: 1.5 },
'& br': { display: 'block', content: '""', marginTop: '0.5em' },
'& ul, & ol': { marginLeft: 2, marginTop: '0.5em', marginBottom: '0.5em', paddingLeft: '1.5em' },
'& li': { marginBottom: 0, lineHeight: 1.5 },
'& h1, & h2, & h3': { marginTop: '0.75em', marginBottom: '0.5em' },
'& a': { color: 'primary.main' },
}}
dangerouslySetInnerHTML={{ __html: event.description }}
/>
</>
)}
{event.description && <Divider sx={{ my: 2 }} />} {/* Separator after Info */}
<Box> {/* Grouping Date, Location, and Note */}

View File

@@ -1,6 +1,6 @@
import React from 'react';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';
import ReactQuill from 'react-quill-new';
import 'react-quill-new/dist/quill.snow.css';
import { Box, Typography, styled } from '@mui/material';
const StyledEditorContainer = styled(Box)(({ theme }) => ({