lila/ui/bits/css/forum/_post.scss

.forum-post {
  font-size: 1.1em;
  border-top: $border;
  padding: 0.5rem 0 0.5rem 0;

  &__metas {
    > div {
      @extend %flex-center;

      flex: 1;
    }

    .author {
      color: $c-font-dim;
      font-weight: bold;
      font-size: 1.1em;
      margin-inline-end: 1rem;
    }

    a.author--op {
      @extend %box-radius;

      padding: 0.2em;
      padding-inline-end: 0.8em;
      background: $m-primary_bg--mix-12;
    }

    &__actions {
      @extend %flex-center-nowrap;
    }

    time {
      margin-inline-end: 1em;
    }
  }

  &:hover .forum-post__button {
    visibility: visible;
  }

  &:last-child {
    border-bottom: $border;
  }

  &__message a {
    overflow-wrap: anywhere;
  }

  &.erased {
    color: $c-font-dimmer;

    .forum-post__message {
      font-style: italic;
      text-align: center;
      margin-bottom: 2em;
    }

    .forum-post__metas {
      justify-content: flex-end;
    }
  }

  &__blocked {
    .forum-post__message {
      display: none;
    }

    > button {
      margin: 2em;
    }
  }

  .edit-buttons {
    text-align: right;
    margin-top: 0.5em;
  }

  .edit-buttons a {
    margin-inline-end: 1em;
  }

  .edit-post-form {
    margin-top: 1.5em;

    textarea {
      width: 100%;
      height: 20em;
    }
  }
}

.button.forum-post__button {
  @media (hover: hover) {
    visibility: hidden;
  }

  font-size: 0.9em;
  color: $c-font;

  &:hover {
    color: $c-primary;

    &.delete {
      color: $c-bad;
    }
  }

  &.postip {
    margin-inline-start: 1rem;
    max-width: 50vw;
    overflow: hidden;
    display: none;

    @media (min-width: at-least($small)) {
      display: block;
    }
  }
}

.forum-post__message {
  @extend %break-word, %zalgoverflow;

  p {
    margin-block: 0;
  }

  margin-top: 1em;
  margin-bottom: 1em;
  text-align: start;

  .lpv {
    margin: $block-gap auto;
  }

  .embed:not(img) {
    @extend %video;

    margin: $block-gap auto;
  }

  .twitter-tweet {
    color-scheme: normal;
  }

  .hidden-quotes {
    color: transparent;
    display: inline-block;
    width: 0;
  }

  img {
    max-width: 100%;
  }
}

.forum-post__message-source {
  display: none;
}

.comment-preview {
  font-size: 1.1rem;
}

.forum-topic .forum-post__message,
.forum-topic .comment-preview {
  @include rendered-markdown(1em, 1600px);
  @include rendered-markdown-code;
  @include rendered-markdown-quote;
  @include rendered-markdown-img;
  @include rendered-markdown-embed;

  blockquote {
    padding: 0 0.7em;
    border-left: 0.3em solid;
    unicode-bidi: plaintext;
    position: relative;
  }
}