1.0.1: theme performance, full Windows 98/Classic bars, the app menu on each pane's wB, restored windows fit their monitor
This commit is contained in:
parent
12eb3d9bee
commit
7e2515aa42
14 changed files with 104 additions and 32 deletions
|
|
@ -11,9 +11,8 @@ import type { VariantSkins } from '../../../../waybetter/packages/runtime/src/th
|
|||
const POST = 'article[data-testid="tweet"]';
|
||||
const COLUMN = '[data-testid="primaryColumn"]';
|
||||
/** The main column on every route but chat (a drawn bar above X's chat app would push its composer out of the window). */
|
||||
/** X's chat app: in the page, or the host of its embed (an open shadow root the page's :has() cannot look into, 2026-10-01). */
|
||||
const CHAT_APP = ':is([data-testid="dm-container"],[data-testid="xchatEmbedRoute"])';
|
||||
const FRAMED = `[data-testid="primaryColumn"]:not(:has(${CHAT_APP}))`;
|
||||
// Keyed on the engine's page flag (THEME_FLAGS in theme.ts), never `:has()` over the page: see SIGNED_OUT_ROOT.
|
||||
const FRAMED = 'html:not([data-wb-chat]) [data-testid="primaryColumn"]';
|
||||
const RAIL = 'header[role="banner"]';
|
||||
const NAV = `${RAIL} nav[role="navigation"]`;
|
||||
const ACTIONS = ['reply', 'retweet', 'unretweet', 'like', 'unlike', 'bookmark', 'removeBookmark'].map(id => `[data-testid="${id}"]`).join(',');
|
||||
|
|
@ -38,7 +37,9 @@ export const X_PARTS: PartMap = {
|
|||
buttonPrimary: { sel: '[data-testid="tweetButtonInline"],[data-testid="tweetButton"],[data-testid="SideNav_NewTweet_Button"]', text: ':is([data-testid="tweetButtonInline"],[data-testid="tweetButton"],[data-testid="SideNav_NewTweet_Button"]) :is(span,div[dir])' },
|
||||
buttonSecondary: { sel: '[data-testid$="-follow"],[data-testid$="-unfollow"]', text: ':is([data-testid$="-follow"],[data-testid$="-unfollow"]) span' },
|
||||
// Live 2026-10-01: the painted box is three levels above the input's label (a div, no <label>).
|
||||
search: { sel: 'form[role="search"] div:has(> div > div > [data-testid="SearchBox_Search_Input_label"])', text: 'form[role="search"] input' },
|
||||
// X's search pill: the form's grandchild (the label sits three levels below it). No :has(): a page-wide
|
||||
// :has() made every node X inserted restyle the whole page (1.0.0).
|
||||
search: { sel: 'form[role="search"] > div > div', text: 'form[role="search"] input' },
|
||||
composer: { sel: '[data-testid="tweetTextarea_0"]', text: '[data-testid="tweetTextarea_0"] :is(span,div)' },
|
||||
composerTool: { sel: '[data-testid="toolBar"] nav [role="button"]', text: '[data-testid="toolBar"] nav [role="button"] svg' },
|
||||
sidebarCard: { sel: '[data-testid="sidebarColumn"] div:has(> :is(aside[role="complementary"],section[role="region"]))' },
|
||||
|
|
@ -79,7 +80,7 @@ export type XSkinContext = {
|
|||
|
||||
/** Only above X's narrow breakpoint, never on chat's own row, never while the pane's rail is parked. */
|
||||
const WIDE = '@media (min-width:700px)';
|
||||
const NOT_CHAT = `html:not(:has(${CHAT_APP}))`;
|
||||
const NOT_CHAT = 'html:not([data-wb-chat])';
|
||||
|
||||
/** How X looks in each layout variant. */
|
||||
export const X_SKINS: VariantSkins<XSkinContext> = {
|
||||
|
|
@ -139,7 +140,11 @@ ${NOT_CHAT} ${RAIL} > div{width:100% !important;height:56px !important}
|
|||
${NOT_CHAT} ${inner}{position:static !important;width:100% !important;height:56px !important;max-width:1280px;margin:0 auto !important}
|
||||
${NOT_CHAT} ${inner} > div{flex-direction:row !important;align-items:center !important;justify-content:space-between !important;height:56px !important;width:100% !important;padding:0 16px !important;overflow:visible !important}
|
||||
${NOT_CHAT} ${inner} > div > div{flex-direction:row !important;align-items:center !important;height:56px !important;gap:4px}
|
||||
/* The same for the groups inside the row (the nav and the Post button sit in full-width wrappers). */
|
||||
${NOT_CHAT} ${inner} > div > div > div{width:auto !important;flex:0 1 auto !important;min-width:0 !important}
|
||||
${NOT_CHAT} ${NAV}{flex-direction:row !important;align-items:center !important;flex-wrap:nowrap !important;gap:2px}
|
||||
/* X sizes each rail item to the rail (width:100%, flex-grow:1): in a row that is one window per item. */
|
||||
${NOT_CHAT} ${NAV} > :is(a,button){width:auto !important;flex:0 1 auto !important;min-width:0 !important}
|
||||
${NOT_CHAT} ${NAV} > :is(a,button) > div{padding:8px 10px !important}
|
||||
${NOT_CHAT} ${RAIL} [data-testid="SideNav_NewTweet_Button"]{margin:0 0 0 8px !important;width:auto !important;min-height:40px !important;padding:0 16px !important}
|
||||
${NOT_CHAT} ${RAIL} [data-testid="SideNav_AccountSwitcher_Button"]{margin:0 !important}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue