more mobile styling

BU-Spark · Jun 24, 2024 · fb3a002 · fb3a002
1 parent cf77cc1
commit fb3a002
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 5 deletions.
diff --git a/client/src/pages/ballotInfo/ballotInitDropDown.tsx b/client/src/pages/ballotInfo/ballotInitDropDown.tsx
@@ -14,7 +14,7 @@ import { Card, CardContent } from '@mui/material';
 
 export default function BallotInitDropDown() {
     return (
-        <div className='p-4 text-center w-full sm:w-3/4 ' style={{ paddingLeft: '24px', paddingRight: '24px' }} >
+        <div className='p-4 text-center w-full lg:w-3/4' >
             {ballotInitData.map((item, index) => (
                 <Accordion key={index} className='bg-white mb-3'>
                     <AccordionSummary

diff --git a/client/src/pages/ballotInfo/electionCheckBox/electionCheckbox.tsx b/client/src/pages/ballotInfo/electionCheckBox/electionCheckbox.tsx
@@ -89,9 +89,9 @@ const ElectionCheckbox: React.FC<ElectionCheckboxProps> = ({ onCheck }) => {
                 <div className='grid grid-cols-4 mt-8'>
                     <div className='md:col-span-1 hidden md:block'>
                     </div>
-                    <div className="space-y-4 mx-10 py-4 rounded-2xl shadow-2xl border border-gray-200 col-span-4 lg:col-span-2 bg-white">
+                    <div className="space-y-4 mx-6 py-4 rounded-2xl shadow-2xl border border-gray-200 col-span-4 lg:col-span-2 bg-white">
                         <div className="space-y-4 w-full px-4">
-                            <div className="w-full px-4 text-left text-lg">
+                            <div className="w-full text-left text-lg">
                                 {sortedElectionDates.length === 0 ? (
                                     <p className='text-xl text-center'><strong>No upcoming elections</strong></p>
                                 ) : (

diff --git a/client/src/pages/ballotInfo/index.tsx b/client/src/pages/ballotInfo/index.tsx
@@ -45,7 +45,7 @@ export default function BallotInfo() {
 
 
             {/* What's on the Ballot dropdown */}
-            <div className='flex flex-col justify-center items-center p-8 my-6'>
+            <div className='flex flex-col justify-center items-center py-8 px-2 my-6'>
                 <h1 className='font-bold text-center mx-6 my-4 text-4xl text-blue-700' style={{ fontFamily: 'Arial, sans-serif' }}><strong>What&apos;s on the Ballot?</strong></h1>
 
                 {/* Don't make instance of candidate data till form and election are done */}

diff --git a/client/src/pages/ballotInfo/whatsOnTheBallot/candidateData.tsx b/client/src/pages/ballotInfo/whatsOnTheBallot/candidateData.tsx
@@ -141,7 +141,7 @@ export default function CandidateData() {
 
 
     return (
-        <div className='p-4 text-center w-full sm:w-3/4' style={{ paddingLeft: '24px', paddingRight: '24px' }} >
+        <div className='p-4 text-center w-full lg:w-3/4'>
 
             {/* Map over the filtered candidates */}
             {Object.keys(filteredCandidateData).length > 0 ? (