Twitter/xのUIを2カラム表示にするユーザースタイルの配布ページです。
本ページで公開しているスタイルを利用するには「Stylus」という
Chrome/Firefoxの拡張機能をインストールする必要があります。
表示確認:Firefox、画面サイズ1920×1080で確認
「Stylus」はウェブサイトの見た目を自分好みにカスタマイズできるブラウザの拡張機能(アドオン)です。
このアドオンはChrome版とFirefox版があります。
※類似品に「Stylish」というアドオンがありますが、プライバシーポリシーに反して
すべての閲覧履歴を収集していたことが発覚したこともあり、セキュリティ面で不安が残ります。
気になる方はStylishのインストールはしないほうが無難です。
今回、userstyles.orgのサーバが非常に重く、ソーシャルリンクもうまくできないということもあり、
こちらのページでもユーザースタイルを配布することにしました。
使う人がいるのだろうか?と疑問が残りますが、使ってもいいよという物好きな方は
自由に持っていって下さい^^
■ダウンロード
Stylusをインストール後、「管理」→「バックアップ」から「インポート」をクリックし、
jsonファイルをStylusにインポートしてお使い下さい。
>>ユーザースタイルのダウンロード
CSSを直接貼り付ける場合はこちらをどうぞ。
@-moz-document domain(‘twitter.com’), domain(“x.com”) {
@media only screen and (min-width: 1281px) {
#react-root {display:block !important;}
main {width: 100%;margin: 5rem 0 !important;position: relative !important;}
main > div:first-child {margin:0 auto;}
header {position:absolute !important;width:100%;display:block !important;}/* Inline the Navbar */
#react-root > div:first-child > div:first-child > div {position:relative;}
header > div:first-child {margin:0; width:100%;}
header > div:first-child > div:first-child {height:50px!important;width:100% !important;background-color:#fff;}
header > div:first-child > div:first-child > div:first-child {width:100%;display:block !important;padding:0; border-bottom: 2px solid #8bcdff;overflow:hidden;}
header > div:first-child > div:first-child > div:first-child > div:first-child {width:80%;display:block !important;}
header > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child {width:100%;display:block !important;}
header > div:first-child > div:first-child > div:first-child > div:nth-child(2) {display:block;position:absolute;margin:0;top:-0.5rem;right:0;}
header > div:first-child > div:first-child > div:first-child > div:first-child > div:nth-child(2) {width:90% !important;display: table !important;float: left;padding-top: 3px;}
header > div:first-child > div:first-child > div:first-child > div:first-child > div:nth-child(3) {width:auto !important;display: table;margin:.15rem 0 0 0 !important;}
header h1 {display:none !important;}
header nav {width:100% !important;overflow: auto;padding: .5rem 1rem;display:block !important}
header nav::after {content: “”;clear: both;display: table;}
header nav a, div[data-testid=”AppTabBar_More_Menu”] div {padding: 0;width: auto !important;float: left;}
header nav > div {float: right; width:auto !important;padding:0;}
header nav a, div[data-testid=”AppTabBar_More_Menu”] div {padding:0 !important;}
header nav a svg, div[data-testid=”AppTabBar_More_Menu”] svg {height:1.5rem;width:1.5rem;}
div[data-testid=”AppTabBar_More_Menu”] div {font-size: .9rem;font-weight: 500;}
header nav a > div, div[data-testid=”AppTabBar_More_Menu”] div > div {padding:.25rem .35rem !important;}
header nav a > div:first-child > div:nth-child(2) {font-size: .9rem;font-weight: 500;margin:0 1rem 0 .25rem !important;}
header > div:first-child > div:first-child > div:first-child > div:first-child > div:nth-child(3) a {min-height:35px;margin-right: 0rem;}
/* Top Bar Fix */
header > div:first-child > div:first-child > div:first-child {padding:0;padding-left:3rem;}
.r-1ag2gil {padding:0}
.r-1sp51qo {padding-bottom:8px;padding-top:8px;margin-right:10px;margin-top:2px}
}/* Header & Background colors */
body[style*=”#FFF”] header > div:first-child > div:first-child {background-color:#fff !important;}
body[style*=”rgb(255″], body[style*=”#FFF”] {background-color:#f8f8f8 !important;}
body[style*=”rgb(255″] header > div:first-child > div:first-child {background-color:#fff !important;}
body[style*=”rgb(21″], body[style*=”rgb(21″] header > div:first-child > div:first-child {background-color:#15202b !important;}
body[style*=”rgb(0″], body[style*=”rgb(0″] header > div:first-child > div:first-child {background-color:#000 !important;}/* Primary Column */
div[data-testid=”primaryColumn”] > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child h2 {font-weight: 700;}
div[data-testid=”primaryColumn”] > div:first-child > div:first-child > div:nth-child(2) {margin-bottom:2rem;}/* Image and Post Styling */
article[role=”article”] > div:first-child > div:nth-child(2) > div:first-child > div:nth-child(2) > div:first-child > div:first-child {border-radius:.5rem !important;}
article[role=”article”] > div:first-child > div:nth-child(2) > div:first-child > div:nth-child(3) > div:first-child > div:first-child {border-radius:.5rem !important;}
article[role=”article”] > div:nth-child(2) > div:nth-child(2) > div:first-child > div:nth-child(3) > div:first-child > div:first-child {border-radius:.5rem !important;}
article[role=”article”] > div:nth-child(2) > div:nth-child(2) > div:first-child > div:nth-child(2) > div:first-child > div:first-child {border-radius:.5rem !important;}/* Sidebar & Search Form */
div[data-testid=”sidebarColumn”] form[role=”search”] {background-color:#f8f8f8; padding:.3rem;}
div[data-testid=”sidebarColumn”] > div:first-child > div:nth-child(2) > div:first-child > div:first-child > div:first-child {padding:0;}
div[data-testid=”sidebarColumn”] > div:first-child > div:nth-child(2) > div:first-child > div:first-child > div:first-child > div:first-child {position:relative;z-index:1000000;}
div[data-testid=”sidebarColumn”] > div:first-child > div:nth-child(2) > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child {position:relative;border:0px solid #e6ecf0;}
div[data-testid=”sidebarColumn”] > div:first-child > div:nth-child(2) > div:first-child > div:first-child > div:first-child > div:first-child > div:nth-child(2) {display:none;}/* Navbar Notifications */
a[aria-label*=”unread”] {color: #ffffff;background-color: #1da1f2;padding: .0125rem .25rem !important;border-radius: 2.5rem;margin-right:.75rem;position:relative;display:block;}
a[aria-label*=”unread”] div {color:#fff;}
a[aria-label*=”unread”] svg {color:#fff;}
div[aria-live=”polite”] {top:-5px !important;right:11px !important;position:absolute !important;background-color:#e83f3f;border:2px solid #fff;}
div[aria-label*=”New Tweets”] {top:1.5rem;}/* 2012 Fixes */
main > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child {top:3rem;opacity:.85;height:auto !important;}
main > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child > div:first-child div{height:auto !important;}/* User Options */
/* Show/Hide DM Drawer */
div[data-testid*=”DM”] {display:flex !important;}
/* Show/Hide Who to Follow */
aside[aria-label*=”Who to follow”] {display:flex !important;}
/* Show/Hide Trending */
div[aria-label*=”Timeline: Trending now”] {display:flex !important;}
}
なお、動作不具合や表示がおかしいなどの責任は持てません。
(自分用に使っているものなので・・・(汗))
ダウンロードはあくまで自己責任でお願いいたします。
コメント