Виджет "КНОПКА БАБЛО"

InstantCMS 2.X
#1 5 июня 2020 в 00:19
Нужен виджет "Кнопка бабло"
1. не плоская
2. чтоб стеклянная была с гранями, выпуклая.
3. чтоб можно было выбрать цвет текста на кнопке
4. чтоб можно было указать ссылку куда кнопа ведёт
5. чтоб можно было ввести текст на этой кнопе
6. чтоб можно было выбрать цвет кнопы (выпуклой, стеклянной, с гранями)
7. чтоб можно было выбрать растянуть её на 100% ширины блока или по размеру надписи на кнопке
P.s. По дизайну корочь — она должна быть реально стеклянная чтоб было видно её, чтоб хотелось нажать, моргать перелеваться… я хз как, предлагайте варианты, естественно "бесплатная хотелка".
#2 5 июня 2020 в 00:24
Колян, не проще сгенерировать в любом онлайн-сервисе и вставить в виджет html-блока?

cooltext.com/Logo-Design-Love как пример
#3 5 июня 2020 в 00:34


Колян, не проще сгенерировать в любом онлайн-сервисе и вставить в виджет html-блока?

cooltext.com/Logo-Design-Love как пример

AndroS
Сейчас попробую, отпишу как оно вышло…
#4 5 июня 2020 в 02:17


Колян, не проще сгенерировать в любом онлайн-сервисе и вставить в виджет html-блока?

cooltext.com/Logo-Design-Love как пример

AndroS

Ну выдаёт сервис гифку, ЧО мне с ней делать? Хде сервис?
#5 5 июня 2020 в 02:31

ЧО мне с ней делать?

Колян
Любуйтесь! Красивая же? laugh
Ежели серьезно — для начала загрузите на сайт, потом загуглите "html вставка картинки" и действуйте!

Хде сервис?

Колян
Какой сервис, вы о чем?
Группе, к которой вы принадлежите, запрещено просматривать этот скрытый текст
#6 5 июня 2020 в 11:38

естественно "бесплатная хотелка".

Колян
Почему естественно? ИМХО за такие настройки совсем Не естетственно).
#7 5 июня 2020 в 22:06



Колян, не проще сгенерировать в любом онлайн-сервисе и вставить в виджет html-блока?

cooltext.com/Logo-Design-Love как пример

AndroS

Ну выдаёт сервис гифку, ЧО мне с ней делать? Хде сервис?

Колян
Надо поискать. Натыкался на сервисы, которые генерят не картинку, а HTML код картинки и в нем все параметры, которые вам нужны.
#8 5 июня 2020 в 23:20
Тут много
shpargalkablog.ru/2012/04/css-knopki.html
Скоро будет компонент шорткодами можно любую кнопку ставить в любое место, и не только кнопки
#9 6 июня 2020 в 14:44


Тут много
shpargalkablog.ru/2012/04/css-knopki.html
Скоро будет компонент шорткодами можно любую кнопку ставить в любое место, и не только кнопки

Алексей Тимофеев

Годно, моякните мне как будет готов компонент.
#10 6 июня 2020 в 14:50
  1. В стили -
  2. a.button9 {
  3. position: relative;
  4. display: inline-block;
  5. color: #777674;
  6. font-weight: bold;
  7. text-decoration: none;
  8. text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
  9. user-select: none;
  10. padding: 1em 2em;
  11. outline: none;
  12. border-radius: 3px / 100%;
  13. background-image:
  14. linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
  15. linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
  16. linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
  17. linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
  18. linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
  19. linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
  20. background-repeat: no-repeat;
  21. background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
  22. background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  23. box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
  24. }
  25. a.button9:hover {
  26. transition: .5s linear;
  27. background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  28. }
  29. a.button9:active {
  30. top: 1px;
  31. }
  32. это туда куда надо.
  33. <a href="#" class="button9"> кнопка ,БАБЛО</a>
  34.  
Она стеклянная!
#11 6 июня 2020 в 16:49



Она стеклянная!

Заралик

Щас поглядим как оно)
#12 7 июня 2020 в 21:52

Щас поглядим как оно)

Колян
ну так что?
#13 8 июня 2020 в 16:14


Щас поглядим как оно)

Колян
ну так что?

Заралик

Чтото не похоже на кнопку:(
#14 8 июня 2020 в 16:27
Колян
Колян

Похоже,, если Вы стекло приложите на белый фон, его тоже видно не будет ))). Фон на кнопку сможете добавить?
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.