Стили для кнопки

Question

Стили для кнопки

28 февраля 2018

1

Добрый день!

Подскажите, какому классу нужно прописать стиль, чтобы изменить цвет одной конкретной кнопке "вернуться в магазин", а именно - той, что появляется на странице после оформления заказа?

(и если нет отдельного класса именно для этой кнопки, как его создать)

Спасибо

1 ответ

stiltron

Решение

1 марта 2018 21:57

1

Отлично! Большое спасибо

ответить

Добавить ответ

Владимир Сергеев · Answer 1

Сама кнопка находится в теме для Магазина в файле checkout.success.html
Вот так выглядит её код:

<a href="{$wa_app_url}" class="button"><i class="fa fa-shopping-cart" style="margin-right: 8px;"></i> [`Back to the store`]</a>

Если хотите, чтобы она тоже стала серой, то добавьте ей класс gray.
Например так:

<a href="{$wa_app_url}" class="button gray"><i class="fa fa-shopping-cart" style="margin-right: 8px;"></i> [`Back to the store`]</a>

Также есть ещё прозрачные кнопки.
Чтобы сделать кнопку прозрачной, но при наведении серой, добавьте класс: highlight:

<a href="{$wa_app_url}" class="button highlight"><i class="fa fa-shopping-cart" style="margin-right: 8px;"></i> [`Back to the store`]</a>

Ну, а чтобы свои цвета прописать, добавьте ей свой класс. Например custom_button:

<a href="{$wa_app_url}" class="button custom_button"><i class="fa fa-shopping-cart" style="margin-right: 8px;"></i> [`Back to the store`]</a>

А затем в блоке prostore.user_css нужно прописать следующий стили для этой кнопки:

/**/
.button.custom_button {
    background: /* цвет фона в нормальном состоянии */;
    color: /* цвет текста в нормальном состоянии */;
}
/* HOVER */
.button.custom_button:hover {
    background: /* цвет фона при наведении */;
    color: /* цвет текста в при наведении */;
}
/* ACTIVE */
button.custom_button:active {
    background: /* цвет фона при нажатии */;
    color: /* цвет текста при нажатии */;
}

Всё что в /* комментариях */ замените на свои коды цветов в HEX-формате.
HEX-генератор цветов.