Skip to content

Commit a0651da

Browse files
authored
MDCMigration: set padding in regex modal (#6630)
## Motivation for features / changes Fixing regex since it looked pretty bad after MDC Migration. While doing this I also standardized the padding across the entire page to 16px. ## Screenshots of UI changes (or N/A) Before: <img width="774" alt="Screenshot 2023-10-10 at 11 46 33 AM" src="https://github.com/tensorflow/tensorboard/assets/8672809/dcb14b93-2afd-4f45-b269-a8b3d6c6d9b8"> After: ![Screenshot 2023-10-10 at 12 18 58 PM](https://github.com/tensorflow/tensorboard/assets/8672809/35cb2918-f5f7-4f97-8931-d4faf4b74798)
1 parent 2d69040 commit a0651da

File tree

1 file changed

+9
-6
lines changed

1 file changed

+9
-6
lines changed

tensorboard/webapp/runs/views/runs_table/regex_edit_dialog_component.scss

+9-6
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ limitations under the License.
1414
==============================================================================*/
1515
@import 'tensorboard/webapp/theme/tb_theme';
1616

17+
$padding-size: 16px;
18+
1719
.example-details {
1820
button {
1921
background-color: transparent;
@@ -26,13 +28,14 @@ limitations under the License.
2628
@include tb-theme-foreground-prop(color, link-visited);
2729
}
2830
}
31+
padding: $padding-size;
2932
}
3033

3134
.group-container {
32-
margin: 10px 0;
35+
margin: $padding-size;
3336

3437
h4 {
35-
margin-bottom: 10px;
38+
margin-bottom: $padding-size;
3639
}
3740

3841
.warning {
@@ -45,7 +48,7 @@ limitations under the License.
4548
@include tb-theme-foreground-prop(border, border, 1px solid);
4649
max-height: 50vh;
4750
overflow-y: auto;
48-
padding: 20px;
51+
padding: $padding-size;
4952
}
5053

5154
.match-container {
@@ -78,15 +81,15 @@ mat-form-field {
7881
@include tb-theme-foreground-prop(border, border, 1px solid);
7982
border-radius: 3px;
8083
margin: 0;
81-
padding: 10px;
84+
padding: $padding-size;
8285

8386
label {
8487
@include tb-theme-foreground-prop(border-bottom, border, 1px solid);
8588
align-items: center;
8689
display: grid;
8790
gap: 10px;
8891
grid-template-columns: max-content auto;
89-
padding: 5px 0;
92+
padding: $padding-size 0;
9093

9194
.group-id {
9295
font-size: 0.95em;
@@ -109,6 +112,6 @@ mat-form-field {
109112
.more,
110113
.no-match {
111114
@include tb-theme-foreground-prop(color, secondary-text);
112-
margin-top: 5px;
115+
margin-top: $padding-size;
113116
}
114117
}

0 commit comments

Comments
 (0)