ita-social-projects / ita-social-projects/StreetCode

About us

Open
#910 0 comments 0 reactions 1 assignee Claimed by @sviatoslaw-lotsko View on GitHub
(Epic#3) Other pages User Story
Dominant language
C#
Stars
27
Forks
14
PR merge metrics
No merged PRs in 30d

Description

**As a** user **I want to** see detailed information about Streetcode, team, and vacancies **so that** I will better know about the project and team working on it and possibly find a new job.

**Description**
This page will allow users to read more about the Streetcode project. They will also be able to read about the owners and teams that worked on the project.

### Acceptance Criteria
1. The user is able to read about the project.
![image](https://github.com/user-attachments/assets/ced9ac56-c217-41b6-a440-83b7cfdcc344)
2. The user is able to read about the owners of the project.
2.1. Owners` photos, quotes, name, surname, their social media links, and role on the project are displayed.
2.2. The owner's card contains functional hyperlinks that redirect users to the social media account of the owners.
![image](https://github.com/user-attachments/assets/abeecd02-703a-4ff9-980b-b9f7cf27c549)
3. The slider with the project teams is displayed.
3.1. The user can switch the active team using navigation arrows.
3.2. The user can change the active team by clicking on its name in the slider.
3.3. The name of the active team is displayed in the center in black color(#1D1F23).
3.4. The names of inactive teams are displayed on the left and right of the active team in gray color(#C4C4C4).
3.5. The arrow icons have three states (default, hover, active); they change visually on hover.
![image](https://github.com/user-attachments/assets/9aa65eab-aaa6-4dde-9feb-5536332de85c)
4. The selected team displays all its members below the slider.
4.1. The user is able to see the name, surname, role, photo, and social media of each team member.
4.2. If the user clicks on the member`s social media, he is redirected to the social media account of the member.
4.3. Social media are displayed in the form of the respective social network icons.
![image](https://github.com/user-attachments/assets/e941001a-1f0b-4040-aedb-457f19ef95a5)
4.4. If there are no team members in the system, the section is hidden.
5. Some team member cards contain a brief description of the respective person.
5.1. Cards with a description are marked with a red(#891F16) circle containing the letter "I" in the top right corner of the card.
5.2. When clicking on the marked card, a flip animation occurs, revealing information about the person.
6. The “Вакансії” section is available on this page.
6.1. The section title is displayed.
6.2. A brief introductory text to the section is displayed.
![image](https://github.com/user-attachments/assets/8b7c9ada-0d57-4c8f-9be5-2f8aea6c2a35)
6.3. If there are no vacancies in the system, the section is hidden.
7. A list of job vacancies is displayed in the form of cards.
7.1. The user is able to see the name of the vacancy, salary, and short description.
![image](https://github.com/user-attachments/assets/97228b7f-6577-46a1-8893-b220f3728006)
8. Each job vacancy card, after the brief description, includes a "Трохи ще" link that opens the full job description in a modal window.
8.1. The user can respond to the vacancy by clicking on the "Відгукнутись" button, which is located inside the modal window. The system redirects the user to the email composition window in a new tab.
8.1.1. The "Відгукнутись" button has three states (default, hover, active); it changes visually on hover.
8.2. The user can close the modal window by clicking the cross in the corner.
![image](https://github.com/user-attachments/assets/5d44cbb8-e4fc-4da3-9ada-6ba44f574756)

Link to approved design in [Figma](https://www.figma.com/design/jD2lHHBof7RrXWZqiUr0MU/HistoryCode?node-id=1-13038&t=5cyrOhAVcOJVNCYK-1)

[Epic link](https://github.com/ita-social-projects/StreetCode/issues/138)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.