nickdemiman
diff --git a/‎public/index.html‎
Lines changed: 3 additions & 3 deletions b/‎public/index.html‎
Lines changed: 3 additions & 3 deletions
diff --git a/‎public/styles.css‎
Lines changed: 12 additions & 6 deletions b/‎public/styles.css‎
Lines changed: 12 additions & 6 deletions
diff --git a/‎src/components/container/container.css‎ b/‎src/components/container/container.css‎
diff --git a/‎src/components/container/container.js‎ b/‎src/components/container/container.js‎
@@ -10,15 +10,15 @@
 </head>
 <body>
     <div class="container">
-        <div class="ribbon">
+        <!-- <div class="ribbon">
             <span>BETA</span>
         </div>
         <header>
             <img src="steam.png" alt="Steam Logo" class="header-logo">
             <span class="header-text">Редактор Steam Разметки</span>
-        </header>
+        </header> -->
 
-        <div class="buttons">
+        <div class="nav-controls" data-collapsed="false">
             <button data-tag="h1">H1<span class="tooltip">Ctrl + Shift + H</span></button>
             <button data-tag="h2">H2</button>
             <button data-tag="h3">H3</button>
 
@@ -21,8 +21,10 @@ body {
 }
 
 .container {
-  width: 60%;
-  max-height: 80vh; 
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  max-height: 100vh; 
   overflow-y: auto; 
   border-radius: 15px;
   padding: 20px;
@@ -74,19 +76,23 @@ header {
   width: auto;
 }
 
-.buttons {
+.nav-controls {
   padding-bottom: 8px;
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  grid-row-gap: 16px;
+  grid-column-gap: 8px;
 }
 
-.buttons button {
+.nav-controls button {
   position: relative;
-  margin-right: 4px;
   background-color: #555;
   border: none;
   color: #fff;
-  padding: 10px 15px;
+  padding: 12px 8px;
   border-radius: 5px;
   cursor: pointer;
+  height: min-content;
 }
 
 .tooltip {