Помогите разобраться с css

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО InstantCMS 2.X
#1 5 июня 2020 в 12:49
Друзья, есть необходимость скрывать в некоторых типах контента при определенной ширине элементы, с шириной понятно, а как сделать так что бы это касалось определенной страницы например главной, news и тд (положительные, отрицательные маски)

Вот есть код css

@media screen and (min-width: 991px) {
.filter-panel .filter-container{
display:none;
}
}

где и как указывать страницы, (положительные маски)

Спасибо
#2 5 июня 2020 в 13:27
Ну, в таблице стилей это точно не сделать). Как вариант, вы можете в шаблоне получать адрес страницы или slug(часть адреса) или тип контента и в зависимости от этого присвоить нужные классы. А уж в них прописать, что надо).
#3 5 июня 2020 в 13:33
а еще можно HTML виджеты в определенных местах повставлять, например открывающий <div class="home">, а ниже закрывающий </div>. Но не всегда удастся обернуть желаемый блок, да еще нарушите верстку. Так можно обернуть несколько виджетов в один блок
#4 5 июня 2020 в 13:39
  1. if ($_SERVER["REQUEST_URI"] == "/" OR $_SERVER["REQUEST_URI"] == "/index.php"){
  2. $body_class = 'home';
  3. } else {
  4. $urlarr = explode('/',$_SERVER["REQUEST_URI"]);
  5. $body_class = $urlarr[1];
  6. $urlarr1 = explode('?',$urlarr[1]);
  7. $urlarr2 = explode('.',$urlarr1[0]);
  8. $body_class = $urlarr2[0];
  9. }
  1. <body id="<?php echo $device_type; ?>_device_type" class="<?php echo $body_class; ?>">
А вот вариант, про который писал Lora. Вносим правки в main.tpl.php
#5 5 июня 2020 в 13:45
@Happy2019, В дизайн-системе, которую вы используете, для этих целей предусмотрены спец. классы в <body>
На нужной странице нажмите F12. В body найдете нужный класс
Смотрите пример на скриншоте

по ссылке качество изображения лучше https://ibb.co/4N1gv7s

для главной страницы будет класс home_page

в начало своего кода добавьте .home_page

  1. @media screen and (min-width: 991px) {
  2. .home_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
для страницы список объявлений будет класс class_board_page

в начало своего кода добавьте .class_board_page

  1. @media screen and (min-width: 991px) {
  2. .class_board_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
для страницы самого объявления будет класс class_board_page class_html_page

в начало своего кода добавьте .class_board_page.class_html_page

  1. @media screen and (min-width: 991px) {
  2. .class_board_page.class_html_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
Так по аналогии можно добавить стили для других страниц.
#6 6 июня 2020 в 01:17


@Happy2019, В дизайн-системе, которую вы используете, для этих целей предусмотрены спец. классы в
На нужной странице нажмите F12. В body найдете нужный класс
Смотрите пример на скриншоте

по ссылке качество изображения лучше https://ibb.co/4N1gv7s

для главной страницы будет класс home_page

в начало своего кода добавьте .home_page

  1. @media screen and (min-width: 991px) {
  2. .home_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
для страницы список объявлений будет класс class_board_page

в начало своего кода добавьте .class_board_page

  1. @media screen and (min-width: 991px) {
  2. .class_board_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
для страницы самого объявления будет класс class_board_page class_html_page

в начало своего кода добавьте .class_board_page.class_html_page

  1. @media screen and (min-width: 991px) {
  2. .class_board_page.class_html_page .filter-panel .filter-container{
  3. display:none;
  4. }
  5. }
Так по аналогии можно добавить стили для других страниц.

Red Ray

Спасибо большое! То что нужно!
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.