Skip to content
This repository was archived by the owner on Jul 30, 2025. It is now read-only.

Commit e17fc15

Browse files
starpitstarpit
committed
fix(plugins/plugin-client-common): font size issues with LeftNavSidecar
Fixes #5048
1 parent 75606c5 commit e17fc15

File tree

10 files changed

+51
-53
lines changed

10 files changed

+51
-53
lines changed

‎plugins/plugin-client-common/src/components/Content/Table/Grid.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export default class Grid<P extends Props> extends React.PureComponent<P> {
4747

4848
const nCells = visibleRows.length
4949
const nColumns = Math.ceil(Math.sqrt(nCells))
50-
const style = { gridTemplateColumns: `repeat(${nColumns}, 1.5rem)` }
50+
const style = { gridTemplateColumns: `repeat(${nColumns}, 1.25rem)` }
5151

5252
return (
5353
<div className="bx--data-table kui--data-table-as-grid" style={style}>

‎plugins/plugin-client-common/web/css/static/TopTabStripe.scss

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@
3030
.bx--header__name {
3131
position: relative;
3232
border: none;
33-
font-size: 1rem;
3433
}
3534

3635
.bx--header__name,
@@ -122,7 +121,6 @@
122121
.bx--header__menu-item {
123122
color: var(--color-text-02);
124123
padding: 0;
125-
font-size: 1rem;
126124
flex: 1;
127125

128126
&:hover {

‎plugins/plugin-client-common/web/css/static/master-font-size.scss

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,13 @@ html.kui {
55
font-size: var(--kui--master-font-size);
66
}
77

8-
&,
98
&.kui--14px {
109
--kui--master-font-size: 14px;
1110
--kui--master-font-scale: 1;
1211
font-size: var(--kui--master-font-size);
1312
}
1413

14+
&,
1515
&.kui--16px {
1616
--kui--master-font-size: 16px;
1717
--kui--master-font-scale: calc(16 / 14);
@@ -23,4 +23,8 @@ html.kui {
2323
--kui--master-font-scale: calc(18 / 14);
2424
font-size: var(--kui--master-font-size);
2525
}
26+
27+
body {
28+
font-size: 0.875rem;
29+
}
2630
}

‎plugins/plugin-client-common/web/css/static/repl.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@
6464
.kui--repl-block-spinner {
6565
color: var(--color-brand-03);
6666
margin-right: 0.5rem;
67-
font-size: 1rem;
67+
font-size: 0.875rem;
6868
font-weight: 700;
6969
}
7070
.kui--repl-block-error-icon {
@@ -82,7 +82,7 @@
8282
.repl-result-like,
8383
.repl-input .repl-input-element,
8484
.repl-input-like {
85-
font-size: 1rem;
85+
font-size: 0.875rem;
8686
}
8787
.repl-block:not(.processing) .repl-result-like:last-child {
8888
margin-bottom: 0.375rem;

‎plugins/plugin-client-common/web/css/static/sidecar-carbon.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@
4343
a.bx--tabs__nav-link:active {
4444
outline: none;
4545
width: unset;
46-
min-width: 8rem;
46+
min-width: 7rem;
4747
}
4848

4949
.bx--tabs {
@@ -96,7 +96,7 @@ body[kui-theme-style] a.bx--tabs__nav-link {
9696
[kui-theme-style] .kui--sidecar {
9797
a.bx--tabs__nav-link,
9898
a.bx--tabs__nav-link:active {
99-
min-width: 6em;
99+
min-width: 5em;
100100
}
101101
}
102102
}
@@ -105,7 +105,7 @@ body[kui-theme-style] a.bx--tabs__nav-link {
105105
[kui-theme-style] .kui--sidecar {
106106
a.bx--tabs__nav-link,
107107
a.bx--tabs__nav-link:active {
108-
min-width: 7em;
108+
min-width: 6em;
109109
}
110110
}
111111
}

‎plugins/plugin-client-common/web/css/static/sidecar.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,10 @@
4848
}
4949

5050
/* tables in sidecar */
51+
.kui--data-table-wrapper {
52+
margin: 0;
53+
background-color: inherit;
54+
}
5155
.result-table-outer,
5256
.kui--data-table-wrapper,
5357
.bx--data-table {

‎plugins/plugin-client-common/web/css/static/status-stripe.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
$font-size: 0.875rem;
1+
$font-size: 0.75rem;
22

33
.kui--status-stripe {
44
display: flex;

‎plugins/plugin-client-common/web/css/static/ui.css

Lines changed: 34 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -56,9 +56,8 @@ body[kui-theme-style] .page > .header {
5656
flex-basis: 0;
5757
display: flex;
5858
align-items: center;
59-
padding: 0 1.1875em;
59+
padding: 0 1.1875rem;
6060
font-weight: 300;
61-
font-size: 1rem;
6261
}
6362
.header .deemphasize {
6463
font-size: 55%;
@@ -359,32 +358,32 @@ code.fancy-code.hljs {
359358
color: var(--color-text-01);
360359
font-weight: 400;
361360
opacity: 1;
362-
font-size: 1em;
361+
font-size: 0.875rem;
363362
}
364363
.normal-text svg path {
365364
fill: var(--color-text-01);
366365
}
367366
.even-larger-text {
368-
font-size: 2em;
369-
line-height: 1em;
367+
font-size: 2rem;
368+
line-height: 1rem;
370369
}
371370
.larger-text {
372-
font-size: 1.5em;
371+
font-size: 1.5rem;
373372
}
374373
.somewhat-larger-text {
375-
font-size: 1.125em;
374+
font-size: 1.125rem;
376375
}
377376
.even-smaller-text {
378-
font-size: 0.75em;
377+
font-size: 0.75rem;
379378
}
380379
.smaller-text {
381-
font-size: 0.875em;
380+
font-size: 0.875rem;
382381
}
383382
.semi-transparent {
384383
opacity: 0.7;
385384
}
386385
.somewhat-smaller-text {
387-
font-size: 0.925em;
386+
font-size: 0.925rem;
388387
}
389388
[kui-theme-style] .sub-text {
390389
color: var(--color-text-02);
@@ -404,7 +403,7 @@ code.fancy-code.hljs {
404403
}
405404
.deemphasize {
406405
color: var(--color-text-02);
407-
font-size: 0.75em;
406+
font-size: 0.75rem;
408407
opacity: 0.7;
409408
vertical-align: middle;
410409
}
@@ -767,7 +766,7 @@ body.oops-total-catastrophe #restart-needed-warning {
767766
flex: 1;
768767
}
769768
.page-content hr {
770-
margin: 2em 0;
769+
margin: 2rem 0;
771770
border: 0.5px solid var(--color-content-divider);
772771
}
773772
.page-content img {
@@ -776,18 +775,18 @@ body.oops-total-catastrophe #restart-needed-warning {
776775
.page-content blockquote {
777776
background-color: var(--color-table-border3);
778777
border-left: 3px solid var(--color-table-border1);
779-
padding: 0.375em 0.5em;
778+
padding: 0.375rem 0.5rem;
780779
text-align: justify;
781-
margin-bottom: 0.5em;
782-
font-size: 0.925em;
780+
margin-bottom: 0.5rem;
781+
font-size: 0.925rem;
783782
}
784783
.page-content img[align="right"] {
785784
padding-left: 20px;
786785
}
787786
.page-content p {
788-
font-size: 1em;
787+
font-size: 0.875rem;
789788
font-weight: 400;
790-
line-height: 1.25em;
789+
line-height: 1.25rem;
791790
}
792791
.page-content code {
793792
font-family: var(--font-monospace);
@@ -798,21 +797,21 @@ body.oops-total-catastrophe #restart-needed-warning {
798797
opacity: 0.875;
799798
word-break: break-all;
800799
}
801-
$kui--page-content-h4-padding: 0.5em;
802-
$kui--page-content-paragraph-padding: 0.375em;
800+
$kui--page-content-h4-padding: 0.5rem;
801+
$kui--page-content-paragraph-padding: 0.375rem;
803802
.page-content p {
804803
padding: $kui--page-content-paragraph-padding 0;
805804
}
806805
.page-content h1 {
807806
margin-bottom: 1rem;
808-
font-size: 2.375em;
807+
font-size: 2.375rem;
809808
letter-spacing: 0;
810809
line-height: 1.25;
811810
padding: 0;
812811
}
813812
.page-content h2,
814813
.page-h2 {
815-
font-size: 1.75em;
814+
font-size: 1.75rem;
816815
font-weight: 300;
817816
margin: 1em 0;
818817
position: relative;
@@ -838,11 +837,11 @@ $kui--page-content-paragraph-padding: 0.375em;
838837
.page-content h3,
839838
.page-h3 {
840839
color: var(--color-text-01);
841-
font-size: 1.25em;
840+
font-size: 1rem;
842841
font-weight: 600;
843842
letter-spacing: 0;
844-
padding: 1em 0 0.5em;
845-
line-height: 1.625em;
843+
padding: 1em 0 0.5rem;
844+
line-height: 1.625rem;
846845
}
847846
.page-content h4 {
848847
color: var(--color-brand-01);
@@ -852,31 +851,30 @@ $kui--page-content-paragraph-padding: 0.375em;
852851
line-height: unset;
853852

854853
&:not([data-is-href]) + p {
855-
padding-top: calc(0.5em + #{$kui--page-content-paragraph-padding});
854+
padding-top: calc(0.5rem + #{$kui--page-content-paragraph-padding});
856855
}
857856
}
858857
.page-content h5 {
859-
font-size: 1.125em;
860-
line-height: 2em;
858+
font-size: 1.125rem;
859+
line-height: 2rem;
861860
}
862861
.page-content ol,
863862
.page-content ul {
864-
font-size: 1em;
865-
margin-left: 2em;
866-
line-height: 1.125em;
863+
margin-left: 2rem;
864+
line-height: 1.125rem;
867865
letter-spacing: 0.16px;
868866
}
869867
.page-content li {
870868
font-weight: 400;
871869
list-style-type: none;
872870
position: relative;
873871
&:not(:first-child) {
874-
margin-top: 0.5em;
872+
margin-top: 0.5rem;
875873
}
876874
}
877875
.page-content li:before {
878876
content: "\002013";
879-
left: -1em;
877+
left: -1rem;
880878
position: absolute;
881879
}
882880

@@ -888,8 +886,8 @@ $kui--page-content-paragraph-padding: 0.375em;
888886
}
889887
.icon-container .deemphasize {
890888
white-space: nowrap;
891-
font-size: 0.5em;
892-
margin-top: 0.5ex;
889+
font-size: 0.5rem;
890+
margin-top: 0.375rem;
893891
}
894892

895893
body[kui-theme-style] {
@@ -935,12 +933,12 @@ badge,
935933
background-color: transparent;
936934
}
937935
&.badge-as-image img {
938-
width: 5em;
936+
width: 5rem;
939937
height: auto;
940938
}
941939
&.badge-as-fontawesome {
942940
padding: 0;
943-
font-size: 1.5em;
941+
font-size: 1.5rem;
944942
color: var(--color-name);
945943
}
946944
&.is-title-like,

‎plugins/plugin-client-common/web/scss/components/Table/badges.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@import '../common/narrow-window';
22
@import '../common/stippling';
33

4-
$grid-cell-size: 1.5rem;
4+
$grid-cell-size: 1.25rem;
55

66
.bx--data-table,
77
.kui--table-like {

‎plugins/plugin-client-common/web/scss/components/Table/tables.scss

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,12 +23,6 @@ body .bx--data-table-container {
2323
.bx--data-table {
2424
font-family: var(--font-sans-serif);
2525

26-
&,
27-
thead,
28-
tbody {
29-
font-size: 1rem;
30-
}
31-
3226
/* td [data-key='NAME'],
3327
td .kui--table-cell-is-name {
3428
font-weight: 700;

0 commit comments

Comments
 (0)