From ad4a7febdb61e4dacd19e4acc4988a72395f84ae Mon Sep 17 00:00:00 2001
From: "arlemp@selectel.ru" <arlemp@selectel.ru>
Date: Wed, 17 Aug 2022 00:29:25 +0300
Subject: [PATCH] new logic yets and moread

---
 blocks/moread.php |  8 +++++---
 blocks/yets.php   | 11 +++++++----
 header.php        |  2 +-
 style.css         | 39 ++++++++++++++++++++++++++++++---------
 4 files changed, 43 insertions(+), 17 deletions(-)

diff --git a/blocks/moread.php b/blocks/moread.php
index ab05ad1..dbc0373 100644
--- a/blocks/moread.php
+++ b/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>
diff --git a/blocks/yets.php b/blocks/yets.php
index 7caf060..a0f925a 100644
--- a/blocks/yets.php
+++ b/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>   
 
diff --git a/header.php b/header.php
index 58a5126..b3710e3 100644
--- a/header.php
+++ b/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">-->
diff --git a/style.css b/style.css
index 86a3af0..8a14100 100644
--- a/style.css
+++ b/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%;
@@ -2504,7 +2523,7 @@ span.rub_back_title{
     overflow-x: hidden;
   }
 
-
+  
   h1 {
     font-size: 24px;
   }
@@ -2683,7 +2702,8 @@ span.rub_back_title{
 
 }
 
-  
+
+ 
 }  
 
 
@@ -2854,7 +2874,6 @@ and (max-device-width : 667px) {
 
 
   
-  
 }
 
 
@@ -2863,4 +2882,6 @@ and (max-device-width : 667px) {
 
 
 
+
+
  
\ No newline at end of file