From 87acdcde66fef6b5d8bd72e7d03ff2afbf6c94af Mon Sep 17 00:00:00 2001 From: James O'Kane Date: Thu, 26 Sep 2024 18:27:49 +0100 Subject: [PATCH] render fixes 2 --- my-next-app/src/app/mock_db/reviews.json | 3 +- .../src/app/movies/[id]/page.module.css | 6 +- my-next-app/src/app/page.module.css | 1 - my-next-app/src/components/Footer/Footer.jsx | 13 +++- .../src/components/Footer/Footer.module.css | 2 +- .../src/components/Footer/teamMembers.js | 66 ++++++++--------- .../src/components/Header/Header.module.css | 2 +- .../components/HeroSection/HeroSection.jsx | 15 ++-- .../HeroSection/HeroSection.module.css | 73 +++++++++---------- 9 files changed, 95 insertions(+), 86 deletions(-) diff --git a/my-next-app/src/app/mock_db/reviews.json b/my-next-app/src/app/mock_db/reviews.json index d972ec4..79bb127 100644 --- a/my-next-app/src/app/mock_db/reviews.json +++ b/my-next-app/src/app/mock_db/reviews.json @@ -44,7 +44,7 @@ "date": "2022-09-05", "star_rating": 5 }, - + { "review_id": "6", "movie_name": "Deadpool & Wolverine", @@ -229,4 +229,3 @@ "star_rating": 4 } ] - diff --git a/my-next-app/src/app/movies/[id]/page.module.css b/my-next-app/src/app/movies/[id]/page.module.css index 889b28c..f217b2d 100644 --- a/my-next-app/src/app/movies/[id]/page.module.css +++ b/my-next-app/src/app/movies/[id]/page.module.css @@ -58,8 +58,8 @@ } .poster { - display: block; /* Makes the image a block-level element */ - width: 300px; /* Maintains the width of the poster */ - border-radius: 8px; /* Keeps the existing border radius */ + display: block; /* Makes the image a block-level element */ + width: 300px; /* Maintains the width of the poster */ + border-radius: 8px; /* Keeps the existing border radius */ margin: 0 auto 1rem auto; /* Centers the image horizontally and adds bottom margin */ } diff --git a/my-next-app/src/app/page.module.css b/my-next-app/src/app/page.module.css index 00d79b2..e7ebf0e 100644 --- a/my-next-app/src/app/page.module.css +++ b/my-next-app/src/app/page.module.css @@ -73,4 +73,3 @@ align-items: center; margin-top: 1em; } */ - diff --git a/my-next-app/src/components/Footer/Footer.jsx b/my-next-app/src/components/Footer/Footer.jsx index 28e1241..f2ab7d2 100644 --- a/my-next-app/src/components/Footer/Footer.jsx +++ b/my-next-app/src/components/Footer/Footer.jsx @@ -8,8 +8,17 @@ export default function Footer() { {teamMembers.map((member, index) => (

{member.name}

- GitHub - LinkedIn + + GitHub + + + LinkedIn +
))} diff --git a/my-next-app/src/components/Footer/Footer.module.css b/my-next-app/src/components/Footer/Footer.module.css index d56c4b1..036b4b1 100644 --- a/my-next-app/src/components/Footer/Footer.module.css +++ b/my-next-app/src/components/Footer/Footer.module.css @@ -36,4 +36,4 @@ .linkedin { margin-left: 1rem; margin-right: 1rem; -} \ No newline at end of file +} diff --git a/my-next-app/src/components/Footer/teamMembers.js b/my-next-app/src/components/Footer/teamMembers.js index ec89e9b..e342042 100644 --- a/my-next-app/src/components/Footer/teamMembers.js +++ b/my-next-app/src/components/Footer/teamMembers.js @@ -1,34 +1,34 @@ const teamMembers = [ - { - name: "James O'kane", - github: "https://github.com/Orbiccode", - linkedin: "https://www.linkedin.com/in/james-o-kane-570b71314/" - }, - { - name: "Amin Abdikadir", - github: "https://github.com/Amin-Abdikadir", - linkedin: "https://www.linkedin.com/in/amin-abdikadir-b12267297/" - }, - { - name: "Rowan Godfrey", - github: "https://github.com/rw4n99", - linkedin: "https://www.linkedin.com/in/rowangodfrey/" - }, - { - name: "Maria Gadkova", - github: "https://github.com/MariSayo", - linkedin: "https://linkedin.com/in/maria-gadkova-a23643300" - }, - { - name: "Oliver Kelly", - github: "https://github.com/olikelly00", - linkedin: "https://linkedin.com/in/olikelly/" - }, - { - name: "Shilpa Goel", - github: "https://github.com/SG801", - linkedin: "https://www.linkedin.com/in/shilpa-g-75a1991a/" - } - ]; - - export default teamMembers; \ No newline at end of file + { + name: "James O'kane", + github: 'https://github.com/Orbiccode', + linkedin: 'https://www.linkedin.com/in/james-o-kane-570b71314/', + }, + { + name: 'Amin Abdikadir', + github: 'https://github.com/Amin-Abdikadir', + linkedin: 'https://www.linkedin.com/in/amin-abdikadir-b12267297/', + }, + { + name: 'Rowan Godfrey', + github: 'https://github.com/rw4n99', + linkedin: 'https://www.linkedin.com/in/rowangodfrey/', + }, + { + name: 'Maria Gadkova', + github: 'https://github.com/MariSayo', + linkedin: 'https://linkedin.com/in/maria-gadkova-a23643300', + }, + { + name: 'Oliver Kelly', + github: 'https://github.com/olikelly00', + linkedin: 'https://linkedin.com/in/olikelly/', + }, + { + name: 'Shilpa Goel', + github: 'https://github.com/SG801', + linkedin: 'https://www.linkedin.com/in/shilpa-g-75a1991a/', + }, +]; + +export default teamMembers; diff --git a/my-next-app/src/components/Header/Header.module.css b/my-next-app/src/components/Header/Header.module.css index 094fda9..4dee0b7 100644 --- a/my-next-app/src/components/Header/Header.module.css +++ b/my-next-app/src/components/Header/Header.module.css @@ -21,7 +21,7 @@ .title { margin: 0; - font-size: 1.5rem;/*CHECK WITH JAMES IF THIS OK*/ + font-size: 1.5rem; /*CHECK WITH JAMES IF THIS OK*/ font-weight: 500; color: #fff; letter-spacing: 0.2em; diff --git a/my-next-app/src/components/HeroSection/HeroSection.jsx b/my-next-app/src/components/HeroSection/HeroSection.jsx index 1bd05c8..b67cffe 100644 --- a/my-next-app/src/components/HeroSection/HeroSection.jsx +++ b/my-next-app/src/components/HeroSection/HeroSection.jsx @@ -6,12 +6,15 @@ export default function HeroSection() { const [currentMessageIndex, setCurrentMessageIndex] = useState(0); // Track the current message const [charIndex, setCharIndex] = useState(0); // Track character typing const [isTyping, setIsTyping] = useState(true); // Track if typing is in progress - const messages = useMemo(() => [ - 'Welcome to Reel Magic, the home of movie reviews you can trust.', - 'Join the Reel Revolution!', - 'A new way to share your thoughts.', - 'Reel people, Reel reviews, Reel magic.', - ], []); + const messages = useMemo( + () => [ + 'Welcome to Reel Magic, the home of movie reviews you can trust.', + 'Join the Reel Revolution!', + 'A new way to share your thoughts.', + 'Reel people, Reel reviews, Reel magic.', + ], + [], + ); const typingSpeed = 80; // Speed of typing each character const pauseBetweenMessages = 1000; // Pause between messages diff --git a/my-next-app/src/components/HeroSection/HeroSection.module.css b/my-next-app/src/components/HeroSection/HeroSection.module.css index b749bbe..b2ae8e6 100644 --- a/my-next-app/src/components/HeroSection/HeroSection.module.css +++ b/my-next-app/src/components/HeroSection/HeroSection.module.css @@ -1,45 +1,44 @@ .title { - font-family: 'YourFontFamily', sans-serif; - font-size: 2rem; - color: #ff9e00; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - justify-content: center; - } + font-family: 'YourFontFamily', sans-serif; + font-size: 2rem; + color: #ff9e00; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + justify-content: center; +} .carousel { - display: flex; - flex-direction: row; - overflow-y: scroll; - } + display: flex; + flex-direction: row; + overflow-y: scroll; +} .heroSection { - font-weight: 200; - height: 300px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - } + font-weight: 200; + height: 300px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} - .taglineContainer { - overflow: hidden; - white-space: nowrap; - } - - .tagline { - display: inline-block; - padding-left: 100%; - animation: marquee 15s linear infinite; - } +.taglineContainer { + overflow: hidden; + white-space: nowrap; +} + +.tagline { + display: inline-block; + padding-left: 100%; + animation: marquee 15s linear infinite; +} - @keyframes marquee { - from { - transform: translate(0, 0); - } - to { - transform: translate(-100%, 0); - } - } \ No newline at end of file + from { + transform: translate(0, 0); + } + to { + transform: translate(-100%, 0); + } +}