This task involves implementing two sections: the Hybrid Environment section and the Tracks section. Both sections are meant to offer more information about Technica-specific hacking options including type of Technica attendance as well as hacking focus.
Hybrid Environment
This section includes the icons and descriptions for each of Technica’s attendance options: In-person, Hybrid, and Virtual.
Each of the options should have its own icon and text, and take up a third of the available horizontal space (stacked vertically instead for mobile).
Please ensure that the alignment of each icon with its corresponding text is resolution-responsive, so each person viewing the page sees it as intended.
Tracks
This section includes five cards, one for each of Technica’s five tracks (General, Beginner, Startup, Research, Hardware).
As with the above, mobile users should see the cards stacked vertically rather than listed horizontally.
Each of the cards should have two sides:
The front of the card should have the title of the track and a description
It should also have a button to flip the card over (this should have a flipping animation)
The back of the card should have an illustration of the track
The button should change to say “return to front”
To-Do
[x] “Hybrid Environment” Section Header
[x] Environment Icons
[x] Environment Header & Description
[x] “Tracks” Section Header
[x] Card Front (Track Title & Description, Hardware track desc. coming this wknd)
[x] Card Back (Track Illustration, placeholder images are good)
This task involves implementing two sections: the Hybrid Environment section and the Tracks section. Both sections are meant to offer more information about Technica-specific hacking options including type of Technica attendance as well as hacking focus.
Hybrid Environment This section includes the icons and descriptions for each of Technica’s attendance options: In-person, Hybrid, and Virtual. Each of the options should have its own icon and text, and take up a third of the available horizontal space (stacked vertically instead for mobile). Please ensure that the alignment of each icon with its corresponding text is resolution-responsive, so each person viewing the page sees it as intended.
Tracks This section includes five cards, one for each of Technica’s five tracks (General, Beginner, Startup, Research, Hardware). As with the above, mobile users should see the cards stacked vertically rather than listed horizontally. Each of the cards should have two sides: The front of the card should have the title of the track and a description It should also have a button to flip the card over (this should have a flipping animation) The back of the card should have an illustration of the track The button should change to say “return to front”
To-Do
FIGMA: https://www.figma.com/design/wYIf6kQ0r033Tgd9n7HJaO/2024-Themed-Site?node-id=220-4&t=0niFF46d03LTFLnM-0