styling

src/animations/search.animation.ts

@@ -31,12 +31,12 @@ export const searchMobileMotion: Variants = {
   logoRest: {
     display: "block",
     opacity: 1,
-    transform: "translateX(0%)",
+    transform: "translateX(0%) translateY(-50%)",
     type: "spring",
   },
   logoActive: {
     opacity: 0,
-    transform: "translateX(-150%)",
+    transform: "translateX(-150%) translateY(-50%)",
     type: "spring",
   },
 

src/api/params.ts

@@ -14,7 +14,7 @@ export const newsScrollParams: IurlParamAdder[] = [
 export const categoriesParams: IurlParamAdder[] = [
   {
     name: "count",
-    value: 7,
+    value: 5,
   },
   {
     name: "page",

src/components/header/SubNav.tsx

@@ -59,12 +59,6 @@ const SubNav = () => {
         <ul className="subnav-inner">
           {data ? (
             <>
-              <SubNavLi
-                isNotCategory
-                dataEl={{ id: 0, name: "Главная" }}
-                activeLink={activeLink}
-                onClickLink={onClickLink}
-              />
               {data.data.map((dataEl) => {
                 return (
                   <SubNavLi

src/styles/_nav.scss

@@ -20,7 +20,7 @@
     .nav-mid {
       position: absolute;
       left: 0;
-      top: 3rem;
+      top: 50%;
     }
     .search-wrap {
       position: absolute;
@@ -36,7 +36,12 @@
 }
 
 .nav-mid {
+  width: 100%;
+  max-width: 60%;
+  display: flex;
+  justify-content: flex-start;
   h1 {
+    width: fit-content;
     text-align: center;
     color: $main;
     font-weight: bold;
@@ -201,6 +206,11 @@
 
 // Media
 @media screen and (max-width: 850px) {
+  .nav-mid {
+    h1 {
+      // text-align: start;
+    }
+  }
   .nav-right {
     display: none;
   }

src/styles/_news-article.scss

@@ -1,5 +1,8 @@
 .news-article {
   padding: 5.6rem 0;
+  .loader {
+    margin: 4rem 0;
+  }
 }
 .news-article-inner {
   display: grid;
@@ -92,6 +95,13 @@
   cursor: pointer;
 }
 
+.sresult-content {
+  .news-text {
+    font-size: 1.6rem;
+    line-height: 2.2rem;
+  }
+}
+
 @media (max-width: 1024px) {
   .news-article-inner {
     display: block;

src/styles/_news.scss

@@ -3,6 +3,10 @@
   grid-template-columns: 32rem 1fr;
   grid-template-rows: 20rem;
   gap: 1.6rem;
+
+  .loader {
+    margin: 4rem 0;
+  }
 }
 
 .news-info {
@@ -146,7 +150,7 @@
     flex-direction: column;
   }
   .news-image {
-    min-height: 16rem;
+    height: 25rem;
   }
 }
 

src/styles/_variables.scss

@@ -3,6 +3,6 @@ $main: #38a39d;
 $white: #ffffff;
 $gray: #f1f1f1;
 $gray-dark: #a6a6a6;
-$body: #5a5a5a;
+$body: #000;
 $red: #e53131;
 $blue: #3c7ec0;