cyb/src/features/cybernet/ui/pages/Main/Banner/Banner.module.scss

ฯ€ 0.0% 132 words ยท 1 min 
.banner {
  display: flex;
  position: relative;
  justify-content: center;

  h1,
  h2 {
    font-weight: 400;
  }
  h1 {
    color: var(--pink);
    font-size: 42px;
    align-self: flex-end;

    position: absolute;
    right: 50px;
    bottom: 15px;
  }

  h2 {
    font-size: 20px;
    position: absolute;
    left: 0;
    z-index: 1;
    top: 30px;

    color: var(--green-light);
    align-self: flex-start;
  }
}

.center {
  align-self: center;
  position: relative;
  display: flex;

  $size: 195px;

  min-height: $size;

  > img {
    @keyframes appear {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }

    animation: appear 1500ms ease-out;
    position: absolute;
    top: 0;
    height: 100%;
    left: calc(50% - #{$size} / 2);
    bottom: 0;
  }
}

.rewardsBlock {
  display: flex;
  align-self: center;
  margin: auto;
  flex-direction: column;
  position: relative;
  z-index: 1;
  top: 10px;

  span {
    font-size: 40px;
    text-shadow: 0 0 10px #ffffff;
  }

  .rewardsText {
    font-size: 16px;
    align-self: flex-end;
  }
}

Neighbours