Commit 519c7e4b authored by prolinux's avatar prolinux

header menu add margin, min/max syze. info-block add back. blocks-section add…

header menu add margin, min/max syze. info-block add back. blocks-section add size. boy add margin auto
parent 06ace29b
......@@ -30,8 +30,8 @@
<div class="header-center">
<nav class="header-menu">
<ul>
<li><a href="#">Главная</a></li>
<li><a href="downloads.html">Загрузки</a></li>
<li><a href="index.html">Главная</a></li>
<li><a href="#">Загрузки</a></li>
<li><a href="news.html">Новости</a></li>
<li><a href="https://wiki.ximperlinux.ru">Wiki</a></li>
</ul>
......
......@@ -31,9 +31,9 @@
<div class="header-center">
<nav class="header-menu">
<ul>
<li><a href="#">Главная</a></li>
<li><a href="index.html">Главная</a></li>
<li><a href="downloads.html">Загрузки</a></li>
<li><a href="news.html">Новости</a></li>
<li><a href="#">Новости</a></li>
<li><a href="https://wiki.ximperlinux.ru">Wiki</a></li>
</ul>
</nav>
......
......@@ -42,7 +42,8 @@
/* Общие стили */
body {
margin: 0;
margin-left: auto;
margin-right: auto;
padding: 0;
font-family: Evolventa, Arial, sans-serif;
color: #fff;
......@@ -52,6 +53,8 @@ body {
flex-direction: column;
min-height: 100vh;
max-width: 1700px;
justify-content: center;
align-items: center;
}
body::before {
......@@ -183,7 +186,8 @@ header {
justify-content: space-between;
align-items: center;
padding: 20px 20px;
margin: 0;
margin-left: auto;
margin-right: auto;
position: fixed;
width: 100%;
top: 0px;
......@@ -226,6 +230,7 @@ header {
.header-center {
display: flex;
justify-content: center;
position: relative;
align-items: center;
flex: 2;
min-width: 0;
......@@ -244,7 +249,7 @@ header {
}
.header-menu ul li {
margin: 0 15px;
margin: 0 2%;
}
.header-menu ul li a {
......@@ -299,7 +304,6 @@ header h1 {
.header-center {
order: 1;
flex: 0 0 100%;
margin-top: 10px;
display: none;
}
......@@ -308,6 +312,7 @@ header h1 {
order: 2;
flex: 0;
margin: 0px !important;
width: 0px !important;
}
.header-menu ul li {
......@@ -321,16 +326,32 @@ header h1 {
.header-left {
flex: 1;
margin: 0px !important;
width: 0px !important;
}
}
/* Когда окно на полэкрана */
@media (max-width: 970px) {
@media (max-width: 1260px) {
.header-right {
margin: 0px !important;
margin: 0px 12% !important;
}
.header-left {
margin: 0px !important;
margin: 0px 12% !important;
}
.header-center {
margin: 0px 12% !important;
}
}
@media (max-width: 960px) {
.header-right {
margin: 0px 0% !important;
}
.header-left {
margin: 0px 0% !important;
}
.header-center {
padding: 0px 0px !important;
}
}
......@@ -389,7 +410,7 @@ header h1 {
}
.mobile-menu a:hover {
background-color: var(--border);
background: linear-gradient(38deg,#009dff,#ca00de);
}
/* Скрываем обычное меню на мобильных устройствах */
......@@ -608,6 +629,8 @@ main {
.info-block {
background: #2d2d32;
background-image: url(images/card_bg.png);
background-repeat: no-repeat;
background-size: cover;
border-radius: 20px;
padding: 25px 25px 40px 25px;
position: relative;
......@@ -617,6 +640,8 @@ main {
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
width: 80%; /* Уменьшаем ширину карточек */
height: 80%;
min-width: 350px;
max-width: 350px;
margin: 0 auto; /* Центрируем карточки */
}
......@@ -667,6 +692,17 @@ main {
margin-bottom: 70px;
}
/* Адаптация для сжатого браузера */
@media (max-width: 1324px) {
#blocks-section {
grid-template-columns: repeat(2, 1fr); /* Две карточки в ряд на планшетах */
}
main {
padding: 0px 5% !important;
margin: 0px !important;
}
}
/* Адаптация для планшетов */
@media (max-width: 1024px) {
#blocks-section {
......@@ -674,7 +710,7 @@ main {
}
main {
padding: 0px 0% 20px 0% !important;
}
}
}
/* Адаптация для мобильных устройств */
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment