MrHaim Опубликовано 29 апреля, 2023 Поделиться Опубликовано 29 апреля, 2023 <div class="widget_name"> <!-- You can change name of every widget you add--> <div class=" ipsPad_half"> <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet"> <!-- If you add another button, you need to change the every number from css style, e.g.: .box4 need to change to .box5 to not overwrite--> <style media="screen" type="text/css"> * { font-family: 'Montserrat', sans-serif; } .box4{ position: relative; cursor: pointer; width: 285px; height: 50px; background-color: #8918a7; overflow: hidden; border-radius: 6px; box-shadow: 0 2px 8px 0 rgba(0,0,0,0.3); transition: 400ms ease-in-out; } .shade4{ position: relative; width: 148px; height: 100px; background: #561f76; opacity: 0.5; left: 200px; transform: rotate(135deg); top: -16px; transition: all ease-in-out 500ms; } .boxText4{ position: absolute; font-size: 15px; font-weight: 700; color: white; left: 70px; top: 15px; transition: all ease-in-out 400ms; } .boxJoin4{ z-index: 2; position: absolute; font-size: 17px; font-weight: 700; color: white; opacity: 0; transform: scale(0.3); transition: all ease-in-out 400ms; left: 25px; top: 15px; } .boxLogo4{ position: absolute; font-size: 38px; color: #fff; top: 5px; margin-left: 10px; transition: all ease-in-out 400ms; } #boxArrow4{ z-index: 2; color: white; font-size: 24px; position: absolute; left: 256px; top: 12px; transition: all ease-in-out 400ms; } .box4:hover { box-shadow: 0 6px 8px 0 rgba(0,0,0,0.3); } .box4:hover .shade4{ transform: rotate(90deg); height: 320px; top: -140px; left: 68px; } .box4:hover .boxText4{ top: -48px; } .box4:hover .boxJoin4{ opacity: 1; transform: scale(1); } .box4:hover .boxLogo4{ top: -48px; } .box4:hover #boxArrow4{ transform: translateX(60px); } </style> <div class="box4"> <a href="https://forum.resursele.ro/faq/"> <!-- Link of button--> <i class="fa fa-question-circle boxLogo4"></i> <!-- Icon of button, it is run on Font Awesome Icons only if theme support fontawesome--> <!-- <img class="boxLogo4" src="https://steamstore-a.akamaihd.net/public/shared/images/header/globalheader_logo.png"> --> <span class="boxJoin4">HAVE A QUESTION?</span><!-- Hover text--> <span class="boxText4">F.A.Q</span><!-- Button text--> <i id="boxArrow4" class="fa fa-angle-right"></i> <div class="shade4"> </div> </a> </div> </div> </div> Credit to CristiOprea13 Ishidarex77 и NarcoRP 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Respected Опубликовано 29 апреля, 2023 Поделиться Опубликовано 29 апреля, 2023 MrHaim спасибо конечно за твои старания, но подобный контент не совсем актуален, что эти кнопки, что psd макеты, это лишний шум на форуме. HooLIGUN, MrHaim и ryancoolround 1 1 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
MrHaim Опубликовано 29 апреля, 2023 Автор Поделиться Опубликовано 29 апреля, 2023 1 минуту назад, Respected сказал: MrHaim спасибо конечно за твои старания, но подобный контент не совсем актуален, что эти кнопки, что psd макеты, это лишний шум на форуме. Понял.. пытался помочь, извините Respected и avangcom 1 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
ryancoolround Опубликовано 29 апреля, 2023 Поделиться Опубликовано 29 апреля, 2023 4 часа назад, Respected сказал: MrHaim спасибо конечно за твои старания, но подобный контент не совсем актуален, что эти кнопки, что psd макеты, это лишний шум на форуме. Но это шум. И конечно же ты админ, и тебе решать что да как. Но я был бы очень рад видеть подобные старания у себя на форуме. Это не призыв, это пример. Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 29 апреля, 2023 Поделиться Опубликовано 29 апреля, 2023 Я хотел поделиться кнопкой на профиль вк, когда идет регистрация через вк, то в профиле появляется эта кнопка на профиль) на старых версиях плагин вк кнопки не работал) но наверное теперь не буду.. Иди я что то не так ронял??? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
NarcoRP Опубликовано 6 мая, 2023 Поделиться Опубликовано 6 мая, 2023 Excuse me, can you give me a guide on how to do it in my forum, only this code does not design how to install the forum Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.