Update files
This commit is contained in:
parent
68fca1683e
commit
5f4433b4b2
|
|
@ -105,10 +105,12 @@
|
||||||
.user-item-wrapper {
|
.user-item-wrapper {
|
||||||
padding: 12px 16px;
|
padding: 12px 16px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.03);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.03);
|
||||||
min-height: 70px;
|
min-height: 70px;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-item-wrapper:last-child {
|
.user-item-wrapper:last-child {
|
||||||
|
|
@ -121,6 +123,7 @@
|
||||||
|
|
||||||
.user-item {
|
.user-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
|
||||||
|
|
@ -197,10 +197,10 @@ export default function PostCard({ post, currentUser, onUpdate }) {
|
||||||
{/* Изображения */}
|
{/* Изображения */}
|
||||||
{images.length > 0 && (
|
{images.length > 0 && (
|
||||||
<div className="post-images">
|
<div className="post-images">
|
||||||
<div className="image-carousel" style={{ cursor: 'pointer', position: 'relative' }}>
|
<div className="image-carousel" style={{ cursor: 'pointer', position: 'relative' }} onClick={openFullView}>
|
||||||
<img src={images[currentImageIndex]} alt={`Image ${currentImageIndex + 1}`} />
|
<img src={images[currentImageIndex]} alt={`Image ${currentImageIndex + 1}`} />
|
||||||
|
|
||||||
{images.length > 1 ? (
|
{images.length > 1 && (
|
||||||
<>
|
<>
|
||||||
{/* Левая зона для переключения на предыдущее изображение */}
|
{/* Левая зона для переключения на предыдущее изображение */}
|
||||||
<div
|
<div
|
||||||
|
|
@ -209,9 +209,11 @@ export default function PostCard({ post, currentUser, onUpdate }) {
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
if (currentImageIndex > 0) {
|
if (currentImageIndex > 0) {
|
||||||
handlePrev()
|
handlePrev()
|
||||||
|
} else {
|
||||||
|
openFullView()
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
style={{ cursor: currentImageIndex > 0 ? 'pointer' : 'default' }}
|
style={{ cursor: 'pointer' }}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Правая зона для переключения на следующее изображение */}
|
{/* Правая зона для переключения на следующее изображение */}
|
||||||
|
|
@ -221,9 +223,11 @@ export default function PostCard({ post, currentUser, onUpdate }) {
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
if (currentImageIndex < images.length - 1) {
|
if (currentImageIndex < images.length - 1) {
|
||||||
handleNext()
|
handleNext()
|
||||||
|
} else {
|
||||||
|
openFullView()
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
style={{ cursor: currentImageIndex < images.length - 1 ? 'pointer' : 'default' }}
|
style={{ cursor: 'pointer' }}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="carousel-dots">
|
<div className="carousel-dots">
|
||||||
|
|
@ -236,15 +240,6 @@ export default function PostCard({ post, currentUser, onUpdate }) {
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
) : (
|
|
||||||
/* Если одно изображение, вся область открывает fullview */
|
|
||||||
<div
|
|
||||||
className="carousel-zone carousel-zone-center"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.stopPropagation()
|
|
||||||
openFullView()
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Индикатор что можно открыть fullview */}
|
{/* Индикатор что можно открыть fullview */}
|
||||||
|
|
|
||||||
|
|
@ -86,10 +86,11 @@
|
||||||
|
|
||||||
.user-stats {
|
.user-stats {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
justify-content: center;
|
|
||||||
padding-top: 16px;
|
padding-top: 16px;
|
||||||
border-top: 1px solid var(--divider-color);
|
border-top: 1px solid var(--divider-color);
|
||||||
}
|
}
|
||||||
|
|
@ -98,11 +99,12 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: opacity 0.2s;
|
transition: opacity 0.2s;
|
||||||
flex: 1;
|
flex: 0 0 auto;
|
||||||
max-width: 120px;
|
min-width: 80px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-item:active {
|
.stat-item:active {
|
||||||
|
|
@ -114,12 +116,14 @@
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-label {
|
.stat-label {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: var(--text-secondary);
|
color: var(--text-secondary);
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-divider {
|
.stat-divider {
|
||||||
|
|
@ -127,6 +131,7 @@
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background: var(--divider-color);
|
background: var(--divider-color);
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
flex-grow: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.follow-btn {
|
.follow-btn {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue