9 |
10 |
11 |
12 |
13 | {t('Don’t have github account?')}
21 | {t('Sign up')} 22 |{t(title)}
23 | {subtitle &&{t(subtitle)}
} 24 | {listItems && ( 25 |
29 |
31 | );
32 | };
33 |
--------------------------------------------------------------------------------
/src/components/Header/components/MenuWrapper/styled.ts:
--------------------------------------------------------------------------------
1 | import styled from 'styled-components';
2 | import { ReactComponent as MenuToggle } from 'assets/svg/menuToggle.svg';
3 |
4 | export const StyledMenuWrapper = styled.div`
5 | display: flex;
6 | height: 60px;
7 |
8 | @media (max-width: 1260px) {
9 | height: 40px;
10 | }
11 | @media (max-width: 550px) {
12 | margin-left: -30px;
13 | }
14 | @media (max-width: 440px) {
15 | margin-left: -50px;
16 | }
17 | `;
18 |
19 | export const MenuButton = styled(MenuToggle)`
20 | width: 0;
21 | height: 0;
22 | cursor: pointer;
23 |
24 | @media (max-width: 1430px) {
25 | width: 24px;
26 | height: 24px;
27 | margin: 8px 0 0 40px;
28 | }
29 | @media (max-width: 700px) {
30 | width: 20px;
31 | height: 20px;
32 | margin: 10px 0 0 30px;
33 | }
34 | @media (max-width: 600px) {
35 | margin-left: 0;
36 | }
37 | @media (max-width: 440px) {
38 | width: 16px;
39 | height: 16px;
40 | margin-top: 12px;
41 | }
42 | `;
43 |
--------------------------------------------------------------------------------
/src/modules/StudentsTable/components/Dashboard/components/TableHead/styled.ts:
--------------------------------------------------------------------------------
1 | import styled from 'styled-components';
2 | import { LIGHT_TEXT_COLOR, DASHBOARD_HEADER_BG_COLOR } from 'appConstants/colors';
3 |
4 | export const StyledTableHead = styled.div`
5 | display: flex;
6 | flex-direction: column;
7 | justify-content: center;
8 | align-items: center;
9 | margin-right: 10px;
10 | padding: 10px 20px;
11 | color: ${LIGHT_TEXT_COLOR};
12 | background-color: ${DASHBOARD_HEADER_BG_COLOR};
13 | border-radius: 10px;
14 | @media (max-width: 768px) {
15 | padding: 10px;
16 | }
17 | @media (max-width: 440px) {
18 | padding: 5px;
19 | }
20 | `;
21 |
22 | export const StyledTableHeadRow = styled.div`
23 | display: flex;
24 | justify-content: space-between;
25 | align-items: center;
26 | width: 100%;
27 | `;
28 |
29 | export const StyledTableHeader = styled.div`
30 | max-width: 140px;
31 | height: auto;
32 | margin: 0;
33 | font-weight: 600;
34 | line-height: 150%;
35 | text-align: start;
36 | `;
37 |
--------------------------------------------------------------------------------
/src/modules/TeamsList/components/Teams/components/TeamUserTable/components/TableRow/components/ExpelButton/styled.ts:
--------------------------------------------------------------------------------
1 | import styled from 'styled-components';
2 | import { ReactComponent as Cross } from 'assets/svg/cross-small.svg';
3 | import { MAIN1_COLOR } from 'appConstants/colors';
4 | import { SVGArrowAdaptive } from 'typography';
5 |
6 | type StyledExpelButtonProps = {
7 | color?: string;
8 | };
9 |
10 | export const StyledExpelButton = styled.div{t('Redirecting...')}
30 |
28 | {countMembers || 0} {countMembers === 1 ? t('member') : t('members')}
29 |
30 | Click on the page to reload it. 37 |
15 | {item.members.map((item: string) => {
16 | return (
17 |
24 | {item}
25 |
26 | );
27 | })}
28 |
29 |
23 |
32 | {name}
24 | {description && {description}
}
25 | {t('The only person who creates the team is Team Lead')}
, 15 | }, 16 | { 17 | title: 'Join team', 18 | subtitle: 'To join an existing team', 19 | listItems: [`Press the “Join team” button`, `Specify the password`], 20 | }, 21 | { 22 | listItems: [ 23 | `If you have not found a team`, 24 | `If the team has fewer members than is required for the task`, 25 | ], 26 | isNote: 'Note', 27 | }, 28 | { 29 | title: 'You will see the following after joining the team', 30 | children: ( 31 |{item}
39 | {showPopup && setShowPopup(false)}
41 | >
42 | {currValue}
43 |
44 | {showPopup && {t(title)}
24 | {children}
47 | {courseOrder}
46 | {name}
47 | {teamSize ?? t('Unset')}
48 | {t(courseState)}
49 | -
57 | {TableRow}
58 |
32 |
63 | 33 | {t('My team - Team')} {team.number} 34 |
35 |
36 |
39 |
40 |
46 | {t('Leave course')}
47 |
48 |
49 |
50 |
51 | {t('Leave team')}
52 |
53 |
54 |
55 |
61 |
16 |
18 | goTo(9)}>{t('Skip')}
19 |
20 |
21 |
22 | ),
23 | action: () => history.push('/'),
24 | },
25 | {
26 | selector: '.secondStep',
27 | content: t('You can create new team'),
28 | action: () => history.push('/'),
29 | },
30 | {
31 | selector: '.thirdStep',
32 | content: t('Or join existing team'),
33 | action: () => history.push('/'),
34 | },
35 | {
36 | selector: '.fourthStep',
37 | content: t('You can always leave the course'),
38 | action: () => history.push('/'),
39 | },
40 | {
41 | content: t('On Teams page you can see other teams'),
42 | action: () => history.push('/'),
43 | },
44 | {
45 | content: t('On Dashboard page'),
46 | action: () => history.push('/students'),
47 | },
48 | {
49 | selector: '.seventhStep',
50 | content: t('With filter usage'),
51 | position: 'bottom',
52 | action: () => history.push('/students'),
53 | },
54 | {
55 | selector: '.eighthStep',
56 | content: t('With dropdown you can switch the course'),
57 | position: 'bottom',
58 | action: () => history.push('/students'),
59 | },
60 | {
61 | content: t('On Edit profile page'),
62 | action: () => history.push('/edit-profile'),
63 | },
64 | {
65 | content: t('If you forget something'),
66 | action: () => history.push('/tutorial'),
67 | },
68 | {
69 | content: () => (
70 | {t('Welcome to RSS Teams')}
17 |
71 |
79 | {
81 | dispatch(setIsTourOpen(false));
82 | }}
83 | href={LINK_TO_REPO}
84 | target="_blank"
85 | rel="noreferrer"
86 | >
87 | {t('Got it')}
88 |
89 |
90 |
91 | ),
92 | action: () => history.push('/'),
93 | },
94 | ];
95 |
--------------------------------------------------------------------------------
/src/modules/AdminPage/components/ContentWrapper/components/CoursesList/index.tsx:
--------------------------------------------------------------------------------
1 | import React, { FC } from 'react';
2 | import { CoursesListWrapper } from './styled';
3 | import { CourseItem } from './components/Course';
4 | import { Course } from 'types';
5 | import { ErrorModal, ModalEditCourse, ModalExpel } from 'components';
6 | import { useDispatch, useSelector } from 'react-redux';
7 | import {
8 | selectIsActiveModalEditCourse,
9 | selectIsActiveModalSortStudents,
10 | } from 'modules/TeamsList/selectors';
11 | import { activeModalSortStudents } from 'modules/TeamsList/teamsListReducer';
12 | import { useSortStudentsMutation } from 'hooks/graphql';
13 | import { useState } from 'react';
14 |
15 | export const CoursesList: FC<{
16 | courses: Course[];
17 | checkIsCourseNameUniq: (courseName: string) => boolean;
18 | }> = ({ courses, checkIsCourseNameUniq }) => {
19 | const [courseInfoToSort, setCourseInfoToSort] = useState72 | {t('Support us')}{' '} 73 | 74 | {t('our repo')} 75 | 76 | ! 77 |
78 |