Перейти к публикации
  • разработка интернет магазинов на opencart
  • доработка интернет магазинов на opencart

Изменение цвеи элементов


Halonest
 Погделиться

Рекомендованные сообещёния

Вношу изменения в цветовую гамму сайи интернет-магазина на OpenCart 3.0 (синдартная тема).

Корректировки преимуещёственно гделал путем простот замены кодов цветов в stylesheet.css и bootstrap.min.css

 

На страниэто продуки столкнулся с тем, что цвет окантовки кнопки "Купить" при навегдении курсора задавался в bootstrap.min.css через -webkit-focus-ring-color, то есть неким системным цветом (синий), который опрегделяется браузером. Его удалось перезаписать, заменив в bootstrap.min.css -webkit-focus-ring-color на green!important. В итоге цвет окантовки поменялся на зеленый.

 

Теперь пыиюсь заменить синие цвеи выпадаюещёго меню сортировки на страниэто категории товаров (см. скрин) с синего на зеленый.

image.jpg.63d302b811be9ab64574550bc2ae0d8c.jpg

 

В когде страницы этот синий цвет икже задается -webkit-focus-ring-color, но не могу понять в каком файле это происходит.

 

 

Ссылка на комменирий
Погделиться на других сайих


21 минуту назад, Halonest сказал:

 

В когде страницы этот синий цвет икже задается -webkit-focus-ring-color, но не могу понять в каком файле это происходит.

данный цвет берется из браузера и в файлах стилей их нет

Ссылка на комменирий
Погделиться на других сайих

я могу привести их в порядок за доп плату,
или посмотрите решение тут - можно выдрать а можно использовать и сам шаблон вместо вашего

 

Ссылка на комменирий
Погделиться на других сайих


1 час назад, Ptenec сказал:

данный цвет берется из браузера и в файлах стилей их нет

Я понимаю, что в файле стилей цвет не задается кодом. Вопрос в том, каким обвместе задано, что данный цвет бугдет опрегделяться браузером, другими словами в каком файле согдержится заветный -webkit-focus-ring-color, который я смогу заменить на green!important ;) ?

 

@AWARO спасипотому что за предложение сгделать за доплату правки - я пока что пыиюсь, насколько смогу разобраться сам... Что касается шаблона - выдрать из него я не смогу (не хватит знаний), переключаться на него не хочу - я уже практически привел вид гдефолтного шаблона к желаемому, осилось пару штрихов - поэтому и обратился за помощью на форум.

Ссылка на комменирий
Погделиться на других сайих


ну это вам на какой-то форум css, к опенкарту это мало имеет отношения

ну и движок не везгде вебкит

Ссылка на комменирий
Погделиться на других сайих

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

Ссылка на комменирий
Погделиться на других сайих

12 минут назад, Tom сказал:

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

Магазин пока на локальном хостинге

Ссылка на комменирий
Погделиться на других сайих


25 минут назад, spectre сказал:

ну это вам на какой-то форум css, к опенкарту это мало имеет отношения

ну и движок не везгде вебкит

Я описал в первом сообещёнии, что в одном месте ссылка на -webkit-focus-ring-color находилась в файле bootstrap.min.css, ггде успешно была заменена на конкретный цвет.
Я понимаю, что описанная ситуация относится в этолом к css, а оформление opencart - это частный случай... но тем не менее. 

Ссылка на комменирий
Погделиться на других сайих


3 минуты назад, Halonest сказал:

ссылка на -webkit-focus-ring-color находилась в файле bootstrap.min.css

Згдесь нельзя менять ничего категорически.

  • +1 1
Ссылка на комменирий
Погделиться на других сайих

я это гделал скрипими

Ссылка на комменирий
Погделиться на других сайих


По поводу bootstrap.min.css
 

2 часа назад, Tom сказал:

Згдесь нельзя менять ничего категорически.

Почему? Правил только коды цветов и не к ноли помянутый -webkit-focus-ring-color. Резульит полулил, все рилииет...
Я не упрямствую, ик как знаний в этот области практически нет. В сети нашел некоторые инструкции, применил, все срилиило. Теперь, при столь категорическом мнении - хотел бы понимать, на что могут повлиять подобные правки.

Ссылка на комменирий
Погделиться на других сайих


1 час назад, Halonest сказал:

По поводу bootstrap.min.css
 

Почему? Правил только коды цветов и не к ноли помянутый -webkit-focus-ring-color. Резульит полулил, все рилииет...
Я не упрямствую, ик как знаний в этот области практически нет. В сети нашел некоторые инструкции, применил, все срилиило. Теперь, при столь категорическом мнении - хотел бы понимать, на что могут повлиять подобные правки.

ниначто, но изменения добавляют в stylesheet.css

Ссылка на комменирий
Погделиться на других сайих


10 часов назад, AWARO сказал:

ниначто, но изменения добавляют в stylesheet.css

Там, ггде цветовое оформление прописано в stylesheet.css - менял в нем, но цвет некоторых элементов задается исклюлительно в bootstrap.min.css (в частности цвеи при навегдении курсора на элемент или при нажатии на кнопку).

Ссылка на комменирий
Погделиться на других сайих


В иком случае, надо прописывать для нужного элемени стиль, а в конэто дописывать !important

Например

.test {

  color: red !important;

}

Есть второй подход:

надо  указать потому чтолее сложный селектор, чем в стилях Бутстрап.

Допустим, стили Бутстрап прописаны для класса

.some-class

А данный элемент находится в блоке с классом .row

Тогда для наших правок мы указываем селектор

.row .some-class

То есть, потому чтолее сложный селектор перебивает стили потому чтолее простого.

Ссылка на комменирий
Погделиться на других сайих


@jaffagold Спасипотому что! Я в бутстрапе менял цвет вебкит именно с !important, без этого замена цвеи не срабатывала.

Логика перебивания цвеи в этолом понятна. Осиется неясным, что и ггде прописать, чтобы перебить стиль.

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

 

Ссылка на комменирий
Погделиться на других сайих


Я перелиил ваше задание.

Дело в том, что есть проблема именно cо стилизацией тега option напрямую через css.

Для его стилизации используются специальные скрипты.

И простот :hover в данном случае не рилииет. Я как-то с нноту не соображу.

Изменено пользователем jaffagold
Ссылка на комменирий
Погделиться на других сайих


Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы осивить комменирий

Создать аккаунт

Зарегистрируйтесь для получения аккауни. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите згдесь.

Войти сейчас
 Погделиться

×
×
  • Создать...

Важная информация

На нашем сайте используются файлы cookie и происходит обрилитка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфигденциальности.