Оживляем кнопки форума

[Untitled]

За пример взял красивую 2д трансформацию. Итак начнем.

Заходим в шаблон Extra.css и добавляем

/* Pulse Grow */

@-webkit-keyframes pulse-grow {
to {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}

@keyframes pulse-grow {
to {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
}

.pulse-grow {
display: inline-block;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pulse-grow:hover {
-webkit-animation-name: pulse-grow;
animation-name: pulse-grow;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate;
}

/* End Pulse Grow */

Теперь применяем данный css ховер для кнопки "Создать тему". Идем в шаблон forum_view и находить строку

<xen:set var="$newDiscussionButton"><a href="{xen:link 'forums/create-thread', $forum}" class="callToAction"><span>{xen:phrase post_new_thread}</span></a></xen:set>

заменяем ее на

<xen:set var="$newDiscussionButton"><a href="{xen:link 'forums/create-thread', $forum}" class="pulse-grow callToAction"><span>{xen:phrase post_new_thread}</span></a></xen:set>

И ещё одна строчка в этом же шаблоне, находим

<a href="{xen:link 'forums/create-thread', $forum}" class="callToAction"><span>{xen:phrase post_new_thread}</span></a>

заменяем на

<a href="{xen:link 'forums/create-thread', $forum}" class="pulse-grow callToAction"><span>{xen:phrase post_new_thread}</span></a>

У меня на форуме все кнопки форума под этим эффектом. Помогу с добавлением для других кнопок форума.

 

[Skaiman]

А скриншот? Посмотреть хочется результат.

 

[Untitled]

Skaiman,

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

здесь посмотрите демо pulse grow

 

[xsacha]

Ну а как выглядят на форуме посмотреть та можно ? И это актуально для всех версий или только последних XF ?

 

[Skaiman]

И это актуально для всех версий или только последних XF

:) это актуально вообще для любого движка.

 

[Kolya groza morey]

Я бы всьо таки делал бы такие изменения через модификацию. А то после обновления шаблона всё исчезнет

 

[Untitled]

Kolya groza morey, экспортируем шаблон перед обновлением, обновляемся и импортируем обратно. Ничего не удалится.

xsacha, я дал ссылку на ховер эффекты, где этот эффект есть. Там есть кнопка с эффектом pulse grow. Наведите и вы увидите результат.

 

[Skaiman]

А еще лучше, создать дополнение и все это объединить в нем, но это не реально всем внушить, пока не наделают своих ошибок :-) ни кто не будет применять TMS.

Kolya groza morey, экспортируем шаблон перед обновлением, обновляемся и импортируем обратно. Ничего не удалится.

И зачем заниматься такими глупостями если уже все предусмотрено :-)

 

[Kolya groza morey]

обновляемся и импортируем обратно.

Тогда зачем обновлять? Лучше тогда уж делать дочерний стиль и его правит как душе угодно

 

[Untitled]

Kolya groza morey, увидеть новые функции? Кэп? По факту, кто-то правит основной стиль, кто-то создает дочерний.

 

[xsacha]

А кто то делает модификация, вариантов море, кто на что гаразд.

 

[Skaiman]

Честно сказать. я б запретил выкладывать модификации в таком виде, только в дополнении или с подробным указанием создания модификации шаблонов.

Но опять же, простые модификации, не дают возможности сделать настройки, а в дополнении это можно.

экспортируем шаблон перед обновлением, обновляемся и импортируем обратно

К стати, такой способ не очень хорош, если в новой версии движка были внесены изменения в этом шаблоне дефолтного стиля, а у вас используется дефолтный стиль.

 

[MC_Mike]

А еще лучше, создать дополнение и все это объединить в нем

А я до этого сам додумался:cool: Удобно!:thumbsup:

 

[kaz]

Не работает.

 

[Untitled]

kaz, что у Вас не работает? До сих пор все кнопки форума с эффектом pulse.

 

[kaz]

Untitled, не работает эффект. Как были кнопки, так и остались. Модификации создал, код в css прописал.

 

[Untitled]

kaz, если у Вас 1.5 версия, то может там код в шаблонах изменился. Так что посмотрите в самом шаблоне правильный ли код в модификации указали.

 

[kaz]

Untitled, посмотрел код, всё, как и должно быть. Модификации применились к Мастер-стилю, всё норм.

 

[xsacha]

Все работает на XF 1.5 проверил, просто когда создаете модификация поставьте очередь выполнения 5, по умолчанию стоит 10 и она не отрабатывает.
Единственное скажу сразу, при увеличении надпись на кнопки размазывается и справа чуть сризается css.

 

[Untitled]

xsacha, что там справа? :O_o: