Переполнения

htmlacademy-adaptive · Jan 13, 2024 · 6585797 · 6585797
1 parent db3f175
commit 6585797
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 9 deletions.
diff --git a/source/catalog.html b/source/catalog.html
@@ -37,26 +37,26 @@
       <nav class="site-list no-js-site-list is-active js-nav-menu">
         <ul class="site-list__menu">
           <li class="site-list__item ">
-            <a class="site-list__link" href="index.html" aria-current="page"
-              tabindex="-1">главная</a>
+            <a class="site-list__link" href="index.html">главная</a>
           </li>
           <li class="site-list__item">
-            <a class="site-list__link site-list__link--active" href="#">каталог продукции</a>
+            <a class="site-list__link site-list__link--active" href="#" aria-current="page"
+            tabindex="-1">каталог продукции</a>
           </li>
           <li class="site-list__item">
             <a class="site-list__link" href="form.html">подбор программы</a>
           </li>
         </ul>
       </nav>
     </div>
+
   </header>
 
   <main class="main">
     <div class="main__container container">
       <h1 class="main-heading">Каталог продукции</h1>
     </div>
 
-
     <section class="main__section catalog-list container">
       <h2 class="visually-hidden">Список продукции.</h2>
 

diff --git a/source/form.html b/source/form.html
@@ -37,14 +37,14 @@
       <nav class="site-list no-js-site-list is-active js-nav-menu">
         <ul class="site-list__menu">
           <li class="site-list__item ">
-            <a class="site-list__link" href="index.html" aria-current="page"
-              tabindex="-1">главная</a>
+            <a class="site-list__link" href="index.html">главная</a>
           </li>
           <li class="site-list__item">
             <a class="site-list__link" href="catalog.html">каталог продукции</a>
           </li>
           <li class="site-list__item">
-            <a class="site-list__link site-list__link--active" href="#">подбор программы</a>
+            <a class="site-list__link site-list__link--active" href="#" aria-current="page"
+          tabindex="-1">подбор программы</a>
           </li>
         </ul>
       </nav>

diff --git a/source/index.html b/source/index.html
@@ -35,7 +35,7 @@
         <span></span>
       </button>
       <nav class="site-list no-js-site-list is-active js-nav-menu">
-        <ul class="site-list__menu">
+        <ul class="site-list__menu site-list__menu--index">
           <li class="site-list__item">
             <a class="site-list__link site-list__link-index site-list__link--active" href="#" aria-current="page"
               tabindex="-1">главная</a>

diff --git a/source/styles/blocks/site-list.scss b/source/styles/blocks/site-list.scss
@@ -44,6 +44,7 @@
     font-size: 20px;
     line-height: normal;
     color: $color-black;
+    width: 50%;
   }
 }
 
@@ -61,7 +62,8 @@
 
   @media (min-width: $tablet-width) {
     display: flex;
-    gap: 33px;
+    column-gap: 33px;
+    flex-wrap: wrap;
   }
 }
 
@@ -105,3 +107,21 @@
     }
   }
 }
+
+.site-list__menu--index {
+  @media (min-width: $desktop-width) {
+    position: relative;
+
+    &::before {
+      position: absolute;
+
+      content: "";
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+      background-color: $color-primary-500--opacity;
+      z-index: -4;
+    }
+  }
+}