@apexlf

Как залить полу полупрозрачным цветом участок на подобии угла треугольника?

Gv2Su
Есть идеи как можно реализовать как на картинке?
То, что сейчас сделал можно посмотреть онлайн: codepen

Так же дублирую код сюда:
a.link(href="#")
  span tabs discription

$orange: #fe8400;
.link {
  border-left: 5px solid $orange;
  border-top: 2px solid $orange;
  border-bottom: 2px solid $orange;
  display: inline-flex;
  color: #ffffff;
  text-decoration: none;
  font-size: 14px;
  position: relative;
  background-color: rgba($orange, .4);

  span {
    padding: 8px 12px;
    width: 100%;
    position: relative;
    

    &:after,
    &:before {
      content: '';
      position: absolute;
      display: inline-block;
      width: 2px;
      height: 66%;
      background-color: $orange;
      right: -7px;
      top: -3px;
      transform: rotate(-35deg);
    }
    &:before {
      transform: rotate(35deg);
      top: inherit;
      bottom: -3px;
    }
  }
}

body {
  background-color: blue;
}
  • Вопрос задан
  • 50 просмотров
Пригласить эксперта
Ответы на вопрос 2
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы