# kmyblue 自分用管理者カスタムCSS

/*kmyblue 22.2*/

/*==============================
  カウント・リアクション非表示
==============================*/

/*TL上のアクションバーのカウント非表示*/
.icon-button__counter {
  display: none;
}

/*ログインアカウント(自分)がつけた絵文字リアクション以外非表示*/
/*ログインアカウント(自分)以外がつけた絵文字リアクションしか存在しない場合
絵文字リアクションバー非表示*/
.emoji-reactions-bar__button:not(.toggled),
.status__emoji-reactions-bar:not(:has(> .toggled)) {
  display: none;
}

/*投稿詳細ページのステータスバー非表示*/
.detailed-status__meta__line:last-child {
  display: none;
}
/*上記調整*/
.detailed-status__meta__line {
  border-bottom: 0;
  padding: 0;
}

/*====================
  汎用調整
====================*/

/*CW警告文の文字を太く*/
.content-warning > p {
  font-weight: bold;
}

/*TL上のサムネイルのアウトラインを表示*/
.media-gallery .media-gallery__item {
  outline: 1px solid var(--background-border-color);
}

/*リスト、ブックマーク一覧等のボーダー非表示*/
.lists__item {
  border-bottom: 0;
}

/*リスト等が空の時の矢印SVG非表示*/
.empty-column-indicator__arrow {
  display: none;
}

/*設定ページのMastodonロゴを小さく*/
.admin-wrapper .sidebar .logo.logo--icon {
  height: 40px;
  margin: 55px 20px 20px;
  width: 40px;
}

/*====================
  カスタム
====================*/

/*プロフィールページの確認済みリンクの背景を指定しない*/
.account__header__fields .verified {
  background: unset;
}

/*クレジットのスタイル変更*/
.link-footer p strong {
  font-weight: bold;
}
.link-footer p a {
  -webkit-text-decoration: none;
  text-decoration: none;
}
.link-footer p .version {
  font-size: smaller;
}

/*非ログイン時のイントロダクション等非表示*/
.server-banner__introduction,
.sign-in-banner > p {
  display: none;
}

/*メインパネルのタイトルを太字に*/
.column-header {
  font-weight: bold;
}

/*Mastodonロゴのテキストカラーを変更*/
.logo {
  color: lightcoral;
}

/*ナビゲーションパネルの水平線の幅を短く*/
.navigation-panel hr {
  margin: 10px auto;
  width: 90%;
}

/*パネル全体のborder-radiusを丸く*/
.column-header,
.column-back-button {
  border-radius: 8px 8px 0 0;
}
.column > .scrollable {
  border-radius: 0 0 8px 8px;
}
.search__input,
.compose-form__highlightable {
  border-radius: 8px;
}

/*------------------------------
  PCとタブレット時のパネルの順序を反転
------------------------------*/
/*PC*/
@media screen and (min-width: 1175px) {
  .columns-area__panels {
    flex-direction: row-reverse;
  }
}
/*タブレット*/
@media screen and (max-width: 1174px) {
  .columns-area__panels {
    flex-direction: row-reverse;
  }
  .columns-area__panels__pane--navigational .navigation-panel {
    border-inline-start: unset;
    border-inline-end: 1px solid var(--background-border-color);
  }
}
/*モバイルで元に戻す*/
@media screen and (max-width: 759px) {
  .columns-area__panels {
    flex-direction: unset;
  }
  .columns-area__panels__pane--navigational .navigation-panel {
    border-inline-start: 1px solid var(--background-border-color);
    border-inline-end: unset;
  }
}

/*====================
  カラム余白
====================*/

/*カラム全体の余白調整*/
@media screen and (min-width: 1175px) {
  .columns-area__panels {
    gap: 32px;
  }
  .tabs-bar__wrapper {
    padding-top: 10px;
  }
  .columns-area--mobile {
    padding: 0 0 20px;
  }
  /*PC時のナビゲーションパネルの左余白を0に*/
  /*.column-link--logo,
  .column-link {
    padding-left: 0;
  }*/
}
.compose-panel {
  height: calc(100% - 20px);
  margin-top: 20px;
}
.navigation-panel {
  margin-top: 20px;
}
.getting-started__trends {
  margin-bottom: 10px;
}