-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add Subtitle #29
Add Subtitle #29
Conversation
allison-pham
commented
Oct 12, 2023
src/app/page.js
Outdated
const Home = () => { | ||
return ( | ||
<> | ||
<Landing /> | ||
<About /> | ||
<WhyJoin /> | ||
<Projects /> | ||
<Subtitle /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
title = "Motivation" subtitle = "Rural communities are already disadvantaged socioeconomically"
src/components/Subtitle.jsx
Outdated
const Subtitle = ({ title }) => { | ||
return <div>Subtitle</div>; | ||
import React from "react"; | ||
const Subtitle = ({ title = "| Motivation" }) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
{title, subtitle}
src/components/Subtitle.jsx
Outdated
return <div>Subtitle</div>; | ||
import React from "react"; | ||
const Subtitle = ({ title = "| Motivation" }) => { | ||
// const Subtitle = ({ title }) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comments
src/components/Subtitle.jsx
Outdated
const Subtitle = ({ title = "| Motivation" }) => { | ||
// const Subtitle = ({ title }) => { | ||
const blueColor = "#1151D3"; | ||
const greenColor = "#80C393"; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use tailwind color
src/components/Subtitle.jsx
Outdated
const greenColor = "#80C393"; | ||
return ( | ||
<div> | ||
<h2 style={{ color: blueColor }}>{title}</h2> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use p tag
add left border: border-l-4 border-ewb-green
use tailwind to color the text: text-ewb-blue-200
give a text size
src/components/Subtitle.jsx
Outdated
return ( | ||
<div> | ||
<h2 style={{ color: blueColor }}>{title}</h2> | ||
<p style={{ color: greenColor }}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use tailwind className
give a text size
src/components/Subtitle.jsx
Outdated
<div> | ||
<h2 style={{ color: blueColor }}>{title}</h2> | ||
<p style={{ color: greenColor }}> | ||
Rural communities are already disadvantaged socioeconomically |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use the subtitle prop {subtiotle}