Решено Роли CRMP ONLINE

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
Статус
В этой теме нельзя размещать новые ответы.
Пользователь
Регистрация
15 Май 2025
Сообщения
15
3.1. Заголовок темы должен отражать основную суть темы.
как такое сделать?
IMG_20251217_230730.jpg
(Чек роли руководитель проекта)
 
Решение
@AIT Pestoletov, в роли видишь обводку? Мне такую надо
Код:
.banner-base {
      padding: 6px 12px 8px;
      border-radius: 12px;
      font-size: 13px;
      line-height: 1;
      position: relative;
      color: white !important;
      font-weight: 800 !important;
      text-transform: uppercase !important;
      letter-spacing: 0.8px;
      background-size: 400% 400%;
    }

    
    .banner-1 {
      border: 2px solid #8a2be2;
      box-shadow:
        0 0 12px rgba(138, 43, 226, 0.7),
        0 0 25px rgba(138, 43, 226, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(138, 43, 226, 0.8);
      background: linear-gradient(45deg, #8a2be2 0%...
Пользователь
Регистрация
17 Авг 2025
Сообщения
175
привет, вот похожие баннеры брал с примера баннера Даговский



Код:
.banner-base {
  padding: 6px 12}px 8px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1;
  position: relative;
  color: white !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(138, 43, 226, 0.8);
  box-shadow: 0 0 12px rgba(138, 43, 226, 0.7), 0 0 25px rgba(148, 0, 211, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  background-size: 400% 400%; 
}


.banner-1 {
  @extend .banner-base;
  border: 2px solid #8a2be2;
  background: linear-gradient(45deg, #8a2be2 0%, #4b0082 20%, #000 40%, #9400d3 60%, #8a2be2 80%, #4b0082 100%);
}


.banner-2 {
  @extend .banner-base;
  border: 2px solid #00b4d8;
  background: linear-gradient(45deg, #0077b6, #00b4d8, #90e0ef, #0077b6, #0096c7);
  box-shadow: 0 0 12px rgba(0, 180, 216, 0.7), 0 0 25px rgba(0, 150, 199, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(0, 180, 216, 0.8);
}


.banner-3 {
  @extend .banner-base;
  border: 2px solid #ff6b35;
  background: linear-gradient(45deg, #ff6b35, #f7931e, #ff3b00, #ff6b35, #f7931e);
  box-shadow: 0 0 12px rgba(255, 107, 53, 0.7), 0 0 25px rgba(247, 147, 30, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(255, 107, 53, 0.8);
}


.banner-4 {
  @extend .banner-base;
  border: 2px solid #2ecc71;
  background: linear-gradient(45deg, #27ae60, #2ecc71, #1abc9c, #27ae60, #16a085);
  box-shadow: 0 0 12px rgba(46, 204, 113, 0.7), 0 0 25px rgba(39, 174, 96, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(46, 204, 113, 0.8);
}


.banner-5 {
  @extend .banner-base;
  border: 2px solid #e91e63;
  background: linear-gradient(45deg, #e91e63, #f06292, #ec407a, #d81b60, #ad1457);
  box-shadow: 0 0 12px rgba(233, 30, 99, 0.7), 0 0 25px rgba(216, 27, 96, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(233, 30, 99, 0.8);
}


.banner-6 {
  @extend .banner-base;
  border: 2px solid #005f73;
  background: linear-gradient(45deg, #005f73, #0a9396, #94d2bd, #005f73, #003d4d);
  box-shadow: 0 0 12px rgba(0, 95, 115, 0.7), 0 0 25px rgba(10, 147, 150, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(0, 95, 115, 0.8);
}


.banner-7 {
  @extend .banner-base;
  border: 2px solid #ff9800;
  background: linear-gradient(45deg, #ff9800, #ffb300, #ff6f00, #f57c00, #e65100);
  box-shadow: 0 0 12px rgba(255, 152, 0, 0.7), 0 0 25px rgba(245, 124, 0, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(255, 152, 0, 0.8);
}


.banner-8 {
  @extend .banner-base;
  border: 2px solid #b00020;
  background: linear-gradient(45deg, #b00020, #d32f2f, #f44336, #c62828, #880e4f);
  box-shadow: 0 0 12px rgba(176, 0, 32, 0.7), 0 0 25px rgba(198, 40, 40, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(176, 0, 32, 0.8);
}


.banner-9 {
  @extend .banner-base;
  border: 2px solid #9c27b0;
  background: linear-gradient(45deg, #9c27b0, #e040fb, #7b1fa2, #ba68c8, #6a1b9a);
  box-shadow: 0 0 12px rgba(156, 39, 176, 0.7), 0 0 25px rgba(123, 31, 162, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(156, 39, 176, 0.8);
}


.banner-10 {
  @extend .banner-base;
  border: 2px solid #2196f3;
  background: linear-gradient(45deg, #2196f3, #03a9f4, #00bcd4, #2196f3, #0288d1);
  box-shadow: 0 0 12px rgba(33, 150, 243, 0.7), 0 0 25px rgba(2, 136, 209, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(33, 150, 243, 0.8);
}


.banner-11 {
  @extend .banner-base;
  border: 2px solid #00c853;
  background: linear-gradient(45deg, #00c853, #69f0ae, #009688, #00796b, #004d40);
  box-shadow: 0 0 12px rgba(0, 200, 83, 0.7), 0 0 25px rgba(0, 150, 136, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(0, 200, 83, 0.8);
}


.banner-12 {
  @extend .banner-base;
  border: 2px solid #3f51b5;
  background: linear-gradient(45deg, #3f51b5, #5c6bc0, #7986cb, #303f9f, #1a237e);
  box-shadow: 0 0 12px rgba(63, 81, 181, 0.7), 0 0 25px rgba(48, 63, 159, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(63, 81, 181, 0.8);
}


.banner-13 {
  @extend .banner-base;
  border: 2px solid #d84315;
  background: linear-gradient(45deg, #d84315, #ff7043, #f4511e, #bf360c, #8d2b0b);
  box-shadow: 0 0 12px rgba(216, 67, 21, 0.7), 0 0 25px rgba(191, 54, 12, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(216, 67, 21, 0.8);
}


.banner-14 {
  @extend .banner-base;
  border: 2px solid #ff4081;
  background: linear-gradient(45deg, #ff4081, #f50057, #f06292, #e91e63, #c2185b);
  box-shadow: 0 0 12px rgba(255, 64, 129, 0.7), 0 0 25px rgba(229, 30, 99, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(255, 64, 129, 0.8);
}


.banner-15 {
  @extend .banner-base;
  border: 2px solid #880e4f;
  background: linear-gradient(45deg, #880e4f, #b71c1c, #c62828, #880e4f, #5d001e);
  box-shadow: 0 0 12px rgba(136, 14, 79, 0.7), 0 0 25px rgba(183, 28, 28, 0.5), inset 0 0 8px rgba(0, 0, 0, 0.7);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 6px rgba(136, 14, 79, 0.8);
}
 
Пользователь
Регистрация
17 Авг 2025
Сообщения
175
@AIT Pestoletov, в роли видишь обводку? Мне такую надо
Код:
.banner-base {
      padding: 6px 12px 8px;
      border-radius: 12px;
      font-size: 13px;
      line-height: 1;
      position: relative;
      color: white !important;
      font-weight: 800 !important;
      text-transform: uppercase !important;
      letter-spacing: 0.8px;
      background-size: 400% 400%;
    }

    
    .banner-1 {
      border: 2px solid #8a2be2;
      box-shadow:
        0 0 12px rgba(138, 43, 226, 0.7),
        0 0 25px rgba(138, 43, 226, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(138, 43, 226, 0.8);
      background: linear-gradient(45deg, #8a2be2 0%, #4b0082 20%, #000 40%, #9400d3 60%, #8a2be2 80%, #4b0082 100%);
    }

    .banner-2 {
      border: 2px solid #00b4d8;
      box-shadow:
        0 0 12px rgba(0, 180, 216, 0.7),
        0 0 25px rgba(0, 180, 216, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(0, 180, 216, 0.8);
      background: linear-gradient(45deg, #0077b6, #00b4d8, #90e0ef, #0077b6, #0096c7);
    }

    .banner-3 {
      border: 2px solid #ff6b35;
      box-shadow:
        0 0 12px rgba(255, 107, 53, 0.7),
        0 0 25px rgba(255, 107, 53, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(255, 107, 53, 0.8);
      background: linear-gradient(45deg, #ff6b35, #f7931e, #ff3b00, #ff6b35, #f7931e);
    }

    .banner-4 {
      border: 2px solid #2ecc71;
      box-shadow:
        0 0 12px rgba(46, 204, 113, 0.7),
        0 0 25px rgba(46, 204, 113, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(46, 204, 113, 0.8);
      background: linear-gradient(45deg, #27ae60, #2ecc71, #1abc9c, #27ae60, #16a085);
    }

    .banner-5 {
      border: 2px solid #e91e63;
      box-shadow:
        0 0 12px rgba(233, 30, 99, 0.7),
        0 0 25px rgba(233, 30, 99, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(233, 30, 99, 0.8);
      background: linear-gradient(45deg, #e91e63, #f06292, #ec407a, #d81b60, #ad1457);
    }

    .banner-6 {
      border: 2px solid #005f73;
      box-shadow:
        0 0 12px rgba(0, 95, 115, 0.7),
        0 0 25px rgba(0, 95, 115, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(0, 95, 115, 0.8);
      background: linear-gradient(45deg, #005f73, #0a9396, #94d2bd, #005f73, #003d4d);
    }

    .banner-7 {
      border: 2px solid #ff9800;
      box-shadow:
        0 0 12px rgba(255, 152, 0, 0.7),
        0 0 25px rgba(255, 152, 0, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(255, 152, 0, 0.8);
      }

    .banner-8 {
      border: 2px solid #b00020;
      box-shadow:
        0 0 12px rgba(176, 0, 32, 0.7),
        0 0 25px rgba(176, 0, 32, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(176, 0, 32, 0.8);
      background: linear-gradient(45deg, #b00020, #d32f2f, #f44336, #c62828, #880e4f);
    }

    .banner-9 {
      border: 2px solid #9c27b0;
      box-shadow:
        0 0 12px rgba(156, 39, 176, 0.7),
        0 0 25px rgba(156, 39, 176, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(156, 39, 176, 0.8);
      background: linear-gradient(45deg, #9c27b0, #e040fb, #7b1fa2, #ba68c8, #6a1b9a);
    }

    .banner-10 {
      border: 2px solid #2196f3;
      box-shadow:
        0 0 12px rgba(33, 150, 243, 0.7),
        0 0 25px rgba(33, 150, 243, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(33, 150, 243, 0.8);
      background: linear-gradient(45deg, #2196f3, #03a9f4, #00bcd4, #2196f3, #0288d1);
    }

    .banner-11 {
      border: 2px solid #00c853;
      box-shadow:
        0 0 12px rgba(0, 200, 83, 0.7),
        0 0 25px rgba(0, 200, 83, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(0, 200, 83, 0.8);
      background: linear-gradient(45deg, #00c853, #69f0ae, #009688, #00796b, #004d40);
    }

    .banner-12 {
      border: 2px solid #3f51b5;
      box-shadow:
        0 0 12px rgba(63, 81, 181, 0.7),
        0 0 25px rgba(63, 81, 181, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(63, 81, 181, 0.8);
      background: linear-gradient(45deg, #3f51b5, #5c6bc0, #7986cb, #303f9f, #1a237e);
    }

    .banner-13 {
      border: 2px solid #d84315;
      box-shadow:
        0 0 12px rgba(216, 67, 21, 0.7),
        0 0 25px rgba(216, 67, 21, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(216, 67, 21, 0.8);
      background: linear-gradient(45deg, #d84315, #ff7043, #f4511e, #bf360c, #8d2b0b);
    }

    .banner-14 {
      border: 2px solid #ff4081;
      box-shadow:
        0 0 12px rgba(255, 64, 129, 0.7),
        0 0 25px rgba(255, 64, 129, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(255, 64, 129, 0.8);
      background: linear-gradient(45deg, #ff4081, #f50057, #f06292, #e91e63, #c2185b);
    }

    .banner-15 {
      border: 2px solid #880e4f;
      box-shadow:
        0 0 12px rgba(136, 14, 79, 0.7),
        0 0 25px rgba(136, 14, 79, 0.5),
        inset 0 0 8px rgba(0, 0, 0, 0.7);
      text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.9),
        0 0 6px rgba(136, 14, 79, 0.8);
      background: linear-gradient(45deg, #880e4f, #b71c1c, #c62828, #880e4f, #5d001e);
    }
 
Статус
В этой теме нельзя размещать новые ответы.
Сверху