cyb/src/features/TimeHistory/TimeHistory.module.scss

.rotate {
  --i: -25deg;
  --r: calc(2 * $i);
  --diameter: -21px;
  display: grid;
  grid-area: 1/1;
}

@mixin rotate() {
  transform: rotate(var(--r)) translateX(var(--diameter))
    rotate(calc(-1 * var(--r)));
}

.wrapper {
  text-align: end;
  display: grid;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 15px;
  width: 200px;
  height: 170px;
  padding: 5px 0px 20px 0px;

  position: absolute;
  bottom: 40px;
  // overflow: hidden scroll;
  right: 0vw;

  background-color: rgba(0, 0, 0, 0.5490196078);
  backdrop-filter: blur(7px);
}

// .rotate>div {
//   padding-right: 5px;
// }

.rotate > div:nth-child(1) {
  color: var(--grayscale-disabled);

  & > span {
    margin-right: -5px;
  }
}

.rotate > div:nth-child(2) {
  color: var(--grayscale-dark);
}

.rotate > div:nth-child(3) {
  color: var(--grayscale-secondary);
}

Neighbours