new logic yets and moread

blocks/moread.php

@@ -1,7 +1,7 @@
 <?php
 
 $posts = get_posts( array(
-	'numberposts' => 4,
+	'numberposts' => 6,
 	'category'    => 2, // пока тольео события
 	'orderby'     => 'date',
 	'order'       => 'DESC',
@@ -21,16 +21,18 @@ $posts = get_posts( array(
 ) );
 
 # вывод поста
-if( $posts ):?>
+if( $posts ):
+    $nr = 0;?>
 
     <div class="moread_rubric">Читайте также:</div>
 
     <div class="moread">
       
         <?php foreach($posts as $post):
+            $nr++;
             setup_postdata( $post );?>
     
-        <div class="moread_card">
+        <div class="moread_card" id="moread_<?=$nr?>">
             <img src="<?php echo get_the_post_thumbnail_url($post);?>" alt="<?the_title();?>">
             <div class="moread_title"><a href="<?php the_permalink(); ?>"><?php the_title();?></a></div>
             <div class="moread_date"><?the_time('j F Y, G:i');?></div>

blocks/yets.php

@@ -1,5 +1,5 @@
 <?php $posts = get_posts( array(
-	'numberposts' => 4,
+	'numberposts' => 6,
 	'category'    => $category_id, // текущая рубрика
 	'orderby'     => 'date',
 	'order'       => 'DESC',
@@ -13,7 +13,9 @@
 ) );
 
 # вывод поста
-if( $posts ):?>
+if( $posts ):
+
+    $nn = 0;?>
     
     
     <div class="yets_rubric"><?=vij_lang('more', LANG_VERSION)?></div>
@@ -21,9 +23,10 @@ if( $posts ):?>
     <div class="yets">
       
         <?php foreach($posts as $post):
-            setup_postdata( $post );?>
+            setup_postdata( $post );
+            $nn++;?>
     
-        <div class="yet_card">
+        <div class="yet_card" id="yets-<?=$nn?>">
             <div class="yet_title"><a href="<?php the_permalink(); ?>"><?php the_title();?></a></div>
         </div>   
 

header.php

@@ -10,7 +10,7 @@
         <?if (defined('TESTMODE') and TESTMODE == 1):?>
             <link rel="stylesheet" href="<?php echo get_template_directory_uri();?>/style-test.css?ver=3">
         <?else:?>    
-            <link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>?ver=277">
+            <link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>?ver=278">
         <?endif?>   
         <link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet">
         <!--<link href="<?php echo get_stylesheet_directory_uri()?>/pub/fontawesome.css" rel="stylesheet">-->

style.css

@@ -1679,15 +1679,12 @@ a{
 
 .moread{
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
   grid-gap: 2rem; 
   margin-top: 8px;
   margin-bottom: 28px;
 }
 
-  .moread_card{
-    
-  }
 
   .moread_rubric{
     padding-top: 28px;
@@ -1765,7 +1762,7 @@ a{
 .yets{
   display: grid;
   grid-gap: 1rem; 
-  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  grid-template-columns: repeat(2, minmax(250px, 1fr));
   margin-top: 8px;
   margin-bottom: 28px;
   padding: 8px;
@@ -1778,6 +1775,10 @@ a{
     font-weight: bold;
   }
 
+    #yets-5, #yets-6{
+      display: none;
+    }
+
 .publ-to-main{
   text-align: center;
   margin-bottom: 22px;
@@ -2302,6 +2303,7 @@ span.rub_back_title{
 
 
 
+
 @media screen and ( max-width: 580px ) {
 
   #left{
@@ -2491,12 +2493,29 @@ span.rub_back_title{
   }  
 
 
+  #moread_5, #moread_6, #yets-5, #yets-6{
+    display: none;
+  }
+
+
 }
 
 
+@media screen and (min-width: 1800px) {
+
+  #yets-5, #yets-6{
+    display: block;
+  }
+
+  .moread{
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  }
+
+}
+
 
 /** ultrabooks and ipads **/
-@media (max-width: 768px) {
+@media (max-width: 820px) {
 
   body {
     width: 100%;
@@ -2684,6 +2703,7 @@ span.rub_back_title{
 }
 
 
+ 
 }  
 
 
@@ -2854,7 +2874,6 @@ and (max-device-width : 667px) {
 
 
   
-  
 }
 
 
@@ -2864,3 +2883,5 @@ and (max-device-width : 667px) {
 
 
 
+
+