Новые изменения в компоенты

This commit is contained in:
Web-serfer 2026-04-23 17:24:24 +05:00
parent 21f8a0d124
commit f5809afff8
5 changed files with 401 additions and 23 deletions

View file

@ -78,7 +78,7 @@ const relatedCases = shuffledCases.slice(0, limit);
<style>
.related-cases {
padding: 5rem 0;
background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
background: #f1f5f9;
}
.site-container {
@ -123,6 +123,7 @@ const relatedCases = shuffledCases.slice(0, limit);
border-radius: 16px;
padding: 2rem;
border: 1px solid #e2e8f0;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
text-decoration: none;
transition: all 0.3s ease;
display: flex;
@ -238,5 +239,23 @@ const relatedCases = shuffledCases.slice(0, limit);
.related-cases__grid {
grid-template-columns: 1fr;
}
.related-case-card__header {
justify-content: center;
}
.related-case-card__title {
text-align: center;
}
.related-case-card__desc {
text-align: center;
}
.related-case-card__footer {
flex-direction: column;
align-items: center;
text-align: center;
}
}
</style>

View file

@ -242,7 +242,6 @@ const allCases = [
</div>
</section>
</div>
<!-- /.case-detail-page -->
<RelatedCases
title="Другие кейсы"
@ -591,12 +590,16 @@ const allCases = [
transform: translateX(4px);
}
@media (max-width: 1024px) {
@media (max-width: 1024px) {
.case-grid {
grid-template-columns: 1fr;
}
.case-sidebar {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
grid-template-columns: 1fr;
gap: 1rem;
}
.case-sidebar__card {
@ -605,27 +608,115 @@ const allCases = [
}
@media (max-width: 768px) {
.case-detail-page {
padding: 0;
}
.case-content {
padding: 3rem 0;
padding: 2rem 0;
}
.case-grid {
gap: 1.5rem;
}
.case-block {
padding: 2rem 1.5rem;
padding: 1.5rem;
border-radius: 12px;
border-left: none;
border-right: none;
}
.case-block__title {
justify-content: center;
}
.case-block__content {
text-align: center;
}
.case-step {
flex-direction: column;
align-items: center;
text-align: center;
gap: 0.75rem;
}
.case-sidebar {
grid-template-columns: 1fr;
}
.case-sidebar__card {
border-radius: 12px;
border-left: none;
border-right: none;
}
}
@media (max-width: 480px) {
.case-block {
padding: 1.5rem 1rem;
padding: 1.25rem;
}
.case-block__title {
font-size: 1.15rem;
}
.case-block__content p {
font-size: 0.9rem;
}
.case-step {
flex-direction: column;
text-align: center;
gap: 0.75rem;
}
.case-step__number {
width: 40px;
height: 40px;
font-size: 0.9rem;
}
.case-step__content h3 {
font-size: 1rem;
}
.case-step__content p {
font-size: 0.85rem;
}
.case-verdict {
padding: 1.25rem;
}
.case-verdict__badge {
font-size: 0.8rem;
display: flex;
justify-content: center;
}
.case-sidebar__title {
font-size: 1rem;
text-align: center;
}
.case-sidebar__row {
font-size: 0.85rem;
}
.case-sidebar__lawyer-avatar {
width: 60px;
height: 60px;
}
.case-sidebar__lawyer-avatar svg {
width: 30px;
height: 30px;
}
.case-sidebar__lawyer-stat strong {
font-size: 1.25rem;
}
}
</style>

View file

@ -569,8 +569,8 @@ const allCases = [
.case-sidebar {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
grid-template-columns: 1fr;
gap: 1rem;
}
.case-sidebar__card {
@ -579,27 +579,115 @@ const allCases = [
}
@media (max-width: 768px) {
.case-detail-page {
padding: 0;
}
.case-content {
padding: 3rem 0;
padding: 2rem 0;
}
.case-grid {
gap: 1.5rem;
}
.case-block {
padding: 2rem 1.5rem;
padding: 1.5rem;
border-radius: 12px;
border-left: none;
border-right: none;
}
.case-block__title {
justify-content: center;
}
.case-block__content {
text-align: center;
}
.case-step {
flex-direction: column;
align-items: center;
text-align: center;
gap: 0.75rem;
}
.case-sidebar {
grid-template-columns: 1fr;
}
.case-sidebar__card {
border-radius: 12px;
border-left: none;
border-right: none;
}
}
@media (max-width: 480px) {
.case-block {
padding: 1.5rem 1rem;
padding: 1.25rem;
}
.case-block__title {
font-size: 1.15rem;
}
.case-block__content p {
font-size: 0.9rem;
}
.case-step {
flex-direction: column;
text-align: center;
gap: 0.75rem;
}
.case-step__number {
width: 40px;
height: 40px;
font-size: 0.9rem;
}
.case-step__content h3 {
font-size: 1rem;
}
.case-step__content p {
font-size: 0.85rem;
}
.case-verdict {
padding: 1.25rem;
}
.case-verdict__badge {
font-size: 0.8rem;
display: flex;
justify-content: center;
}
.case-sidebar__title {
font-size: 1rem;
text-align: center;
}
.case-sidebar__row {
font-size: 0.85rem;
}
.case-sidebar__lawyer-avatar {
width: 60px;
height: 60px;
}
.case-sidebar__lawyer-avatar svg {
width: 30px;
height: 30px;
}
.case-sidebar__lawyer-stat strong {
font-size: 1.25rem;
}
}
</style>

View file

@ -569,8 +569,8 @@ const allCases = [
.case-sidebar {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
grid-template-columns: 1fr;
gap: 1rem;
}
.case-sidebar__card {
@ -579,27 +579,115 @@ const allCases = [
}
@media (max-width: 768px) {
.case-detail-page {
padding: 0;
}
.case-content {
padding: 3rem 0;
padding: 2rem 0;
}
.case-grid {
gap: 1.5rem;
}
.case-block {
padding: 2rem 1.5rem;
padding: 1.5rem;
border-radius: 12px;
border-left: none;
border-right: none;
}
.case-block__title {
justify-content: center;
}
.case-block__content {
text-align: center;
}
.case-step {
flex-direction: column;
align-items: center;
text-align: center;
gap: 0.75rem;
}
.case-sidebar {
grid-template-columns: 1fr;
}
.case-sidebar__card {
border-radius: 12px;
border-left: none;
border-right: none;
}
}
@media (max-width: 480px) {
.case-block {
padding: 1.5rem 1rem;
padding: 1.25rem;
}
.case-block__title {
font-size: 1.15rem;
}
.case-block__content p {
font-size: 0.9rem;
}
.case-step {
flex-direction: column;
text-align: center;
gap: 0.75rem;
}
.case-step__number {
width: 40px;
height: 40px;
font-size: 0.9rem;
}
.case-step__content h3 {
font-size: 1rem;
}
.case-step__content p {
font-size: 0.85rem;
}
.case-verdict {
padding: 1.25rem;
}
.case-verdict__badge {
font-size: 0.8rem;
display: flex;
justify-content: center;
}
.case-sidebar__title {
font-size: 1rem;
text-align: center;
}
.case-sidebar__row {
font-size: 0.85rem;
}
.case-sidebar__lawyer-avatar {
width: 60px;
height: 60px;
}
.case-sidebar__lawyer-avatar svg {
width: 30px;
height: 30px;
}
.case-sidebar__lawyer-stat strong {
font-size: 1.25rem;
}
}
</style>

View file

@ -568,8 +568,8 @@ const allCases = [
.case-sidebar {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
grid-template-columns: 1fr;
gap: 1rem;
}
.case-sidebar__card {
@ -578,27 +578,119 @@ const allCases = [
}
@media (max-width: 768px) {
.case-detail-page {
padding: 0;
}
.case-content {
padding: 3rem 0;
padding: 2rem 0;
}
.case-grid {
gap: 1.5rem;
}
.case-block {
padding: 2rem 1.5rem;
padding: 1.5rem;
border-radius: 12px;
border-left: none;
border-right: none;
}
.case-block__title {
justify-content: center;
}
.case-block__content {
text-align: center;
}
.case-step {
flex-direction: column;
align-items: center;
text-align: center;
gap: 0.75rem;
}
.case-sidebar {
grid-template-columns: 1fr;
}
.case-sidebar__card {
border-radius: 12px;
border-left: none;
border-right: none;
}
}
@media (max-width: 480px) {
.case-block {
padding: 1.5rem 1rem;
padding: 1.25rem;
}
.case-block__title {
font-size: 1.15rem;
}
.case-block__content p {
font-size: 0.9rem;
}
.case-step {
flex-direction: column;
text-align: center;
gap: 0.75rem;
}
.case-step__number {
width: 40px;
height: 40px;
font-size: 0.9rem;
}
.case-step__content h3 {
font-size: 1rem;
}
.case-step__content p {
font-size: 0.85rem;
}
.case-verdict {
padding: 1.25rem;
}
.case-verdict__badge {
font-size: 0.8rem;
display: flex;
justify-content: center;
}
.case-sidebar__title {
font-size: 1rem;
text-align: center;
}
.case-sidebar__row {
font-size: 0.85rem;
flex-direction: column;
align-items: center;
gap: 0.5rem;
text-align: center;
}
.case-sidebar__lawyer-avatar {
width: 60px;
height: 60px;
}
.case-sidebar__lawyer-avatar svg {
width: 30px;
height: 30px;
}
.case-sidebar__lawyer-stat strong {
font-size: 1.25rem;
}
}
</style>