@homebound/beam 2.124.2 → 2.124.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -41,7 +41,10 @@ function TextFieldBase(props) {
|
|
|
41
41
|
.if(compact)
|
|
42
42
|
.hPx(compactFieldHeight - maybeSmaller).$,
|
|
43
43
|
...Css_1.Css.bgWhite.gray900.if(contrast).bgGray700.white.$,
|
|
44
|
-
|
|
44
|
+
// When borderless then perceived vertical alignments are misaligned. As there is no longer a border, then the field looks oddly indented.
|
|
45
|
+
// This typically happens in tables when a column has a mix of static text (i.e. "roll up" rows and table headers) and input fields.
|
|
46
|
+
// To remedy this perceived misalignment then we increase the width by the horizontal padding applied (16px), and set a negative margin left margin to re-center the field.
|
|
47
|
+
...(borderless ? Css_1.Css.bTransparent.w("calc(100% + 16px)").ml(-1).$ : Css_1.Css.bGray300.if(contrast).bGray700.$),
|
|
45
48
|
...(!compound ? Css_1.Css.ba.$ : {}),
|
|
46
49
|
},
|
|
47
50
|
inputWrapperReadOnly: {
|
|
@@ -50,8 +53,6 @@ function TextFieldBase(props) {
|
|
|
50
53
|
.if(compact)
|
|
51
54
|
.mhPx(compactFieldHeight - maybeSmaller).$,
|
|
52
55
|
...Css_1.Css.gray900.if(contrast).white.$,
|
|
53
|
-
// Make read-only fields vertically line up with editable fields in tables
|
|
54
|
-
...(borderless ? Css_1.Css.px1.$ : {}),
|
|
55
56
|
},
|
|
56
57
|
input: {
|
|
57
58
|
...Css_1.Css.w100.mw0.outline0.fg1.if(multiline).br4.$,
|