Expo fixes

public/locales/en/translation.json

@@ -86,6 +86,7 @@
   "Commenting": "Commenting",
   "Comments": "Comments",
   "CommentsWithCount": "{count, plural, =0 {{count} comments} one {{count} comment} few {{count} comments} other {{count} comments}}",
+  "Common feed": "All",
   "Communities": "Communities",
   "Community Discussion Rules": "Community Discussion Rules",
   "Community Principles": "Community Principles",

public/locales/ru/translation.json

@@ -31,7 +31,7 @@
   "All posts rating": "Рейтинг всех постов",
   "All posts": "Все публикации",
   "All topics": "Все темы",
-  "All": "Общая лента",
+  "All": "Все",
   "Almost done! Check your email.": "Почти готово! Осталось подтвердить вашу почту.",
   "Are you sure you want to delete this comment?": "Уверены, что хотите удалить этот комментарий?",
   "Are you sure you want to delete this draft?": "Уверены, что хотите удалить этот черновик?",
@@ -90,6 +90,7 @@
   "Commenting": "Комментирование",
   "Comments": "Комментарии",
   "CommentsWithCount": "{count, plural, =0 {{count} комментариев} one {{count} комментарий} few {{count} комментария} other {{count} комментариев}}",
+  "Common feed": "Общая лента",
   "Communities": "Сообщества",
   "Community Discussion Rules": "Правила дискуссий в сообществе",
   "Community Principles": "Принципы сообщества",

src/components/Feed/ArticleCard/ArticleCard.module.scss

@@ -13,7 +13,9 @@
 
   &:hover {
     .shoutCardCover {
-      transform: scale(1.05);
+      img {
+        transform: scale(1.1);
+      }
     }
   }
 
@@ -120,13 +122,10 @@
     height: 100%;
     object-fit: cover;
     position: absolute;
+    transform: scale(1);
+    transition: transform 0.3s;
     width: 100%;
   }
-
-  &:hover img {
-    /* TODO: small zoom on hover */
-    transform: scaleZ(1.1);
-  }
 }
 
 .shoutAuthor {

src/components/Feed/ArticleCard/ArticleCard.tsx

@@ -99,6 +99,7 @@ const getMainTopicTitle = (article: Shout, lng: string) => {
 
 const LAYOUT_ASPECT = {
   music: styles.aspectRatio1x1,
+  audio: styles.aspectRatio1x1,
   literature: styles.aspectRatio16x9,
   video: styles.aspectRatio16x9,
   image: styles.aspectRatio4x3,

src/components/Feed/Sidebar/Sidebar.tsx

@@ -40,7 +40,7 @@ export const Sidebar = () => {
           >
             <span class={styles.sidebarItemName}>
               <Icon name="feed-all" class={styles.icon} />
-              {t('All')}
+              {t('Common feed')}
             </span>
           </a>
         </li>

src/components/Views/Expo/Expo.tsx

@@ -126,7 +126,6 @@ export const Expo = (props: Props) => {
 
   return (
     <div class={styles.Expo}>
-      <Show when={expoShouts().length > 0} fallback={<Loading />}>
       <div class="wide-container">
         <ul class={clsx('view-switcher')}>
           <li class={clsx({ 'view-switcher__item--selected': !props.layout })}>
@@ -178,6 +177,10 @@ export const Expo = (props: Props) => {
             </ConditionalWrapper>
           </li>
         </ul>
+      </div>
+
+      <Show when={expoShouts().length > 0} fallback={<Loading />}>
+        <div class="wide-container">
           <div class="row">
             <For each={expoShouts()?.slice(0, LOAD_MORE_PAGE_SIZE)}>
               {(shout) => (

src/styles/app.scss

@@ -678,7 +678,7 @@ figure {
       cursor: default;
 
       &:hover {
-        background: #fff;
+        background: transparent;
       }
     }
   }