swiper-1-2-fix

public/locales/en/translation.json

@@ -397,7 +397,7 @@
   "Top authors": "Authors rating",
   "Top commented": "Most commented",
   "Top discussed": "Top discussed",
-  "Top month articles": "Top of the month",
+  "Top month": "Top of the month",
   "Top rated": "Popular",
   "Top recent": "Most recent",
   "Top topics": "Interesting topics",

public/locales/ru/translation.json

@@ -418,7 +418,7 @@
   "Top authors": "Рейтинг авторов",
   "Top commented": "Самое комментируемое",
   "Top discussed": "Обсуждаемое",
-  "Top month articles": "Лучшие материалы месяца",
+  "Top month": "Лучшее за месяц",
   "Top rated": "Популярное",
   "Top recent": "Самое новое",
   "Top topics": "Интересные темы",

src/components/_shared/SolidSwiper/ArticleCardSwiper.tsx

@@ -10,6 +10,8 @@ import { ShowOnlyOnClient } from '../ShowOnlyOnClient'
 
 import { SwiperRef } from './swiper'
 
+import { Row1 } from '../../Feed/Row1'
+import { Row2 } from '../../Feed/Row2'
 import styles from './Swiper.module.scss'
 
 type Props = {
@@ -42,20 +44,9 @@ export const ArticleCardSwiper = (props: Props) => {
           <h2 class={styles.sliderTitle}>{props.title}</h2>
         </Show>
         <div class={styles.container}>
-          <Show
-            when={props.slides.length > 1}
-            fallback={
-              <ArticleCard
-                article={props.slides[0]}
-                settings={{
-                  isFloorImportant: true,
-                  isWithCover: true,
-                  nodate: true,
-                }}
-                desktopCoverSize="L"
-              />
-            }
-          >
+          <Show when={props.slides.length > 0}>
+            <Show when={props.slides.length !== 1} fallback={<Row1 article={props.slides[0]} />}>
+              <Show when={props.slides.length !== 2} fallback={<Row2 articles={props.slides} />}>
                 <div class={styles.holder}>
                   <swiper-container
                     ref={(el) => (mainSwipeRef.current = el)}
@@ -108,6 +99,8 @@ export const ArticleCardSwiper = (props: Props) => {
                   </div>
                 </div>
               </Show>
+            </Show>
+          </Show>
         </div>
       </div>
     </ShowOnlyOnClient>