mastodon-stylus.css

/* ***********************************************
  Styles for Mastodon

  Adapted from different sources
  - https://write.as/panais/styles-pour-mastodon-avec-stylus
  - https://mastodon.social/@matuzo/109284559864791077
  - https://mastodon.social/@matuzo/109284628517006156
  - https://gist.github.com/justmarkup/e4f6d52bef604e170815aaf44f459fbc
*********************************************** */

/* Private messages */

:root {
  --r: 160;
  --g: 0;
  --b: 0;
}

.status__wrapper-direct {
  background: rgba(var(--r), var(--g), var(--b), .1);
}

.status-direct .fa-envelope {
  color: rgba(var(--r), var(--g), var(--b), .6);
}

.status__wrapper-direct {
  padding-inline-end: 20px;
}

.status__wrapper-direct::after {
  content: "private";
  background-color: rgba(var(--r), var(--g), var(--b), .3);
  display: inline-block;
  padding: 0rem 0.2rem;
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: 0;
  writing-mode: vertical-rl;
  height: 100%;
  text-align: center;
  border-bottom: 1px solid rgba(var(--r), var(--g), var(--b), .5);
}

/* Account header image */

.account__header__image {
  aspect-ratio: 16 / 9;
  height: auto;
}

/* More space for feed column */
/*
.columns-area {
  display: grid !important;
  grid-template-columns: 3fr 4fr 3fr 3fr 3fr;
}
.drawer,
.column {
  width: 100% !important;
}
*/