lib.itmens/common/static/scss/_sidebar.scss

.sidebar {
  article {
    padding: calc(var(--pico-block-spacing-horizontal));
    article {
      box-shadow: unset;
    }
  }

  details {
    margin-bottom: 0;
  }

  hgroup {
    margin: 0;
    margin-right: 1rem;
  }

  section.announcement {
    p {
      font-size: 80%;
    }

    // details[open]>summary {
    //   margin: 0;
    // }

    details {
      margin-bottom: var(--pico-spacing);
    }
  }

  section.profile {
    summary>div {
      display: grid;
      grid-template-columns: auto 1fr;
      grid-template-rows: auto;
      grid-column-gap: 0.5em;
      grid-row-gap: 0px;
      // align-items: center;
      // justify-content: left;
    }

    summary::after {
      position: relative;
      bottom: calc(2rem * var(--pico-line-height));
    }

    a:hover {
      text-decoration: none;
    }

    .avatar {
      height: calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 4);
      max-height: calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 4);
      max-width: calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 4);

      img {
        height: 100%;
        width: 100%;
      }
    }

    .nickname {
      word-break: break-all;
    }


    .relation {
      width: max-content;
      float: right;
      color: var(--pico-muted-color);
      opacity: 0.5;
      margin-left: 1em;
    }


  }


  @media (max-width: 768px) {

    section,
    >section>article,
    details {
      margin-bottom: 0;
    }
  }
}