Dantes (обсуждение | вклад) Нет описания правки |
Dantes (обсуждение | вклад) Нет описания правки |
||
| Строка 1: | Строка 1: | ||
/* Основные стили | /* Основные стили */ | ||
.species-page { | .species-page { | ||
padding: | padding: 2rem 1rem; | ||
max-width: | max-width: 1400px; | ||
margin: 0 auto; | margin: 0 auto; | ||
background: radial-gradient(circle at top, #0C945622 0%, transparent 30%); | |||
} | } | ||
. | /* Заголовок */ | ||
.title-container { | |||
position: relative; | |||
margin: 3rem 0; | |||
padding: 1.5rem; | |||
background: linear-gradient(45deg, #0C945633, #0a774433); | |||
border-radius: 16px; | |||
border: 2px solid #0C945655; | |||
} | } | ||
. | .page-title span { | ||
background: | background: linear-gradient(45deg, #0C9456, #0a7744); | ||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
} | } | ||
/* | /* Навигация */ | ||
. | .quick-nav span { | ||
display: | display: inline-block; | ||
margin: 0.3rem; | |||
padding: 0.4rem 1.2rem; | |||
background: #0C9456; | |||
border-radius: 25px; | |||
transition: 0.2s; | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.3); | |||
} | } | ||
. | .quick-nav span:hover { | ||
transform: translateY(-2px); | |||
box-shadow: 0 4px 8px rgba(0,0,0,0.4); | |||
} | } | ||
.species-card | /* Сетка рас */ | ||
.species-card { | |||
position: relative; | |||
overflow: hidden; | |||
border: 2px solid #0C945644; | |||
border | |||
} | } | ||
.species-card::after { | |||
. | content: ""; | ||
position: | position: absolute; | ||
top: 0; left: 0; | |||
width: 100%; height: 100%; | |||
background: linear-gradient(45deg, #0C945622, transparent); | |||
} | } | ||
. | .species-image { | ||
padding: 1.5rem; | |||
background: #00000033; | |||
} | } | ||
/* Аккордеоны */ | /* Аккордеоны */ | ||
.accordion-header { | .accordion-header { | ||
position: relative; | |||
padding-left: 3rem; | |||
transition: 0.2s; | |||
} | } | ||
.accordion- | .accordion-header::before { | ||
content: "▶"; | |||
position: absolute; | |||
left: 1rem; | |||
transition: 0.3s; | transition: 0.3s; | ||
} | } | ||
.accordion- | .accordion-header.active::before { | ||
transform: rotate(90deg); | |||
} | } | ||
/* Адаптивность */ | /* Адаптивность */ | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.species- | .species-card { | ||
grid- | grid-column: span 2; | ||
} | } | ||
. | |||
font-size: | .accordion-header { | ||
font-size: 0.9rem; | |||
} | } | ||
} | } | ||
Версия от 21:21, 23 февраля 2025
/* Основные стили */
.species-page {
padding: 2rem 1rem;
max-width: 1400px;
margin: 0 auto;
background: radial-gradient(circle at top, #0C945622 0%, transparent 30%);
}
/* Заголовок */
.title-container {
position: relative;
margin: 3rem 0;
padding: 1.5rem;
background: linear-gradient(45deg, #0C945633, #0a774433);
border-radius: 16px;
border: 2px solid #0C945655;
}
.page-title span {
background: linear-gradient(45deg, #0C9456, #0a7744);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* Навигация */
.quick-nav span {
display: inline-block;
margin: 0.3rem;
padding: 0.4rem 1.2rem;
background: #0C9456;
border-radius: 25px;
transition: 0.2s;
box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
.quick-nav span:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0,0,0,0.4);
}
/* Сетка рас */
.species-card {
position: relative;
overflow: hidden;
border: 2px solid #0C945644;
}
.species-card::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
background: linear-gradient(45deg, #0C945622, transparent);
}
.species-image {
padding: 1.5rem;
background: #00000033;
}
/* Аккордеоны */
.accordion-header {
position: relative;
padding-left: 3rem;
transition: 0.2s;
}
.accordion-header::before {
content: "▶";
position: absolute;
left: 1rem;
transition: 0.3s;
}
.accordion-header.active::before {
transform: rotate(90deg);
}
/* Адаптивность */
@media (max-width: 768px) {
.species-card {
grid-column: span 2;
}
.accordion-header {
font-size: 0.9rem;
}
}