NetsPro/Reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

фикс

Browse Source
This commit is contained in:
Professional 2025-05-24 01:24:01 +07:00
parent 9ba333d35d
commit 31d25efea7
1 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/ProfileView.vue
View File

@ -1457,53 +1457,62 @@ onUnmounted(() => {
/* Stats Section */ /* Stats Section */
.stats-section { .stats-section {
display: flex; display: flex;
justify-content: space-between; justify-content: space-around; /* равномерное распределение по ширине */
background: rgba(243, 245, 250, 0.6); background: rgba(243, 245, 250, 0.6);
border-radius: 12px; border-radius: 12px;
padding: 0.8rem; padding: 1rem; /* увеличиваем внутренний отступ */
margin-top: 0.8rem; margin-top: 0.8rem;
flex-wrap: wrap; /* добавляем перенос при маленьком экране */
gap: 1rem; /* отступ между элементами */
} }
.stat-item { .stat-item {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 1rem; /* Увеличиваю отступ с 0.5rem до 1rem */ gap: 1rem;
min-width: 110px; /* минимальная ширина для элементов статистики */
flex-grow: 0; /* элементы не растягиваются */
padding: 0.5rem; /* добавляем отступ внутри блока */
} }
.stat-icon { .stat-icon {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 40px; /* Увеличиваем размер для лучшего вида */ width: 44px;
height: 40px; /* Поддерживаем квадратные пропорции */ height: 44px;
min-width: 40px; /* Фиксированный минимальный размер */ min-width: 44px;
min-height: 40px; /* Фиксированный минимальный размер */ min-height: 44px;
border-radius: 50%; /* Идеально круглая форма */ border-radius: 50%;
background: rgba(102, 126, 234, 0.15); background: rgba(102, 126, 234, 0.15);
color: #667eea; color: #667eea;
margin: 0 auto; /* Центрируем по горизонтали */ flex-shrink: 0; /* иконка не сжимается */
} }
/* Добавляем стиль для иконок внутри .stat-icon */ /* Добавляем стиль для иконок внутри .stat-icon */
.stat-icon i { .stat-icon i {
font-size: 1.2rem; /* Единый размер для всех иконок */ font-size: 1.3rem; /* Единый размер для всех иконок */
line-height: 1; /* Гарантирует вертикальное центрирование */ line-height: 1; /* Гарантирует вертикальное центрирование */
} }
.stat-info { .stat-info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-width: 0; /* позволяет тексту сжиматься */
flex: 1; /* занимать доступное пространство */
} }
.stat-value { .stat-value {
font-size: 1.1rem; font-size: 1.1rem;
font-weight: 600; font-weight: 600;
color: #333; color: #333;
white-space: nowrap; /* значение в одну строку */
} }
.stat-label { .stat-label {
font-size: 0.75rem; font-size: 0.75rem;
color: #6c757d; color: #6c757d;
white-space: nowrap; /* подпись в одну строку */
} }
/* Tabs */ /* Tabs */
@ -2033,7 +2042,6 @@ onUnmounted(() => {
background: rgba(102, 126, 234, 0.1); background: rgba(102, 126, 234, 0.1);
} }
/* Logout Button */
.logout-section { .logout-section {
display: flex; display: flex;
justify-content: center; justify-content: center;