Skip to content

Commit b28327c

Browse files
luizrrodriguesluizrrodrigues
authored
Merge pull request #6388 from topcoder-platform/tco23
TCO23
2 parents 2991837 + f6dd34e commit b28327c

File tree

12 files changed

+937
-1
lines changed

12 files changed

+937
-1
lines changed

‎.circleci/config.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -356,7 +356,7 @@ workflows:
356356
filters:
357357
branches:
358358
only:
359-
- debug-CMS-error
359+
- tco23
360360
# This is alternate dev env for parallel testing
361361
- "build-qa":
362362
context : org-global

‎src/server/tc-communities/tco23/metadata.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"challengeFilter": {
3+
"events": ["tco23"]
4+
},
5+
"communityId": "tco23",
6+
"communityName": "TCO23",
7+
"groupIds": [],
8+
"hideSearch": true,
9+
"logos": [{
10+
"img": "/community-app-assets/themes/tco/TCO23.svg",
11+
"url": "https://tco23.topcoder.com"
12+
}],
13+
"menuItems": [{
14+
"navigationMenu": "6SsceF3R5YuKxsf8XnCM5I"
15+
}],
16+
"newsFeed": "http://www.topcoder.com/feed",
17+
"subdomains": ["tco23"],
18+
"description": "2023 Topcoder Open. The Ultimate Programming & Design Tournament",
19+
"image": "tco23.jpg"
20+
}

‎src/shared/components/Contentful/ContentBlock/index.jsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import generalTheme from './themes/general.scss';
1919
import blobCard from './themes/blobCard.scss';
2020
import TCO20Theme from './themes/TCO20.scss';
2121
import largeCard from './themes/largeCard.scss';
22+
import bracketsTheme from './themes/brackets.scss';
2223

2324
const THEMES = {
2425
Default: defaultTheme,
@@ -31,6 +32,7 @@ const THEMES = {
3132
'Blob Card': blobCard,
3233
TCO20: TCO20Theme,
3334
'Large Card': largeCard,
35+
Brackets: bracketsTheme,
3436
};
3537

3638
/* Loads content block background asset. */

‎src/shared/components/Contentful/ContentBlock/themes/brackets.scss

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
@import "~styles/mixins";
2+
@import "~components/Contentful/brackets";
3+
4+
.contentWrapper {
5+
display: flex;
6+
margin: 0 auto;
7+
max-width: $screen-lg;
8+
padding: 15px 0;
9+
color: $tc-black;
10+
11+
@include xs-to-sm {
12+
flex-direction: column;
13+
}
14+
}
15+
16+
.container {
17+
align-content: center;
18+
background: white;
19+
padding: 10px 0;
20+
21+
&:nth-child(even) .contentWrapper {
22+
flex-direction: row-reverse;
23+
24+
@include xs-to-sm {
25+
flex-direction: column;
26+
}
27+
}
28+
}
29+
30+
strong a {
31+
font-weight: 600 !important;
32+
}
33+
34+
.content {
35+
flex: 1;
36+
padding: 0;
37+
38+
@include xs-to-md {
39+
padding: 15px;
40+
}
41+
42+
@include roboto-regular;
43+
44+
h1,
45+
h2,
46+
h3,
47+
h4,
48+
h5,
49+
h6 {
50+
color: $tco-black;
51+
}
52+
53+
@include brackets-headers;
54+
@include brackets-content;
55+
}
56+
57+
.image {
58+
flex: 1;
59+
margin: 15px;
60+
61+
img {
62+
width: 100%;
63+
}
64+
}

‎src/shared/components/Contentful/Tabs/Tabs.jsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import underlineDarkTheme from './themes/underline-dark.scss';
2727
import verticalTheme from './themes/vertical.scss';
2828
import pillsTheme from './themes/pills.scss';
2929
import underlineBoxTheme from './themes/underline-box.scss';
30+
import bracketsTheme from './themes/brackets.scss';
3031

3132
export const TAB_THEMES = {
3233
Default: defaultTheme,
@@ -38,6 +39,7 @@ export const TAB_THEMES = {
3839
Vertical: verticalTheme,
3940
Pills: pillsTheme,
4041
'Underline box': underlineBoxTheme,
42+
Brackets: bracketsTheme,
4143
};
4244

4345
export default class TabsItemsLoader extends Component {

‎src/shared/components/Contentful/Tabs/themes/brackets.scss

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
@import "~styles/mixins";
2+
3+
$container-background-gray: #ebebeb;
4+
$text-color-black: #262628;
5+
$text-color-gray: #888894;
6+
$text-color-pannel: #4a4a4a;
7+
8+
.container {
9+
margin: auto;
10+
11+
@include xs-to-sm {
12+
margin-top: 65px;
13+
}
14+
}
15+
16+
.tabListWrap {
17+
display: flex;
18+
justify-content: center;
19+
position: relative;
20+
21+
.tablist {
22+
@include roboto-regular;
23+
24+
display: flex;
25+
flex-direction: row;
26+
justify-content: center;
27+
list-style-type: none;
28+
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
29+
margin: auto;
30+
min-height: 60px;
31+
border-radius: 30px;
32+
align-items: center;
33+
background-color: white;
34+
padding: 0 25px;
35+
border: 1px solid #e4e4e4;
36+
37+
@include xs-to-sm {
38+
white-space: nowrap;
39+
flex-direction: column;
40+
padding: 28px 15px 0;
41+
align-items: flex-start;
42+
border-radius: 8px;
43+
min-width: 85vw;
44+
overflow: visible;
45+
position: absolute;
46+
z-index: 999;
47+
display: none; // by default
48+
49+
&.visible {
50+
display: flex;
51+
}
52+
}
53+
}
54+
55+
.tabListMobileTrigger {
56+
display: none;
57+
justify-content: center;
58+
align-items: center;
59+
background-color: white;
60+
position: absolute;
61+
top: -65px;
62+
width: 85vw;
63+
left: calc(50% - 42.5vw);
64+
outline: none;
65+
border: navajowhite;
66+
min-height: 60px;
67+
font-family: Barlow, sans-serif;
68+
font-size: 16px;
69+
font-weight: 600;
70+
text-transform: uppercase;
71+
border-radius: 30px;
72+
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
73+
color: #2a2a2a;
74+
75+
@media (max-width: 768px) {
76+
display: flex;
77+
}
78+
79+
.tabListMobileTriggerSVG,
80+
.tabListMobileTriggerSVGOpen {
81+
margin-left: 9px;
82+
}
83+
84+
.tabListMobileTriggerSVGOpen {
85+
transform: scaleY(-1);
86+
}
87+
}
88+
}
89+
90+
.tab {
91+
text-align: center;
92+
margin: 0 25px;
93+
color: #555;
94+
font-family: Barlow, sans-serif;
95+
font-size: 16px;
96+
font-weight: 600;
97+
line-height: 20px;
98+
padding-bottom: 5px;
99+
cursor: pointer;
100+
margin-bottom: -5px;
101+
position: relative;
102+
103+
@include xs-to-sm {
104+
margin: 0;
105+
margin-bottom: 23px;
106+
padding: 0;
107+
padding-left: 5px;
108+
109+
&::after {
110+
display: none;
111+
}
112+
113+
&:hover,
114+
&.selected {
115+
border-left: 3px solid #43d7b0;
116+
margin-left: -3px;
117+
}
118+
}
119+
120+
&:hover,
121+
&.selected {
122+
color: #2a2a2a;
123+
124+
&::after {
125+
content: '';
126+
border-radius: 1000vw;
127+
background: #43d7b0;
128+
height: 3px;
129+
width: 15px;
130+
position: absolute;
131+
bottom: 0;
132+
left: calc(50% - 7px);
133+
border-left: 1px solid #fff;
134+
border-right: 1px solid #fff;
135+
136+
@include xs-to-sm {
137+
width: calc(100% - 36px);
138+
bottom: -5px;
139+
}
140+
}
141+
}
142+
143+
p {
144+
small {
145+
color: #888894;
146+
font-size: 13px;
147+
font-weight: 400;
148+
line-height: 25px;
149+
text-align: left;
150+
}
151+
152+
strong {
153+
font-weight: bold;
154+
}
155+
}
156+
}
157+
158+
.tabpannel {
159+
display: none;
160+
}
161+
162+
.selectedTabPanel {
163+
display: block;
164+
165+
@include xs-to-sm {
166+
padding: 0 15px;
167+
}
168+
}

0 commit comments

Comments
 (0)