Streamにアクセスするボタンを表示するCSS

from Settings

https://gyazo.com/1b9b7a755979205bef942b302d2b4e88

右上に(Streamページへのリンクボタン)を表示する

/customize/Streamにアクセスするボタンを表示するCSS

右上の波々ボタンは何？

更新ログ

2024-05-01 19:56:12 デザイン変更に対応

2024-02-23

/per-terra/Streamボタンを表示する

セレクターをapp.cssに合わせた

位置を調整した

navbar周りのUserCSSの再設計#65cc767bffff360000c98e4c

code:style.css

.navbar .navbar-menu > li.stream-btn {

display: block !important;

a { color: var(--navbar-icon-color, #fff); }

}

!importantなしで書けないかな？takker.icon

一応やってみたbsahd.icon

code:_style.css

.navbar .navbar-menu > li.stream-btn.hidden-xs {

display: block;

a { color: var(--navbar-icon-color, #fff); }

}

767px以下で非表示になってるけど意図したものなのか？per_terra.icon

@mediaと衝突してるのかな(今PCないので調べられない)takker.icon

ご推察の通り.hidden-xsがメディアクエリ内で定義されていますper_terra.icon

あれ、display: none !importantってことはやっぱ!important要るじゃん

終.icontakker.icon

真面目な調査なしでも.navbar.navbar.navbar.navbar.navbar.navbar.navbar .navbar-menu > li.stream-btnみたいな書き方して無理やり詳細度上げたら必要なくなるMijinko_SD.icon

強引で草takker.icon

重複判定しないんかい

そこは仕様の闇bsahd.icon

https://developer.mozilla.org/ja/docs/Web/CSS/Specificity#セレクターの複製による詳細度の向上闇なのか？

app.cssに合わせて上書きすれば!importantを使う必要はないのだけど、.hidden-xsの上書きはどう考えても!importantだろと思ったのでそうしているper_terra.icon

.navbar .navbar-menu > li.stream-btnだとシンプルだし

!importantを上書きしなければならないので使っていたのを思い出した Streamにアクセスするボタンを表示するCSS#6633970fffff36000092d315

code:app.css

@media(max-width: 767px) {

.hidden-xs {

display:none !important

}

色を変える

井戸端クリスマスモードUserCSSに同様の記述があるので不要

code:_style.css

htmldata-assets-version^="assets-202212" .quick-launch .project-home, .kamon-activity:before {

color: hsl(39.7, 93.7%, 56.7%);

}

Settings.icon

UserCSS.icon