-
Notifications
You must be signed in to change notification settings - Fork 6
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
implemented designs for application process section #231
Open
dersual
wants to merge
9
commits into
main
Choose a base branch
from
216-students---application-process--internal-teams
base: main
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Open
Changes from all commits
Commits
Show all changes
9 commits
Select commit
Hold shift + click to select a range
811dba7
implemented designs for application process section
dersual ae8f7ad
hopefully has resolved merge issues
dersual 19d1531
ran prettier checks
dersual 7493bdb
deal with build errors
dersual f0cc47c
implement application and team section designs/cleanup
dersual 0288a2d
Added email icon & fixed padding issues
dersual 76c3eb8
Added requested changes
dersual c7e2d0e
Organized section components for ForStudents page
dersual 50c8278
Fixed bottom padding in StudentsProjectTeam component
dersual File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,165 @@ | ||
| import React from "https://esm.sh/react"; | ||
|
|
||
| export default function ApplicationProcess({ comp }) { | ||
| return ( | ||
| <section className="flex flex-col items-center px-12 pb-12 max-lg:px-12 max-md:w-full max-md:px-4"> | ||
| <h1 className="text-4xl text-center"> | ||
| <strong>Application Process</strong> | ||
| </h1> | ||
| <div className="grid grid-cols-[1fr_2px_1fr] grid-rows-[auto] h-auto grid-flow-row pt-12 mt-2"> | ||
| <div className="h-[149px] w-[2px]"></div> | ||
| <div className="w-full relative h-full bg-black"> | ||
| <div className="absolute top-0 left-1/2 translate-x-[-50%] w-[10px] h-[10px] bg-black rounded-full"></div> | ||
| </div> | ||
| <div>{/*Empty div that exists for spacing reasons*/}</div> | ||
| <div className="flex h-[auto] justify-center mr-14 relative top-[-50%] items-center"> | ||
| <div className="w-80 self-stretch p-8 rounded-l-lg border border-[#9D1535]"> | ||
| <h2 className="font-bold text-xl text-[#9D1535]"> | ||
| Written Application | ||
| </h2> | ||
| <p className="text-[#9D1535]"> | ||
| Our written application will open in a short and anonymized format | ||
| where we can get a sense of what brings you to Blueprint! | ||
| </p> | ||
| </div> | ||
| <div className="w-28 self-stretch bg-[#9D1535] rounded-r-lg border border-[#9D1535] flex justify-center items-center"> | ||
| <img | ||
| className="object-cover" | ||
| src={"../../assets/clip_art/MdOutlineStickyNote2.svg"} | ||
| alt="Sticky Note" | ||
| /> | ||
| </div> | ||
| {/*This svg is for the triangle pointing right at the end of every left box*/} | ||
| <div className="left-[-1px] relative"> | ||
| <svg | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| width="23" | ||
| height="26" | ||
| viewBox="0 0 23 26" | ||
| fill="none" | ||
| className="left-[-1px]" | ||
| > | ||
| <path d="M23 13L0.5 0.00961876V25.9904L23 13Z" fill="#9D1535" /> | ||
| </svg> | ||
| </div> | ||
| </div> | ||
| <div className="w-full relative h-full bg-black"> | ||
| <div className="absolute top-[-25px] left-1/2 translate-x-[-50%] w-[50px] h-[50px] bg-[#9D1535] rounded-full flex justify-center items-center"> | ||
| <p className="text-xl text-white text-center font-bold">1</p> | ||
| </div> | ||
| </div> | ||
| <div>{/*Empty div that exists for spacing reasons*/}</div> | ||
| <div>{/*Empty div that exists for spacing reasons*/}</div> | ||
| <div className="w-full relative h-full bg-black"> | ||
| <div className="absolute top-[-25px] left-1/2 translate-x-[-50%] w-[50px] h-[50px] bg-[#9D1535] rounded-full flex justify-center items-center"> | ||
| <p className="text-xl text-white text-center font-bold">2</p> | ||
| </div> | ||
| </div> | ||
| <div className="flex h-[auto] justify-center ml-14 relative top-[-50%] items-center"> | ||
| {/*This svg is for every triangle pointing left at the end of every right box*/} | ||
| <div className="left-[1px] relative"> | ||
| <svg | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| width="23" | ||
| height="26" | ||
| viewBox="0 0 23 26" | ||
| fill="none" | ||
| > | ||
| <path d="M0 13L22.5 0.00961876V25.9904L0 13Z" fill="#9D1535" /> | ||
| </svg> | ||
| </div> | ||
| <div className="w-28 self-stretch bg-[#9D1535] rounded-l-lg border border-[#9D1535] flex justify-center items-center"> | ||
| <img | ||
| className="object-cover" | ||
| src={"../../assets/clip_art/MdMenuBook.svg"} | ||
| alt="Menu Book" | ||
| /> | ||
| </div> | ||
| <div className="w-80 self-stretch p-8 rounded-r-lg border border-[#9D1535]"> | ||
| <h2 className="font-bold text-xl text-[#9D1535]"> | ||
| Take Home Challenge | ||
| </h2> | ||
| <p className="text-[#9D1535]"> | ||
| Next, we will assign you a challenge that corresponds to your | ||
| applied role and is to be completed on your own time (1-2 hours | ||
| max). | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <div className="flex h-[auto] justify-center mr-14 relative top-[-50%] items-center"> | ||
| <div className="w-80 self-stretch p-8 rounded-l-lg border border-[#9D1535]"> | ||
| <h2 className="font-bold text-xl text-[#9D1535]"> | ||
| Blueprint Games | ||
| </h2> | ||
| <p className="text-[#9D1535]"> | ||
| After the challenge, we will invite you to an interactive and | ||
| collaborative activity where you will solve a mock NPO problem. | ||
| </p> | ||
| </div> | ||
| <div className="w-28 self-stretch bg-[#9D1535] rounded-r-lg border border-[#9D1535] flex justify-center items-center"> | ||
| <img | ||
| className="object-cover" | ||
| src={"../../assets/clip_art/MdPeopleOutline.svg"} | ||
| alt="Sticky Note" | ||
| /> | ||
| </div> | ||
| {/*This svg is for the triangle pointing right at the end of every left box*/} | ||
| <div className="left-[-1px] relative"> | ||
| <svg | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| width="23" | ||
| height="26" | ||
| viewBox="0 0 23 26" | ||
| fill="none" | ||
| className="left-[-1px]" | ||
| > | ||
| <path d="M23 13L0.5 0.00961876V25.9904L23 13Z" fill="#9D1535" /> | ||
| </svg> | ||
| </div> | ||
| </div> | ||
| <div className="w-full relative h-full bg-black"> | ||
| <div className="absolute top-[-25px] left-1/2 translate-x-[-50%] w-[50px] h-[50px] bg-[#9D1535] rounded-full flex justify-center items-center"> | ||
| <p className="text-xl text-white text-center font-bold">3</p> | ||
| </div> | ||
| </div> | ||
| <div>{/*Empty div that exists for spacing reasons*/}</div> | ||
| <div>{/*Empty div that exists for spacing reasons*/}</div> | ||
| <div className="w-full relative h-full bg-black"> | ||
| <div className="absolute top-[-25px] left-1/2 translate-x-[-50%] w-[50px] h-[50px] bg-[#9D1535] rounded-full flex justify-center items-center"> | ||
| <p className="text-xl text-white text-center font-bold">4</p> | ||
| </div> | ||
| <div className="absolute bottom-0 left-1/2 translate-x-[-50%] w-[10px] h-[10px] bg-black rounded-full"></div> | ||
| </div> | ||
| <div className="flex h-[auto] justify-center ml-14 relative top-[-50%] items-center"> | ||
| {/*This svg is for every triangle pointing left at the end of every right box*/} | ||
| <div className="left-[1px] relative"> | ||
| <svg | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| width="23" | ||
| height="26" | ||
| viewBox="0 0 23 26" | ||
| fill="none" | ||
| > | ||
| <path d="M0 13L22.5 0.00961876V25.9904L0 13Z" fill="#9D1535" /> | ||
| </svg> | ||
| </div> | ||
| <div className="w-28 self-stretch bg-[#9D1535] rounded-l-lg border border-[#9D1535] flex justify-center items-center"> | ||
| <img | ||
| className="object-cover" | ||
| src={"../../assets/clip_art/BiCoffeeToGo.svg"} | ||
| alt="Menu Book" | ||
| /> | ||
| </div> | ||
| <div className="w-80 self-stretch p-8 rounded-r-lg border border-[#9D1535]"> | ||
| <h2 className="font-bold text-xl text-[#9D1535]">Coffee Chat</h2> | ||
| <p className="text-[#9D1535]"> | ||
| Finally, we will invite you to speak with an executive board | ||
| member to review each stage of the application process, ask | ||
| questions, and talk! | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| ); | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| import React from "https://esm.sh/react"; | ||
|
|
||
| export default function InternalDesignTeam({ comp }) { | ||
| return ( | ||
| <section> | ||
| <div className="flex items-start justify-center align-center pt-12 px-12 max-lg:px-12 max-md:w-full max-md:px-4 gap-14"> | ||
| <div> | ||
| <img | ||
| className="object-cover" | ||
| src={"../../assets/clip_art/internal_teams.svg"} | ||
| alt="Internal Teams" | ||
| /> | ||
| </div> | ||
| <div className="flex w-7/12 flex-col gap-6"> | ||
| <h2 className="font-bold text-3xl">Internal Teams</h2> | ||
| <span className="bg-primary text-white self-start px-2 rounded-md text-xs"> | ||
| No Application | ||
| </span> | ||
| <div> | ||
| <h2 className="text-2xl mb-3.5 font-bold">Tech Team</h2> | ||
| <p className="text-xl"> | ||
| <strong>Purpose: </strong> | ||
| Apply your coding skills and support internal development | ||
| projects! | ||
| </p> | ||
| <p className="text-xl"> | ||
| <strong>Goal: </strong> | ||
| Help run Blueprint as an organization while also | ||
| learning/improving programming skills! | ||
| </p> | ||
| </div> | ||
| <div> | ||
| <h2 className="text-2xl mb-3.5 font-bold">Design Team</h2> | ||
| <p className="text-xl"> | ||
| <strong>Purpose: </strong> | ||
| Support the design process in the tech team and project teams! | ||
| </p> | ||
| <p className="text-xl"> | ||
| <strong>Goal: </strong> | ||
| Help strengthen collaboration between designers and developers | ||
| while also learning/improving design skills! | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col items-center p-12 max-lg:px-12 max-md:w-full max-md:px-4"> | ||
| <h1 className="text-[40px] text-center text-primary font-bold w-3/5 my-16"> | ||
| Have any questions? Reach out at sit.blueprint@gmail.com{" "} | ||
| <img | ||
| className="object-cover inline h-8 w-8" | ||
| src={"../../assets/clip_art/AiOutlineMail.svg"} | ||
| alt="Email" | ||
| /> | ||
| </h1> | ||
| </div> | ||
| </section> | ||
| ); | ||
| } |
File renamed without changes.
2 changes: 1 addition & 1 deletion
2
src/_components/StudentsProjectTeam.jsx → ...nents/ForStudents/StudentsProjectTeam.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
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.
nit: The top padding of the application changes does not correspond. to the paddings elsewhere in the/studentspage.Try to fix the padding, so that they are both the same. You will need to change the top padding in this component.
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.
If you are talking about the weird spacing between the Our Teams and Application Process sections, it's because the component/element before it has a large padding at the bottom. Although I didn't make that component, would you like me to adjust the padding?
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.
Yes please
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.
I pushed a commit fixing the bottom padding of the abovementioned component, though the extra space can also be attributed to its weird height. I talked to Christian yesterday and it should be okay for now, just wanted to check if the spacing is also okay for you now.