public/assets/scss/index.scss

@charset "utf-8";

@import "variables";
@import "@rescui/typography/lib/font-jb-sans-auto.css";
@import "@rescui/typography/lib/font-jb-sans-variable.css";
@import "bulma/bulma";
@import "overrides";
@import "navbar";

/* plyr css */
.plyr__poster {
  background-size: cover;
}

.highlight {
  @extend %block;
  font-weight: $weight-normal;
  max-width: 100%;
  overflow: hidden;
  padding: 0;

  pre {
    overflow: auto;
    max-width: 100%;
  }
}

.loader {
  @extend %loader;
}

pre > code {
  tab-size: 2;
}


.thumbnail-container {
  position: relative;
  height: 128px;
  width: 128px;
  overflow: hidden;
}

.guest-author-banderole {
  position: absolute;
  top: 4px;
  left: -30px;
  z-index: 10;
  display: inline-block;
  width: 100px;
  text-align: center;
  padding: 5px 0px;
  color: white;
  transform: rotate(315deg);
  background: #087CFA;
}

.guest-author-badge {
  position: absolute;
  bottom: 0;
  z-index: 10;
  display: inline-block;
  width: 128px;
  text-align: center;
  color: white;
  background: #087CFA;
  left: 0;
  font-size: 0.8rem !important;
}

.channel-hero {
  position: relative;
  img, picture {
    height: 100%;
    object-fit: cover;
    width: 100%;
    position: absolute;
    z-index: -1;
  }
}

.image.is-80px img {
  height: 80px;
  width: auto;
}