Check the breakpoints against SizeClass, and move the mobile shell onto Compact
The mobile layout switched at 768px, which is a boundary no size class has: a
window between 600 and 767 got the single-pane shell while every generated
stylesheet beside it was still laying out the wide one. It is Compact's edge
now, 599px, which is where goingson switches.
That drift is what makeover-build 0.18's check exists to catch, and this app
had no check pass at all. Both are wired up now, with no tuning widths: every
width styles.css names is a shell boundary.
Also lands the manifest half of the 0.17 touch-density adoption.
- Co-Authored-By
- Claude Opus 5 (1M context) <noreply@anthropic.com>
4 files changed,
+38 insertions,
-17 deletions
| 3141 |
3141 |
|
|
| 3142 |
3142 |
|
[[package]]
|
| 3143 |
3143 |
|
name = "makeover-build"
|
| 3144 |
|
- |
version = "0.15.0"
|
|
3144 |
+ |
version = "0.18.0"
|
| 3145 |
3145 |
|
source = "registry+https://github.com/rust-lang/crates.io-index"
|
| 3146 |
|
- |
checksum = "b517a2d67aba7766eca3b8ee174cef4100fb51f64455c22fe804dac9f5b64c6c"
|
|
3146 |
+ |
checksum = "31befafd278832b811b0b7ffa30d4caaae4397178268010f796a05d0c0934554"
|
| 3147 |
3147 |
|
dependencies = [
|
| 3148 |
3148 |
|
"makeover",
|
| 3149 |
3149 |
|
"makeover-geometry",
|
| 3174 |
3174 |
|
|
| 3175 |
3175 |
|
[[package]]
|
| 3176 |
3176 |
|
name = "makeover-webview"
|
| 3177 |
|
- |
version = "0.22.1"
|
|
3177 |
+ |
version = "0.23.0"
|
| 3178 |
3178 |
|
source = "registry+https://github.com/rust-lang/crates.io-index"
|
| 3179 |
|
- |
checksum = "9110b5a405a2378d2ef7d93efedc2b65f4bdd32a3de902ee8192b20a8dc3f7f5"
|
|
3179 |
+ |
checksum = "0303225f8e8be6ef237ed268652e7fbfd501bd17843323680a18a9df30b38fe3"
|
| 3180 |
3180 |
|
dependencies = [
|
| 3181 |
3181 |
|
"makeover-geometry",
|
| 3182 |
3182 |
|
"makeover-layout",
|
| 7940 |
7940 |
|
"winnow 1.0.4",
|
| 7941 |
7941 |
|
]
|
| 7942 |
7942 |
|
|
|
7943 |
+ |
[[patch.unused]]
|
|
7944 |
+ |
name = "kberg"
|
|
7945 |
+ |
version = "0.1.0"
|
|
7946 |
+ |
|
|
7947 |
+ |
[[patch.unused]]
|
|
7948 |
+ |
name = "painhours"
|
|
7949 |
+ |
version = "0.1.0"
|
|
7950 |
+ |
|
| 7943 |
7951 |
|
[[patch.unused]]
|
| 7944 |
7952 |
|
name = "quasi-axum"
|
| 7945 |
7953 |
|
version = "0.1.0"
|
| 7963 |
7971 |
|
[[patch.unused]]
|
| 7964 |
7972 |
|
name = "quasi-webview"
|
| 7965 |
7973 |
|
version = "0.1.0"
|
| 7966 |
|
- |
|
| 7967 |
|
- |
[[patch.unused]]
|
| 7968 |
|
- |
name = "kberg"
|
| 7969 |
|
- |
version = "0.1.0"
|
| 7970 |
|
- |
|
| 7971 |
|
- |
[[patch.unused]]
|
| 7972 |
|
- |
name = "painhours"
|
| 7973 |
|
- |
version = "0.1.0"
|
| 18 |
18 |
|
# Materialises all three generated files: themes/, geometry.css, layout.css.
|
| 19 |
19 |
|
# The build script needs nothing else; makeover and makeover-geometry reach it
|
| 20 |
20 |
|
# through here.
|
| 21 |
|
- |
makeover-build = "0.15"
|
|
21 |
+ |
makeover-build = "0.18"
|
| 22 |
22 |
|
|
| 23 |
23 |
|
[dependencies]
|
| 24 |
24 |
|
bb-interface.workspace = true
|
| 8 |
8 |
|
&makeover_build::Emit::default(),
|
| 9 |
9 |
|
None,
|
| 10 |
10 |
|
);
|
|
11 |
+ |
|
|
12 |
+ |
// The generated files above cannot drift from makeover-geometry: they ask
|
|
13 |
+ |
// it for the answer. The hand-written ones state it, so they are checked
|
|
14 |
+ |
// rather than trusted. goingson had both checks and this app had neither,
|
|
15 |
+ |
// which is the asymmetry that moved them into makeover-build.
|
|
16 |
+ |
let frontend = std::path::Path::new(env!("CARGO_MANIFEST_DIR")).join("frontend");
|
|
17 |
+ |
|
|
18 |
+ |
// No tuning widths. Every width styles.css names is a shell boundary, and
|
|
19 |
+ |
// the one that was not -- a 768px mobile switch, from before the size
|
|
20 |
+ |
// classes -- was moved onto SizeClass::Compact rather than declared here.
|
|
21 |
+ |
// The list is for a width that tunes the inside of a shell, and adding one
|
|
22 |
+ |
// to silence this check is how a real boundary escapes it.
|
|
23 |
+ |
makeover_build::check_breakpoints(&frontend, &[]);
|
|
24 |
+ |
makeover_build::check_touch_density(frontend.join("js"));
|
|
25 |
+ |
|
| 11 |
26 |
|
tauri_build::build();
|
| 12 |
27 |
|
}
|
| 100 |
100 |
|
38. Source-badge on items (mobile-only display)
|
| 101 |
101 |
|
|
| 102 |
102 |
|
BAND: RESPONSIVE LAYERS: cascade-ordered
|
| 103 |
|
- |
39. @media (max-width: 768px): mobile layout
|
|
103 |
+ |
39. @media (max-width: 599px): mobile layout
|
| 104 |
104 |
|
40. @media (hover: none): touch overrides
|
| 105 |
105 |
|
41. @media (prefers-reduced-motion: reduce)
|
| 106 |
106 |
|
|
| 1848 |
1848 |
|
}
|
| 1849 |
1849 |
|
|
| 1850 |
1850 |
|
/* === 38. Source-badge on items (mobile-only display) =================
|
| 1851 |
|
- |
Hidden on desktop; shown inside the @media (max-width: 768px) block below.
|
|
1851 |
+ |
Hidden on desktop; shown inside the @media (max-width: 599px) block below.
|
| 1852 |
1852 |
|
========================================================================== */
|
| 1853 |
1853 |
|
.article-source-badge { display: none; }
|
| 1854 |
1854 |
|
|
| 1855 |
|
- |
/* === 39. @media (max-width: 768px): mobile layout ==================== */
|
| 1856 |
|
- |
@media (max-width: 768px) {
|
|
1855 |
+ |
/* === 39. @media (max-width: 599px): mobile layout ====================
|
|
1856 |
+ |
599px is SizeClass::Compact's upper edge, not a number chosen here. It was
|
|
1857 |
+ |
768px until 2026-08-11, which is a boundary no size class has: a window
|
|
1858 |
+ |
between 600 and 767 got the single-pane shell while every generated
|
|
1859 |
+ |
stylesheet beside it was still laying out the wide one. build.rs checks this
|
|
1860 |
+ |
against makeover-geometry now, so the two cannot part again.
|
|
1861 |
+ |
========================================================================== */
|
|
1862 |
+ |
@media (max-width: 599px) {
|
| 1857 |
1863 |
|
body {
|
| 1858 |
1864 |
|
padding-top: env(safe-area-inset-top);
|
| 1859 |
1865 |
|
padding-bottom: calc(52px + env(safe-area-inset-bottom));
|