Skip to content

Commit af084e7

Browse files
ReDBrotherReDBrother
committed
fixes
1 parent 2310fbc commit af084e7

File tree

5 files changed

+88
-28
lines changed

5 files changed

+88
-28
lines changed

‎services/app/apps/codebattle/assets/css/style.scss‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,14 @@ $gold: #daa520;
1414
@import 'gamePreview';
1515
@import '~react-contexify/dist/ReactContexify.css';
1616

17+
@font-face {
18+
font-family: 'External';
19+
src: url('https://yastatic.net/s3/lpc-ext/Young%20Con%202025/YangoHeadline-Black.ttf') format('truetype');
20+
font-weight: 900;
21+
font-style: normal;
22+
font-display: swap;
23+
}
24+
1725
$fa-font-path: '/fonts';
1826

1927
@import 'fonts';
@@ -2572,3 +2580,8 @@ a:hover {
25722580
border-left: 0px;
25732581
border-bottom: 0px;
25742582
}
2583+
2584+
.cb-stream-widget-text {
2585+
font-family: 'External';
2586+
font-weight: 700;
2587+
}

‎services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamEditorPanel.jsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { leftEditorSelector, rightEditorSelector } from '@/selectors';
77
import ExtendedEditor from '../../components/Editor';
88
import editorThemes from '../../config/editorThemes';
99

10-
function StreamEditorPanel({ orientation, roomMachineState }) {
10+
function StreamEditorPanel({ orientation, roomMachineState, fontSize }) {
1111
const editorSelector = orientation === 'left' ? leftEditorSelector : rightEditorSelector;
1212

1313
const editor = useSelector(editorSelector(roomMachineState));
@@ -18,6 +18,7 @@ function StreamEditorPanel({ orientation, roomMachineState }) {
1818
mute: true,
1919
loading: false,
2020
value: editor?.text,
21+
fontSize,
2122
lineNumbers: false,
2223
wordWrap: 'on',
2324
};

‎services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamFullPanel.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ function StreamFullPanel({ game, roomMachineState }) {
6363
<ExtendedEditor {...editorLeftParams} />
6464
</div>
6565
</div>
66-
<div className="col-4 cb-stream-full-video px-2">stream</div>
66+
<div className="col-4 w-100 px-2">stream</div>
6767
<div className="col-4 cb-stream-full-editor editor-right">
6868
<div className="d-flex flex-column flex-grow-1 position-relative cb-editor-height h-100">
6969
<ExtendedEditor {...editorRightParams} />

‎services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamTaskInfoPanel.jsx‎

Lines changed: 38 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,15 @@ import {
99

1010
import TaskDescriptionMarkdown from '../game/TaskDescriptionMarkdown';
1111

12-
function StreamTaskInfoPanel({ game, orientation, roomMachineState }) {
12+
function StreamTaskInfoPanel({
13+
game,
14+
orientation,
15+
roomMachineState,
16+
fontSize,
17+
codeFontSize,
18+
setFontSize,
19+
setCodeFontSize,
20+
}) {
1321
const outputSelector = orientation === 'left' ? leftExecutionOutputSelector : rightExecutionOutputSelector;
1422
const playerSelector = orientation === 'left' ? firstPlayerSelector : secondPlayerSelector;
1523

@@ -23,33 +31,45 @@ function StreamTaskInfoPanel({ game, orientation, roomMachineState }) {
2331
const result = assert?.result || assert?.value;
2432

2533
return (
26-
<div className="d-flex flex-column justify-content-between col-4">
34+
<div className="d-flex cb-stream-widget flex-column justify-content-between col-4">
2735
<div className="d-flex pt-4 justify-content-between">
28-
<div className="cb-stream-tasks-stats">
29-
<span>3/8 ЗАДАЧ</span>
36+
<div className="cb-stream-tasks-stats cb-stream-widget-text">
37+
<span style={{ fontSize }}>3/8 ЗАДАЧ</span>
3038
</div>
3139
{/* <div> */}
3240
{/* <span>3 / 8 Задача</span> */}
3341
{/* </div> */}
34-
<div className="d-flex align-items-center cb-stream-name">
35-
<span>{upperCase(player?.name || 'Башкевич Илья')}</span>
42+
<div className="d-flex flex-column align-items-center cb-stream-name cb-stream-widget-text">
43+
{(player?.name || 'Фамилия Имя').split(' ').map(str => (
44+
<span style={{ fontSize }}>{upperCase(str || 'Test')}</span>
45+
))}
3646
</div>
3747
</div>
38-
<div className="cb-stream-task-description h-100 py-5">
48+
<div className="cb-stream-task-description h-100 py-5" style={{ fontSize }}>
3949
<TaskDescriptionMarkdown description={game?.task?.descriptionRu} />
4050
</div>
41-
<div className="d-flex flex-column pb-4">
42-
<div className="d-flex cb-stream-output mt-2 mb-1">
43-
<div className="d-flex align-items-center cb-stream-output-title">Входные данные</div>
44-
<div className="cb-stream-output-data align-content-around">{args}</div>
51+
<div className="d-flex flex-column">
52+
<div className="d-flex flex-row bg-gray">
53+
Font Sise
54+
<button type="button" className="btn btn-sm" onClick={() => setFontSize(fontSize + 1)}>+</button>
55+
<button type="button" className="btn btn-sm" onClick={() => setFontSize(fontSize - 1)}>-</button>
56+
Code Font Size
57+
<button type="button" className="btn btn-sm" onClick={() => setCodeFontSize(codeFontSize + 1)}>+</button>
58+
<button type="button" className="btn btn-sm" onClick={() => setCodeFontSize(codeFontSize - 1)}>-</button>
4559
</div>
46-
<div className="d-flex cb-stream-output mb-1">
47-
<div className="d-flex align-items-center cb-stream-output-title">Ожидаемый результат</div>
48-
<div className="cb-stream-output-data align-content-around">{expected}</div>
49-
</div>
50-
<div className="d-flex cb-stream-output mt-1 mb-2">
51-
<div className="d-flex align-items-center cb-stream-output-title">Полученный результат</div>
52-
<div className="cb-stream-output-data align-content-around">{result}</div>
60+
<div className="d-flex flex-column pb-4 cb-stream-widget-text" style={{ fontSize }}>
61+
<div className="d-flex cb-stream-output mt-2 mb-1">
62+
<div className="d-flex align-items-center cb-stream-output-title">Входные данные</div>
63+
<div className="cb-stream-output-data align-content-around">{args}</div>
64+
</div>
65+
<div className="d-flex cb-stream-output mb-1">
66+
<div className="d-flex align-items-center cb-stream-output-title">Ожидаемый результат</div>
67+
<div className="cb-stream-output-data align-content-around">{expected}</div>
68+
</div>
69+
<div className="d-flex cb-stream-output mt-1 mb-2">
70+
<div className="d-flex align-items-center cb-stream-output-title">Полученный результат</div>
71+
<div className="cb-stream-output-data align-content-around">{result}</div>
72+
</div>
5373
</div>
5474
</div>
5575
</div>

‎services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamWidget.jsx‎

Lines changed: 34 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useEffect } from 'react';
1+
import React, { useEffect, useState } from 'react';
22

33
import { useDispatch, useSelector } from 'react-redux';
44

@@ -30,6 +30,9 @@ function StreamWidget({
3030
const searchParams = useSearchParams();
3131
const orientation = searchParams.has('orientation') ? searchParams.get('orientation') : orientations.NONE;
3232

33+
const [fontSize, setFontSize] = useState(16);
34+
const [codeFontSize, setCodeFontSize] = useState(16);
35+
3336
const { mainService, waitingRoomService } = useGameRoomMachine({
3437
mainMachine,
3538
taskMachine,
@@ -71,18 +74,41 @@ function StreamWidget({
7174
return (
7275
<div className="vh-100 p-2 cb-stream-widget">
7376
{orientations.NONE === orientation && (
74-
<StreamFullPanel game={game} roomMachineState={roomMachineState} />
77+
<StreamFullPanel
78+
game={game}
79+
roomMachineState={roomMachineState}
80+
fontSize={fontSize}
81+
codeFontSize={codeFontSize}
82+
setFontSize={setFontSize}
83+
setCodeFontSize={setCodeFontSize}
84+
/>
7585
)}
7686
{orientations.LEFT === orientation && (
77-
<div className="d-flex w-100 h-100">
78-
<StreamTaskInfoPanel game={game} orientation={orientation} roomMachineState={roomMachineState} />
79-
<StreamEditorPanel orientation={orientation} roomMachineState={roomMachineState} />
87+
<div className="d-flex w-100 h-100" styles={{ fontSize }}>
88+
<StreamTaskInfoPanel
89+
game={game}
90+
orientation={orientation}
91+
roomMachineState={roomMachineState}
92+
fontSize={fontSize}
93+
codeFontSize={codeFontSize}
94+
setFontSize={setFontSize}
95+
setCodeFontSize={setCodeFontSize}
96+
/>
97+
<StreamEditorPanel orientation={orientation} roomMachineState={roomMachineState} fontSize={codeFontSize} />
8098
</div>
8199
)}
82100
{orientations.RIGHT === orientation && (
83-
<div className="d-flex w-100 h-100">
84-
<StreamEditorPanel orientation={orientation} roomMachineState={roomMachineState} />
85-
<StreamTaskInfoPanel game={game} orientation={orientation} roomMachineState={roomMachineState} />
101+
<div className="d-flex w-100 h-100" styles={{ fontSize }}>
102+
<StreamEditorPanel orientation={orientation} roomMachineState={roomMachineState} fontSize={codeFontSize} />
103+
<StreamTaskInfoPanel
104+
game={game}
105+
orientation={orientation}
106+
roomMachineState={roomMachineState}
107+
fontSize={fontSize}
108+
codeFontSize={codeFontSize}
109+
setFontSize={setFontSize}
110+
setCodeFontSize={setCodeFontSize}
111+
/>
86112
</div>
87113
)}
88114
</div>

0 commit comments

Comments
 (0)