@trebired/frontend 18.5.0 → 18.7.0
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.
- package/CHANGELOG.md +10 -0
- package/dist/styles/utils/base.scss +2 -8
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 18.7.0
|
|
4
|
+
|
|
5
|
+
- The page edge hairline is strong enough to see. Measured against a render with the line switched off, 18.5.0 moved its column by 62 and 18.6.0 by 87, neither of which reads as a line at one pixel. It is 50% now: 125 over a light page, 128 over a dark one.
|
|
6
|
+
- The colours are the package's own and there is nothing for a site to set. A translucent black line with a translucent white one beside it composites against whatever is behind, so the pair carries on light, dark and mid backgrounds alike, and no site declares or overrides any part of it.
|
|
7
|
+
|
|
8
|
+
## 18.6.0
|
|
9
|
+
|
|
10
|
+
- The page edge hairline no longer depends on `backdrop-filter`. It is a translucent dark line with a translucent light one beside it, so one of the pair carries on any background: measured contrast is 88 over near white, 45 over mid grey and 79 over near black. 18.5.0 used `backdrop-filter: invert(1)`, which vanishes entirely over a mid tone, since inverting a mid grey gives back the same grey, and disappears completely in any browser where the filter does not paint, because the `@supports` rule had cleared the background underneath it.
|
|
11
|
+
- It is strong enough to see. 18.4.0 and 18.5.0 both rendered a line whose contrast measured as a real difference but which was not perceptible at one pixel on a light page.
|
|
12
|
+
|
|
3
13
|
## 18.5.0
|
|
4
14
|
|
|
5
15
|
- The page edge hairline reads the background it is actually over, rather than one colour for the whole page. It runs the full height of the viewport and crosses whatever sections the page has, so a fixed colour was faint over one band and a bright stripe over the next. `backdrop-filter: invert(1) grayscale(1) opacity(0.25)` inverts what is behind it per pixel: measured against a light section and a dark one on the same page, contrast comes out 60 and 49 rather than 43 and 171. A site with no `backdrop-filter` keeps the mixed colour as a fallback.
|
|
@@ -105,17 +105,11 @@ body::after {
|
|
|
105
105
|
inset-block: 0;
|
|
106
106
|
inset-inline-end: 0;
|
|
107
107
|
width: 1px;
|
|
108
|
-
background:
|
|
109
|
-
|
|
108
|
+
background: rgb(0 0 0 / 50%);
|
|
109
|
+
box-shadow: -1px 0 0 rgb(255 255 255 / 50%);
|
|
110
110
|
pointer-events: none;
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
-
@supports (backdrop-filter: invert(1)) {
|
|
114
|
-
body::after {
|
|
115
|
-
background: transparent;
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
|
|
119
113
|
body#{ns.data("mobile-sidebar-open", "true")},
|
|
120
114
|
|
|
121
115
|
body#{ns.data("sidebar-open", "true")} {
|