Адаптивный дизайн взлома на промежуточной площадке - PullRequest
0 голосов
/ 06 ноября 2019

Я настраиваю промежуточный сайт для тестирования изменений перед их запуском, но адаптивный дизайн сценического сайта не работает.

Я деактивировал все свои плагины, но адаптивный дизайн по-прежнему не работаетработа на сцене сайта.

Я создал новую локальную копию исходного сайта и добавил плагины один за другим, и адаптивный дизайн сработал, поэтому плагины не сломали его.

Я считаю, что я сузилсяПерейдите от проблемы к проблеме, которая возникает в коде очереди в файле functions.php, расположенном в каталоге дочерней темы

function add_theme_scripts() {

    $parent_style = 'Karma'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'Karma-child',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );

    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);

   if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
     wp_enqueue_script( 'comment-reply' );
   }
}

add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );

Вот действующий сайт: www.alliancechemical.com

ВотСайт этапа: www.alliancechemical.com/staging

Я ожидаю, что когда разрешение экрана станет меньше на мобильной территории, медиа-запрос точки останова вступит в силу и внесет коррективы в CSS.

1 Ответ

1 голос
/ 06 ноября 2019

На вашем живом сайте ваши CSS-файлы темы имеют версию 4.7.15 и на вашей стадии 5.2.4, и они меняют порядок селекторов.

Css на #main при подготовке:

#main.tt-slider-karma-custom-jquery-2 {
    margin-top: -189px;
}
@media only screen and (max-width: 1023px)
#main.tt-slider-karma-custom-jquery-2 {
    margin-top: -157px; //Disabled
}

Css on #main on live:

#main.tt-slider-karma-custom-jquery-2 {
    margin-top: -157px; 
}
#main.tt-slider-karma-custom-jquery-2 {
    margin-top: -189px; //Disabled
}

Решение состоит в том, чтобы отменить регистрацию мобильного CSS и затем снова поставить его в очередь с темой CSS в качестве зависимости.

...