Skip to content

Commit 38b2fb2

Browse files
TigerInYourDreamTigerInYourDream
authored
ui: replace remaining magic numbers with SPACE_* constants in settings (#76)
* ui: replace remaining magic numbers with SPACE_* constants in settings Convert hardcoded padding/margin/spacing values to design system constants in account_settings.rs and settings_screen.rs: - 10 → SPACE_SM, 12 → SPACE_MD, 15 → SPACE_LG - 5 → SPACE_XS, 4 → SPACE_XS, 6 → SPACE_SM Closes #71 * ui: fix vertical alignment in Labs tab cards Remove inner left margins from BotSettings and TranslationSettings components — the parent card container's padding already provides consistent left alignment. Double indentation (card padding + inner margin) caused misaligned content within each card. * ui: align toggle pill with title text in Labs cards Add left padding (6px) to toggle_row to align the Toggle pill with the title/description text. Reduce toggle-to-label spacing from SPACE_SM to SPACE_XS for tighter visual grouping.
1 parent dd190fb commit 38b2fb2

4 files changed

Lines changed: 26 additions & 24 deletions

File tree

‎src/settings/account_settings.rs‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ script_mod! {
5151
our_own_avatar := Avatar {
5252
width: 100,
5353
height: 100,
54-
margin: 10,
54+
margin: (SPACE_SM),
5555
text_view +: {
5656
text +: {
5757
draw_text +: {
@@ -77,7 +77,7 @@ script_mod! {
7777
upload_avatar_button := RobrixIconButton {
7878
width: 140,
7979
height: mod.widgets.SETTINGS_BUTTON_HEIGHT,
80-
padding: Inset{top: 10, bottom: 10, left: 12, right: 15}
80+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_MD), right: (SPACE_LG)}
8181
margin: 0,
8282
draw_bg +: { border_radius: (RADIUS_MD) }
8383
draw_icon.svg: (ICON_UPLOAD)
@@ -101,7 +101,7 @@ script_mod! {
101101
delete_avatar_button := RobrixNegativeIconButton {
102102
width: 140,
103103
height: mod.widgets.SETTINGS_BUTTON_HEIGHT,
104-
padding: Inset{top: 10, bottom: 10, left: 12, right: 15}
104+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_MD), right: (SPACE_LG)}
105105
margin: 0,
106106
draw_bg +: { border_radius: (RADIUS_MD) }
107107
draw_icon.svg: (ICON_TRASH)
@@ -155,7 +155,7 @@ script_mod! {
155155
cancel_display_name_button := RobrixNeutralIconButton {
156156
enabled: false,
157157
width: Fit, height: Fit,
158-
padding: 10,
158+
padding: (SPACE_SM),
159159
margin: Inset{left: (SPACE_XS)},
160160
draw_icon.svg: (ICON_FORBIDDEN)
161161
icon_walk: Walk{width: 16, height: 16, margin: 0}
@@ -165,7 +165,7 @@ script_mod! {
165165
accept_display_name_button := RobrixPositiveIconButton {
166166
enabled: false,
167167
width: Fit, height: Fit,
168-
padding: 10,
168+
padding: (SPACE_SM),
169169
margin: Inset{left: (SPACE_XS)},
170170
draw_bg.border_radius: (RADIUS_MD)
171171
draw_icon.svg: (ICON_CHECKMARK)
@@ -175,7 +175,7 @@ script_mod! {
175175

176176
save_name_spinner := LoadingSpinner {
177177
width: 16, height: 16
178-
margin: Inset{left: 5, top: 13} // vertically center with buttons
178+
margin: Inset{left: (SPACE_XS), top: 13} // vertically center with buttons
179179
visible: false
180180
draw_bg.color: (COLOR_ACTIVE_PRIMARY)
181181
}
@@ -277,7 +277,7 @@ script_mod! {
277277
// Other accounts section (populated dynamically)
278278
other_accounts_label := Label {
279279
width: Fill, height: Fit
280-
margin: Inset{top: (SPACE_XS), left: 2}
280+
margin: Inset{top: (SPACE_XS), left: (SPACE_XS)}
281281
visible: false
282282
draw_text +: {
283283
color: (MESSAGE_TEXT_COLOR),
@@ -319,7 +319,7 @@ script_mod! {
319319

320320
switch_account_button := RobrixIconButton {
321321
width: Fit, height: Fit
322-
padding: Inset{top: 6, bottom: 6, left: 10, right: 10}
322+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_SM), right: (SPACE_SM)}
323323
draw_icon.svg: (ICON_JUMP)
324324
icon_walk: Walk{width: 14, height: 14}
325325
text: "Switch"
@@ -338,7 +338,7 @@ script_mod! {
338338

339339
add_account_button := RobrixIconButton {
340340
width: Fit,
341-
padding: Inset{top: 10, bottom: 10, left: (SPACE_MD), right: 15}
341+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_MD), right: (SPACE_LG)}
342342
margin: Inset{top: (SPACE_XS)}
343343
draw_bg +: { border_radius: (RADIUS_MD) }
344344
draw_icon.svg: (ICON_ADD)
@@ -361,7 +361,7 @@ script_mod! {
361361
margin: Inset{bottom: (SPACE_LG)}
362362

363363
manage_account_button := RobrixIconButton {
364-
padding: Inset{top: 10, bottom: 10, left: (SPACE_MD), right: 15}
364+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_MD), right: (SPACE_LG)}
365365
margin: Inset{left: (SPACE_XS)}
366366
draw_bg +: { border_radius: (RADIUS_MD) }
367367
draw_icon.svg: (ICON_EXTERNAL_LINK)
@@ -370,7 +370,7 @@ script_mod! {
370370
}
371371

372372
logout_button := RobrixNegativeIconButton {
373-
padding: Inset{top: 10, bottom: 10, left: (SPACE_MD), right: 15}
373+
padding: Inset{top: (SPACE_SM), bottom: (SPACE_SM), left: (SPACE_MD), right: (SPACE_LG)}
374374
margin: Inset{left: (SPACE_XS)}
375375
draw_bg +: { border_radius: (RADIUS_MD) }
376376
draw_icon.svg: (ICON_LOGOUT)

‎src/settings/bot_settings.rs‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ script_mod! {
1414
mod.widgets.BotSettingsInfoLabel = Label {
1515
width: Fill
1616
height: Fit
17-
margin: Inset{left: (SPACE_XS), top: 2, bottom: 2}
17+
margin: Inset{top: 2, bottom: 2}
1818
draw_text +: {
1919
color: (MESSAGE_TEXT_COLOR)
2020
text_style: REGULAR_TEXT { font_size: 10.5 }
@@ -33,7 +33,7 @@ script_mod! {
3333
height: Fit
3434
flow: Down
3535
spacing: (SPACE_XS)
36-
margin: Inset{left: (SPACE_XS), right: (SPACE_SM), bottom: 2}
36+
margin: Inset{bottom: 2}
3737

3838
app_service_title := TitleLabel {
3939
width: Fit
@@ -56,8 +56,9 @@ script_mod! {
5656
height: Fit
5757
flow: Right
5858
align: Align{x: 0.0, y: 0.5}
59-
spacing: (SPACE_SM)
60-
margin: Inset{left: (SPACE_XS), bottom: 2}
59+
spacing: (SPACE_XS)
60+
padding: Inset{left: 6}
61+
margin: Inset{bottom: 2}
6162

6263
app_service_switch := Toggle {
6364
width: Fit

‎src/settings/settings_screen.rs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ script_mod! {
133133
width: 200, height: Fit
134134
flow: Right
135135
align: Align{y: 0.5}
136-
padding: Inset{left: (SPACE_MD), right: 10, top: 10, bottom: 10}
136+
padding: Inset{left: (SPACE_MD), right: (SPACE_SM), top: (SPACE_SM), bottom: (SPACE_SM)}
137137
margin: Inset{left: (SPACE_XS), top: 2, bottom: 2}
138138
cursor: MouseCursor.Hand
139139
show_bg: true
@@ -165,7 +165,7 @@ script_mod! {
165165
visible: false
166166
width: 200, height: Fit
167167
flow: Down
168-
padding: Inset{top: 4, bottom: 4}
168+
padding: Inset{top: (SPACE_XS), bottom: (SPACE_XS)}
169169
show_bg: true
170170
new_batch: true
171171
draw_bg +: {
@@ -179,7 +179,7 @@ script_mod! {
179179
width: Fill, height: 36
180180
flow: Right
181181
align: Align{y: 0.5}
182-
padding: Inset{left: 12, right: 12}
182+
padding: Inset{left: (SPACE_MD), right: (SPACE_MD)}
183183
cursor: MouseCursor.Hand
184184
show_bg: true
185185
draw_bg +: { color: #0000 }
@@ -196,7 +196,7 @@ script_mod! {
196196
width: Fill, height: 36
197197
flow: Right
198198
align: Align{y: 0.5}
199-
padding: Inset{left: 12, right: 12}
199+
padding: Inset{left: (SPACE_MD), right: (SPACE_MD)}
200200
cursor: MouseCursor.Hand
201201
show_bg: true
202202
draw_bg +: { color: #0000 }
@@ -214,7 +214,7 @@ script_mod! {
214214
preferences_language_hint_label := Label {
215215
width: Fill
216216
height: Fit
217-
margin: Inset{left: (SPACE_XS), right: (SPACE_SM), top: 3, bottom: (SPACE_XS)}
217+
margin: Inset{left: (SPACE_XS), right: (SPACE_SM), top: (SPACE_XS), bottom: (SPACE_XS)}
218218
draw_text +: {
219219
color: (MESSAGE_TEXT_COLOR)
220220
text_style: REGULAR_TEXT { font_size: 10.5 }

‎src/settings/translation_settings.rs‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ script_mod! {
2525
height: Fit
2626
flow: Down
2727
spacing: (SPACE_XS)
28-
margin: Inset{left: (SPACE_XS), right: (SPACE_SM), bottom: 2}
28+
margin: Inset{bottom: 2}
2929

3030
translation_title := TitleLabel {
3131
width: Fit
@@ -49,8 +49,9 @@ script_mod! {
4949
height: Fit
5050
flow: Right
5151
align: Align{x: 0.0, y: 0.5}
52-
spacing: (SPACE_SM)
53-
margin: Inset{left: (SPACE_XS), bottom: 2}
52+
spacing: (SPACE_XS)
53+
padding: Inset{left: 6}
54+
margin: Inset{bottom: 2}
5455

5556
translation_switch := Toggle {
5657
width: Fit
@@ -83,7 +84,7 @@ script_mod! {
8384
height: Fit
8485
flow: Down
8586
spacing: (SPACE_SM)
86-
margin: Inset{left: (SPACE_XS), right: (SPACE_SM)}
87+
margin: 0
8788

8889
View {
8990
width: Fill, height: Fit

0 commit comments

Comments
 (0)