「Twitter」の版間の差分
Notion-MW |
Notion-MW |
||
(同じ利用者による、間の12版が非表示) | |||
10行目: | 10行目: | ||
* chromeを起動するところの<code>--app-id=jgeocpdicgmkeemopbanhokmhcgcflmi</code>の部分については[[Webブラウザ(Chrome)|Webブラウザ(Chrome)]]のPWAのところを参照。 | * chromeを起動するところの<code>--app-id=jgeocpdicgmkeemopbanhokmhcgcflmi</code>の部分については[[Webブラウザ(Chrome)|Webブラウザ(Chrome)]]のPWAのところを参照。 | ||
<syntaxhighlight lang=" | <syntaxhighlight lang="plain text">; ウインドウのアクティベート時に強引な方法を用いる(FlashWindowだけで終わってしまうのを避ける)? | ||
#WinActivateForce | #WinActivateForce | ||
166行目: | 166行目: | ||
== 狭い画面向けのTwitterのCSS == | == 狭い画面向けのTwitterのCSS == | ||
StylusなどのCSSを適用してくれる拡張機能をインストールし、以下を入力する。コメントで簡単に説明を書いたので必要に応じて数値の変更やコメントアウトなどするとよい。 | |||
* Stylusに類似のものでStylishというのがあったが、個人情報の収集かなんかで問題になったので使わない方が良さそう | * Stylusに類似のものでStylishというのがあったが、個人情報の収集かなんかで問題になったので使わない方が良さそう | ||
<syntaxhighlight lang=" | <syntaxhighlight lang="css">/*一応参考(ただし結局ほぼ使わず) https://polygonote.com/2022_0308_18019/ */ | ||
/* メインエリアの幅の制約を解除 */ | /* メインエリアの幅の制約を解除 */ | ||
main | main | ||
182行目: | 182行目: | ||
} | } | ||
/*最も広いときの幅の制約の解除*/ | |||
.r-113js5t { | |||
width: 100%; | |||
} | |||
/*比較的広いときの幅の制約の解除*/ | /*比較的広いときの幅の制約の解除*/ | ||
.r-rthrr5 { | .r-rthrr5 { | ||
194行目: | 199行目: | ||
width: 100%; | width: 100%; | ||
} | } | ||
/*DM欄の幅を確保*/ | |||
section[aria-labelledby="root-header"]{ | |||
width: 30%; | |||
} | |||
section[aria-labelledby="detail-header"]{ | |||
width: 70%; | |||
} | |||
/*トレンドエリア非表示*/ | /*トレンドエリア非表示*/ | ||
div[data-testid="sidebarColumn"]{ | div[data-testid="sidebarColumn"]{ | ||
212行目: | 223行目: | ||
width:52px | width:52px | ||
} | } | ||
/*幅が広いときの左側バナーの余白を無効に*/ | |||
header[role="banner"] > div { | |||
margin-left: 0px; | |||
} | |||
/*header[role="banner"], こっちは不要?*/ | /*header[role="banner"], こっちは不要?*/ | ||
header[role="banner"] > div > div > div > div > div > a/*「ツイートする」ボタンのサイズ*/ | header[role="banner"] > div > div > div > div > div > a/*「ツイートする」ボタンのサイズ*/ | ||
{ | { | ||
max-width: 100%; | max-width: 100%; | ||
padding-left: 0px; | |||
padding-right: 0px; | |||
} | } | ||
238行目: | 255行目: | ||
/*幅が広いときでもバナーの各種アイコンの横に「通知」などの文字は出さない*/ | /*幅が広いときでもバナーの各種アイコンの横に「通知」などの文字は出さない*/ | ||
/*これらは古いのでおそらく不要 | |||
header > div > div > div > div.css-1dbjc4n.r-usiww2 > div > div > div.css-1dbjc4n.r-1wbh5a2.r-dnmrzs.r-1ny4l3l, | header > div > div > div > div.css-1dbjc4n.r-usiww2 > div > div > div.css-1dbjc4n.r-1wbh5a2.r-dnmrzs.r-1ny4l3l, | ||
header > div > div > div > div.css-1dbjc4n.r-usiww2 > div > div > div.css-1dbjc4n.r-obd0qt.r-16y2uox, | header > div > div > div > div.css-1dbjc4n.r-usiww2 > div > div > div.css-1dbjc4n.r-obd0qt.r-16y2uox, | ||
nav > div > div > div.css-901oao.css-1hf3ou5.r-18jsvk2.r-1tl8opc.r-adyw6z.r-135wba7.r-1joea0r.r-88pszg.r-bcqeeo.r-qvutc0, | nav > div > div > div.css-901oao.css-1hf3ou5.r-18jsvk2.r-1tl8opc.r-adyw6z.r-135wba7.r-1joea0r.r-88pszg.r-bcqeeo.r-qvutc0, | ||
nav > a > div > div.css-901oao.css-1hf3ou5.r-18jsvk2.r-1tl8opc.r-adyw6z.r-135wba7.r-1joea0r.r-88pszg.r-bcqeeo.r-qvutc0{ | nav > a > div > div.css-901oao.css-1hf3ou5.r-18jsvk2.r-1tl8opc.r-adyw6z.r-135wba7.r-1joea0r.r-88pszg.r-bcqeeo.r-qvutc0, | ||
*/ | |||
header[role="banner"] > div > div > div > div > div > nav > a > div > div:nth-child(2), | |||
header[role="banner"] > div > div > div > div > div > nav > button > div > div:nth-child(2),/*もっと見る*/ | |||
header[role="banner"] > div > div > div > div > div > nav > div > div > div:nth-child(2), | |||
header[role="banner"] > div > div > div > div > div > button > div:nth-child(n+2),/*下のアイコン*/ | |||
header[role="banner"] > div > div > div > div.r-usiww2 > div > div > div:nth-child(n+2){ | |||
display:none | display:none | ||
} | } | ||
250行目: | 274行目: | ||
/*ツイート画像・動画。しかし一行下のもののほうが動画を再生時のみ枠に収めて最大化ボタンを押せるようにできるので、こちらは不要そう。 | /*ツイート画像・動画。しかし一行下のもののほうが動画を再生時のみ枠に収めて最大化ボタンを押せるようにできるので、こちらは不要そう。 | ||
article[data-testid="tweet"] > div > div > div.css-1dbjc4n.r-18u37iz > div.css-1dbjc4n.r-1iusvr4.r-16y2uox.r-1777fci.r-kzbkwu > div.css-1dbjc4n.r-1ssbvtb.r-1s2bzr4 > div.r-9aw3ui > div > div > div,*/ | article[data-testid="tweet"] > div > div > div.css-1dbjc4n.r-18u37iz > div.css-1dbjc4n.r-1iusvr4.r-16y2uox.r-1777fci.r-kzbkwu > div.css-1dbjc4n.r-1ssbvtb.r-1s2bzr4 > div.r-9aw3ui > div > div > div,*/ | ||
article[data-testid="tweet"] > div > div > div.css-1dbjc4n.r-18u37iz > div.css-1dbjc4n.r-1iusvr4.r-16y2uox.r-1777fci.r-kzbkwu > div.css-1dbjc4n.r-1ssbvtb.r-1s2bzr4 > div.r-9aw3ui > div > div > div > div,/* | /*article[data-testid="tweet"] > div > div > div.css-1dbjc4n.r-18u37iz > div.css-1dbjc4n.r-1iusvr4.r-16y2uox.r-1777fci.r-kzbkwu > div.css-1dbjc4n.r-1ssbvtb.r-1s2bzr4 > div.r-9aw3ui > div > div > div > div,再生時の動画コンテンツ。サムネイル状態だとうまく適用外になってくれる*/ | ||
/*上2つはおそらくもう機能していないので下を追加*/ | |||
div:has(> div > div > div[data-testid="videoPlayer"]), | |||
/*article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div:has(> div> div > div > div > div > div > div > a > div > div[data-testid="tweetPhoto"]),/*引用ツイート内複数画像*/ | |||
/*article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div > div > div > div > div > div:has(> div > a > div > div[data-testid="tweetPhoto"]),/*引用ツイート内複数画像(少なめ)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div:has(> div > div > a > div > div > div[data-testid="tweetPhoto"]),/*引用画像*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div:has(> div > div > a > div > div > div[data-testid="tweetPhoto"]),/*画像*/ | |||
div:has(a > div > div > img):has(> a > div > svg),/*Grokによる画像*/ | |||
aaadiv:has(> div> div> div[data-testid="previewInterstitial"]),/*四角い動画(・画像?)*/ | |||
div[data-testid="testCondensedMedia"] > div > div,/*複数枚入ってるものは直後のスタイルで上書きされる*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div:has(> div > div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"]),/*動画*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div:has(> div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"]),/*動画(内側も)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div > div:has(> div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"]),/*引用動画*/ | |||
/*引用ツイート画像・動画。しかし一行下のもののほうが動画を再生時のみ枠に収めて最大化ボタンを押せるようにできるので、こちらは不要そう。 | /*引用ツイート画像・動画。しかし一行下のもののほうが動画を再生時のみ枠に収めて最大化ボタンを押せるようにできるので、こちらは不要そう。 | ||
258行目: | 304行目: | ||
/*以下2つは、それぞれの子要素のdivに適用するよりこのほうがうまくいった*/ | /*以下2つは、それぞれの子要素のdivに適用するよりこのほうがうまくいった*/ | ||
div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"] > a,/*埋め込み記事の画像*/ | div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"] > a,/*埋め込み記事の画像*/ | ||
div[data-testid="card.wrapper"]:has( > div[data-testid="card.layoutLarge.media"] > a),/*埋め込み記事の画像*/ | |||
div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"] > div/*埋め込み記事の動画。サイトによっては画像も引っかかる?*/ | div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"] > div/*埋め込み記事の動画。サイトによっては画像も引っかかる?*/ | ||
{ | { | ||
266行目: | 313行目: | ||
} | } | ||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div:has(> div > div > div > div > div > a > div > div[data-testid="tweetPhoto"]),/*複数画像(2枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div:has(> div > div> div > div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"]),/*複数動画(2枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div:has(> div > div > div> div > div > a > div > div[data-testid="tweetPhoto"]),/*引用ツイート内複数画像(2枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div > div:has(> div > div> div > div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"])/*引用ツイート内複数動画(2枚)*/ | |||
{ | |||
max-height: 200px; | |||
max-width: 1000px; | |||
justify-content: center; | |||
overflow:hidden; | |||
} | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div:has(> div > div > div > div > div > div > a > div > div[data-testid="tweetPhoto"]),/*複数画像(3, 4枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div:has(> div > div> div > div > div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"]),/*複数動画(3, 4枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div> div> div:has( > div > div > div > div> div > div> a > div > div[data-testid="tweetPhoto"]),/*引用ツイート内複数画像(3, 4枚)*/ | |||
article[data-testid="tweet"] > div > div > div > div > div > div > div > div > div > div > div > div:has(> div > div> div > div > div[data-testid="tweetPhoto"] > div > div > div > div[data-testid="placementTracking"] > div[data-testid="videoPlayer"])/*引用ツイート内複数動画(3, 4枚)*/ | |||
{ | |||
max-height: 400px; | |||
max-width: 1000px; | |||
justify-content: center; | |||
overflow:hidden; | |||
} | |||
/*画像の余白の色を枠線と合わせる*/ | /*画像の余白の色を枠線と合わせる*/ | ||
div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"], | div[data-testid="card.wrapper"] > div[data-testid="card.layoutLarge.media"], | ||
277行目: | 347行目: | ||
/*不要? display:none*/ | /*不要? display:none*/ | ||
} | } | ||
/*「さらに表示」があるツイート*/ | |||
/*article[data-testid="tweet"]:has(> div > div > div > div > div > div[data-testid="tweet-text-show-more-link"]),*/ | |||
/*AdBlock*/ | |||
/* article[data-testid="tweet"]:has(> div > div > div > div > div:nth-child(5) > div > svg){ | |||
display:none | |||
} */ | |||
/*Grok(広告だっけ?)*/ | |||
div[data-testid="cellInnerDiv"]:has(> div > div > div > div[data-testid="inlinePrompt"]){ | |||
display:none | |||
} | |||
/*「ホーム」ではなくツイート単独ページ(https://twitter.com/###/status/#########?s=20)用。nth-child(3)がないとTL上の画像にも適用されてしまう*/ | /*「ホーム」ではなくツイート単独ページ(https://twitter.com/###/status/#########?s=20)用。nth-child(3)がないとTL上の画像にも適用されてしまう*/ | ||
371行目: | 453行目: | ||
}*/ | }*/ | ||
/*検索ボックスの幅を小さく*/ | /*検索ボックスの幅を小さく*/ | ||
input[data-testid=" | /*input[data-testid="SearchBox_Search_Input_label"] | ||
{ | { | ||
padding-top: 0px; | padding-top: 0px; | ||
padding-bottom: 0px; | padding-bottom: 0px; | ||
}*/ | |||
.r-ero68b { | |||
min-height: 20px; | |||
}</syntaxhighlight> | }</syntaxhighlight> | ||
[[Category:IT]]{{#seo:|title={{FULLPAGENAME}} - Turgenev's Wiki}} | [[Category:IT]]{{#seo:|title={{FULLPAGENAME}} - Turgenev's Wiki}} |