Skip to content

Commit 99b873e

Browse files
gabriellshtassoevan
gabriellsh
and
tassoevan
authored
fix(onboarding-ui): Labels wrapping under checkbox (#509)
* Fix label text breaks * Loki * Fix alignment of checkbox labels Co-authored-by: Tasso Evangelista <tasso.evangelista@rocket.chat>
1 parent 9c84138 commit 99b873e

8 files changed

+83
-68
lines changed

‎packages/onboarding-ui/.loki/reference/desktop_forms_RegisterServerForm_RegisterServerForm.png

81 Bytes
Loading

‎packages/onboarding-ui/.loki/reference/desktop_pages_RegisterServerPage_RegisterServerPage.png

134 Bytes
Loading

‎packages/onboarding-ui/.loki/reference/mobile_forms_RegisterServerForm_RegisterServerForm.png

-423 Bytes
Loading

‎packages/onboarding-ui/.loki/reference/mobile_pages_RegisterServerPage_RegisterServerPage.png

-255 Bytes
Loading

‎packages/onboarding-ui/.loki/reference/tablet_forms_RegisterServerForm_RegisterServerForm.png

77 Bytes
Loading

‎packages/onboarding-ui/.loki/reference/tablet_pages_RegisterServerPage_RegisterServerPage.png

-6 Bytes
Loading

‎packages/onboarding-ui/src/forms/RegisterServerForm/RegisterOptionCard.tsx

+17-2
Original file line numberDiff line numberDiff line change
@@ -62,13 +62,28 @@ const RegisterOptionCard = (): ReactElement => {
6262
</OptionCard.Block>
6363
<Divider />
6464
<OptionCard.Block>
65-
<Box mbe='x8' display='block' color='info' fontScale='c1'>
65+
<Box
66+
mbe='x8'
67+
display='flex'
68+
flexDirection='row'
69+
alignItems='flex-start'
70+
color='info'
71+
fontScale='c1'
72+
lineHeight={20}
73+
>
6674
<CheckBox mie='x8' disabled={!selected} {...register('updates')} />{' '}
6775
<label htmlFor='updates'>
6876
{t('form.serverRegistrationForm.register.includeUpdates')}
6977
</label>
7078
</Box>
71-
<Box color='default' fontScale='c1'>
79+
<Box
80+
display='flex'
81+
flexDirection='row'
82+
alignItems='flex-start'
83+
color='default'
84+
fontScale='c1'
85+
lineHeight={20}
86+
>
7287
<CheckBox
7388
mie='x8'
7489
disabled={!selected}

‎yarn.lock

+66-66
Original file line numberDiff line numberDiff line change
@@ -5274,14 +5274,14 @@ __metadata:
52745274
languageName: node
52755275
linkType: hard
52765276

5277-
"@rocket.chat/css-in-js@^0.27.0, @rocket.chat/css-in-js@workspace:packages/css-in-js":
5277+
"@rocket.chat/css-in-js@^0.28.0, @rocket.chat/css-in-js@workspace:packages/css-in-js":
52785278
version: 0.0.0-use.local
52795279
resolution: "@rocket.chat/css-in-js@workspace:packages/css-in-js"
52805280
dependencies:
52815281
"@emotion/hash": ^0.8.0
5282-
"@rocket.chat/eslint-config-alt": ^0.27.0
5283-
"@rocket.chat/memo": ^0.27.0
5284-
"@rocket.chat/prettier-config": ^0.27.0
5282+
"@rocket.chat/eslint-config-alt": ^0.28.0
5283+
"@rocket.chat/memo": ^0.28.0
5284+
"@rocket.chat/prettier-config": ^0.28.0
52855285
"@rollup/plugin-commonjs": ^19.0.0
52865286
"@rollup/plugin-json": ^4.1.0
52875287
"@rollup/plugin-node-resolve": ^13.0.0
@@ -5305,8 +5305,8 @@ __metadata:
53055305
version: 0.0.0-use.local
53065306
resolution: "@rocket.chat/emitter@workspace:packages/emitter"
53075307
dependencies:
5308-
"@rocket.chat/eslint-config-alt": ^0.27.0
5309-
"@rocket.chat/prettier-config": ^0.27.0
5308+
"@rocket.chat/eslint-config-alt": ^0.28.0
5309+
"@rocket.chat/prettier-config": ^0.28.0
53105310
"@rollup/plugin-commonjs": ^19.0.0
53115311
"@rollup/plugin-json": ^4.1.0
53125312
"@rollup/plugin-node-resolve": ^13.0.0
@@ -5326,7 +5326,7 @@ __metadata:
53265326
languageName: unknown
53275327
linkType: soft
53285328

5329-
"@rocket.chat/eslint-config-alt@^0.27.0, @rocket.chat/eslint-config-alt@workspace:packages/eslint-config-alt":
5329+
"@rocket.chat/eslint-config-alt@^0.28.0, @rocket.chat/eslint-config-alt@workspace:packages/eslint-config-alt":
53305330
version: 0.0.0-use.local
53315331
resolution: "@rocket.chat/eslint-config-alt@workspace:packages/eslint-config-alt"
53325332
dependencies:
@@ -5362,13 +5362,13 @@ __metadata:
53625362
languageName: node
53635363
linkType: hard
53645364

5365-
"@rocket.chat/fuselage-hooks@^0.27.0, @rocket.chat/fuselage-hooks@workspace:packages/fuselage-hooks":
5365+
"@rocket.chat/fuselage-hooks@^0.28.0, @rocket.chat/fuselage-hooks@workspace:packages/fuselage-hooks":
53665366
version: 0.0.0-use.local
53675367
resolution: "@rocket.chat/fuselage-hooks@workspace:packages/fuselage-hooks"
53685368
dependencies:
5369-
"@rocket.chat/eslint-config-alt": ^0.27.0
5370-
"@rocket.chat/fuselage-tokens": ^0.27.0
5371-
"@rocket.chat/prettier-config": ^0.27.0
5369+
"@rocket.chat/eslint-config-alt": ^0.28.0
5370+
"@rocket.chat/fuselage-tokens": ^0.28.0
5371+
"@rocket.chat/prettier-config": ^0.28.0
53725372
"@rollup/plugin-commonjs": ^19.0.0
53735373
"@rollup/plugin-json": ^4.1.0
53745374
"@rollup/plugin-node-resolve": ^13.0.0
@@ -5399,13 +5399,13 @@ __metadata:
53995399
languageName: unknown
54005400
linkType: soft
54015401

5402-
"@rocket.chat/fuselage-polyfills@^0.27.0, @rocket.chat/fuselage-polyfills@workspace:packages/fuselage-polyfills":
5402+
"@rocket.chat/fuselage-polyfills@^0.28.0, @rocket.chat/fuselage-polyfills@workspace:packages/fuselage-polyfills":
54035403
version: 0.0.0-use.local
54045404
resolution: "@rocket.chat/fuselage-polyfills@workspace:packages/fuselage-polyfills"
54055405
dependencies:
54065406
"@juggle/resize-observer": ^3.3.1
5407-
"@rocket.chat/eslint-config-alt": ^0.27.0
5408-
"@rocket.chat/prettier-config": ^0.27.0
5407+
"@rocket.chat/eslint-config-alt": ^0.28.0
5408+
"@rocket.chat/prettier-config": ^0.28.0
54095409
clipboard-polyfill: ^3.0.3
54105410
element-closest-polyfill: ^1.0.4
54115411
eslint: ^7.29.0
@@ -5417,12 +5417,12 @@ __metadata:
54175417
languageName: unknown
54185418
linkType: soft
54195419

5420-
"@rocket.chat/fuselage-tokens@^0.27.0, @rocket.chat/fuselage-tokens@workspace:packages/fuselage-tokens":
5420+
"@rocket.chat/fuselage-tokens@^0.28.0, @rocket.chat/fuselage-tokens@workspace:packages/fuselage-tokens":
54215421
version: 0.0.0-use.local
54225422
resolution: "@rocket.chat/fuselage-tokens@workspace:packages/fuselage-tokens"
54235423
dependencies:
5424-
"@rocket.chat/eslint-config-alt": ^0.27.0
5425-
"@rocket.chat/prettier-config": ^0.27.0
5424+
"@rocket.chat/eslint-config-alt": ^0.28.0
5425+
"@rocket.chat/prettier-config": ^0.28.0
54265426
eslint: ^7.29.0
54275427
eslint-config-prettier: ^8.3.0
54285428
eslint-plugin-import: ^2.23.4
@@ -5443,13 +5443,13 @@ __metadata:
54435443
"@babel/preset-env": ^7.14.7
54445444
"@babel/preset-react": ^7.14.5
54455445
"@rocket.chat/apps-engine": ^1.27.1
5446-
"@rocket.chat/eslint-config-alt": ^0.27.0
5447-
"@rocket.chat/fuselage": ^0.27.0
5448-
"@rocket.chat/fuselage-hooks": ^0.27.0
5449-
"@rocket.chat/fuselage-polyfills": ^0.27.0
5450-
"@rocket.chat/icons": ^0.27.0
5451-
"@rocket.chat/prettier-config": ^0.27.0
5452-
"@rocket.chat/ui-kit": ^0.27.0
5446+
"@rocket.chat/eslint-config-alt": ^0.28.0
5447+
"@rocket.chat/fuselage": ^0.28.0
5448+
"@rocket.chat/fuselage-hooks": ^0.28.0
5449+
"@rocket.chat/fuselage-polyfills": ^0.28.0
5450+
"@rocket.chat/icons": ^0.28.0
5451+
"@rocket.chat/prettier-config": ^0.28.0
5452+
"@rocket.chat/ui-kit": ^0.28.0
54535453
"@storybook/addon-essentials": ^6.3.4
54545454
"@storybook/addons": ^6.3.4
54555455
"@storybook/builder-webpack5": ^6.3.4
@@ -5482,7 +5482,7 @@ __metadata:
54825482
languageName: unknown
54835483
linkType: soft
54845484

5485-
"@rocket.chat/fuselage@^0.27.0, @rocket.chat/fuselage@workspace:packages/fuselage":
5485+
"@rocket.chat/fuselage@^0.28.0, @rocket.chat/fuselage@workspace:packages/fuselage":
54865486
version: 0.0.0-use.local
54875487
resolution: "@rocket.chat/fuselage@workspace:packages/fuselage"
54885488
dependencies:
@@ -5491,15 +5491,15 @@ __metadata:
54915491
"@babel/plugin-transform-runtime": ^7.14.5
54925492
"@babel/preset-env": ^7.14.7
54935493
"@babel/preset-react": ^7.14.5
5494-
"@rocket.chat/css-in-js": ^0.27.0
5494+
"@rocket.chat/css-in-js": ^0.28.0
54955495
"@rocket.chat/eslint-config": ^0.4.0
5496-
"@rocket.chat/eslint-config-alt": ^0.27.0
5497-
"@rocket.chat/fuselage-hooks": ^0.27.0
5498-
"@rocket.chat/fuselage-polyfills": ^0.27.0
5499-
"@rocket.chat/fuselage-tokens": ^0.27.0
5500-
"@rocket.chat/icons": ^0.27.0
5501-
"@rocket.chat/memo": ^0.27.0
5502-
"@rocket.chat/prettier-config": ^0.27.0
5496+
"@rocket.chat/eslint-config-alt": ^0.28.0
5497+
"@rocket.chat/fuselage-hooks": ^0.28.0
5498+
"@rocket.chat/fuselage-polyfills": ^0.28.0
5499+
"@rocket.chat/fuselage-tokens": ^0.28.0
5500+
"@rocket.chat/icons": ^0.28.0
5501+
"@rocket.chat/memo": ^0.28.0
5502+
"@rocket.chat/prettier-config": ^0.28.0
55035503
"@storybook/addon-essentials": ^6.3.4
55045504
"@storybook/addon-jest": ^6.3.4
55055505
"@storybook/addon-links": ^6.3.4
@@ -5565,12 +5565,12 @@ __metadata:
55655565
languageName: unknown
55665566
linkType: soft
55675567

5568-
"@rocket.chat/icons@^0.27.0, @rocket.chat/icons@workspace:packages/icons":
5568+
"@rocket.chat/icons@^0.28.0, @rocket.chat/icons@workspace:packages/icons":
55695569
version: 0.0.0-use.local
55705570
resolution: "@rocket.chat/icons@workspace:packages/icons"
55715571
dependencies:
5572-
"@rocket.chat/eslint-config-alt": ^0.27.0
5573-
"@rocket.chat/prettier-config": ^0.27.0
5572+
"@rocket.chat/eslint-config-alt": ^0.28.0
5573+
"@rocket.chat/prettier-config": ^0.28.0
55745574
eslint: ^7.29.0
55755575
glob: ^7.1.7
55765576
lint-staged: ^11.0.0
@@ -5587,12 +5587,12 @@ __metadata:
55875587
languageName: unknown
55885588
linkType: soft
55895589

5590-
"@rocket.chat/memo@^0.27.0, @rocket.chat/memo@workspace:packages/memo":
5590+
"@rocket.chat/memo@^0.28.0, @rocket.chat/memo@workspace:packages/memo":
55915591
version: 0.0.0-use.local
55925592
resolution: "@rocket.chat/memo@workspace:packages/memo"
55935593
dependencies:
5594-
"@rocket.chat/eslint-config-alt": ^0.27.0
5595-
"@rocket.chat/prettier-config": ^0.27.0
5594+
"@rocket.chat/eslint-config-alt": ^0.28.0
5595+
"@rocket.chat/prettier-config": ^0.28.0
55965596
downlevel-dts: ^0.7.0
55975597
eslint: ^7.29.0
55985598
lint-staged: ^11.0.0
@@ -5612,9 +5612,9 @@ __metadata:
56125612
"@babel/core": ^7.14.6
56135613
"@babel/eslint-parser": ^7.14.7
56145614
"@babel/preset-env": ^7.14.7
5615-
"@rocket.chat/eslint-config-alt": ^0.27.0
5616-
"@rocket.chat/peggy-loader": ^0.27.0
5617-
"@rocket.chat/prettier-config": ^0.27.0
5615+
"@rocket.chat/eslint-config-alt": ^0.28.0
5616+
"@rocket.chat/peggy-loader": ^0.28.0
5617+
"@rocket.chat/prettier-config": ^0.28.0
56185618
"@types/jest": ^26.0.24
56195619
"@types/node": ^15.14.1
56205620
"@typescript-eslint/parser": ^4.28.2
@@ -5644,8 +5644,8 @@ __metadata:
56445644
"@babel/plugin-transform-runtime": ^7.14.5
56455645
"@babel/preset-env": ^7.14.7
56465646
"@babel/preset-typescript": ^7.14.5
5647-
"@rocket.chat/eslint-config-alt": ^0.27.0
5648-
"@rocket.chat/prettier-config": ^0.27.0
5647+
"@rocket.chat/eslint-config-alt": ^0.28.0
5648+
"@rocket.chat/prettier-config": ^0.28.0
56495649
"@rollup/plugin-commonjs": ^19.0.0
56505650
"@rollup/plugin-node-resolve": ^13.0.0
56515651
"@rollup/plugin-typescript": ^8.2.1
@@ -5665,14 +5665,14 @@ __metadata:
56655665
version: 0.0.0-use.local
56665666
resolution: "@rocket.chat/onboarding-ui@workspace:packages/onboarding-ui"
56675667
dependencies:
5668-
"@rocket.chat/eslint-config-alt": ^0.27.0
5669-
"@rocket.chat/fuselage": ^0.27.0
5670-
"@rocket.chat/fuselage-hooks": ^0.27.0
5671-
"@rocket.chat/fuselage-polyfills": ^0.27.0
5672-
"@rocket.chat/fuselage-tokens": ^0.27.0
5673-
"@rocket.chat/icons": ^0.27.0
5674-
"@rocket.chat/prettier-config": ^0.27.0
5675-
"@rocket.chat/styled": ^0.27.0
5668+
"@rocket.chat/eslint-config-alt": ^0.28.0
5669+
"@rocket.chat/fuselage": ^0.28.0
5670+
"@rocket.chat/fuselage-hooks": ^0.28.0
5671+
"@rocket.chat/fuselage-polyfills": ^0.28.0
5672+
"@rocket.chat/fuselage-tokens": ^0.28.0
5673+
"@rocket.chat/icons": ^0.28.0
5674+
"@rocket.chat/prettier-config": ^0.28.0
5675+
"@rocket.chat/styled": ^0.28.0
56765676
"@storybook/addon-essentials": ^6.3.4
56775677
"@storybook/addons": ^6.3.4
56785678
"@storybook/react": ^6.3.4
@@ -5706,12 +5706,12 @@ __metadata:
57065706
languageName: unknown
57075707
linkType: soft
57085708

5709-
"@rocket.chat/peggy-loader@^0.27.0, @rocket.chat/peggy-loader@workspace:packages/peggy-loader":
5709+
"@rocket.chat/peggy-loader@^0.28.0, @rocket.chat/peggy-loader@workspace:packages/peggy-loader":
57105710
version: 0.0.0-use.local
57115711
resolution: "@rocket.chat/peggy-loader@workspace:packages/peggy-loader"
57125712
dependencies:
5713-
"@rocket.chat/eslint-config-alt": ^0.27.0
5714-
"@rocket.chat/prettier-config": ^0.27.0
5713+
"@rocket.chat/eslint-config-alt": ^0.28.0
5714+
"@rocket.chat/prettier-config": ^0.28.0
57155715
"@types/loader-utils": ^2.0.3
57165716
"@types/node": ^15.14.1
57175717
downlevel-dts: ^0.7.0
@@ -5732,7 +5732,7 @@ __metadata:
57325732
languageName: unknown
57335733
linkType: soft
57345734

5735-
"@rocket.chat/prettier-config@^0.27.0, @rocket.chat/prettier-config@workspace:packages/prettier-config":
5735+
"@rocket.chat/prettier-config@^0.28.0, @rocket.chat/prettier-config@workspace:packages/prettier-config":
57365736
version: 0.0.0-use.local
57375737
resolution: "@rocket.chat/prettier-config@workspace:packages/prettier-config"
57385738
dependencies:
@@ -5752,8 +5752,8 @@ __metadata:
57525752
version: 0.0.0-use.local
57535753
resolution: "@rocket.chat/string-helpers@workspace:packages/string-helpers"
57545754
dependencies:
5755-
"@rocket.chat/eslint-config-alt": ^0.27.0
5756-
"@rocket.chat/prettier-config": ^0.27.0
5755+
"@rocket.chat/eslint-config-alt": ^0.28.0
5756+
"@rocket.chat/prettier-config": ^0.28.0
57575757
"@types/jest": ^26.0.24
57585758
downlevel-dts: ^0.7.0
57595759
eslint: ^7.29.0
@@ -5769,12 +5769,12 @@ __metadata:
57695769
languageName: unknown
57705770
linkType: soft
57715771

5772-
"@rocket.chat/styled@^0.27.0, @rocket.chat/styled@workspace:packages/styled":
5772+
"@rocket.chat/styled@^0.28.0, @rocket.chat/styled@workspace:packages/styled":
57735773
version: 0.0.0-use.local
57745774
resolution: "@rocket.chat/styled@workspace:packages/styled"
57755775
dependencies:
5776-
"@rocket.chat/eslint-config-alt": ^0.27.0
5777-
"@rocket.chat/prettier-config": ^0.27.0
5776+
"@rocket.chat/eslint-config-alt": ^0.28.0
5777+
"@rocket.chat/prettier-config": ^0.28.0
57785778
"@types/jest": ^26.0.24
57795779
downlevel-dts: ^0.7.0
57805780
eslint: ^7.29.0
@@ -5790,16 +5790,16 @@ __metadata:
57905790
languageName: unknown
57915791
linkType: soft
57925792

5793-
"@rocket.chat/ui-kit@^0.27.0, @rocket.chat/ui-kit@workspace:packages/ui-kit":
5793+
"@rocket.chat/ui-kit@^0.28.0, @rocket.chat/ui-kit@workspace:packages/ui-kit":
57945794
version: 0.0.0-use.local
57955795
resolution: "@rocket.chat/ui-kit@workspace:packages/ui-kit"
57965796
dependencies:
57975797
"@babel/core": ^7.14.6
57985798
"@babel/eslint-parser": ^7.14.7
57995799
"@babel/plugin-transform-runtime": ^7.14.5
58005800
"@babel/preset-env": ^7.14.7
5801-
"@rocket.chat/eslint-config-alt": ^0.27.0
5802-
"@rocket.chat/prettier-config": ^0.27.0
5801+
"@rocket.chat/eslint-config-alt": ^0.28.0
5802+
"@rocket.chat/prettier-config": ^0.28.0
58035803
"@types/jest": ^26.0.24
58045804
babel-loader: ^8.2.2
58055805
downlevel-dts: ^0.7.0
@@ -23247,8 +23247,8 @@ resolve@^2.0.0-next.3:
2324723247
version: 0.0.0-use.local
2324823248
resolution: "scripts@workspace:scripts"
2324923249
dependencies:
23250-
"@rocket.chat/eslint-config-alt": ^0.27.0
23251-
"@rocket.chat/prettier-config": ^0.27.0
23250+
"@rocket.chat/eslint-config-alt": ^0.28.0
23251+
"@rocket.chat/prettier-config": ^0.28.0
2325223252
"@types/node": ^15.14.1
2325323253
"@typescript-eslint/parser": ^4.28.2
2325423254
endent: ^2.1.0

0 commit comments

Comments
 (0)