фикс
This commit is contained in:
Professional
parent
f0d4df2ce8
commit
5d874df3e5
@ -405,6 +405,8 @@ export default {
|
||||
padding-right: 1rem;
|
||||
padding-bottom: 2rem; /* Default bottom padding */
|
||||
max-width: 100%;
|
||||
overflow-x: hidden; /* Предотвращение горизонтальной прокрутки */
|
||||
box-sizing: border-box; /* Гарантия, что padding учитывается в ширине */
|
||||
}
|
||||
|
||||
.header-controls {
|
||||
@ -485,11 +487,18 @@ h2 {
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.report-container {
|
||||
width: 100%;
|
||||
overflow-x: hidden; /* Предотвращение горизонтальной прокрутки */
|
||||
}
|
||||
|
||||
.report-card {
|
||||
background: white;
|
||||
border-radius: 0.75rem;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
box-sizing: border-box; /* Гарантия, что padding учитывается в ширине */
|
||||
}
|
||||
|
||||
.report-header {
|
||||
@ -522,6 +531,9 @@ h2 {
|
||||
.full-id {
|
||||
color: #6c757d;
|
||||
font-size: 0.9rem;
|
||||
word-break: break-all; /* Разрешить перенос длинных строк везде */
|
||||
max-width: 100%; /* Ограничение ширины */
|
||||
display: inline-block; /* Для корректного применения max-width */
|
||||
}
|
||||
|
||||
.report-date {
|
||||
@ -534,11 +546,14 @@ h2 {
|
||||
|
||||
.report-content {
|
||||
padding: 1.5rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box; /* Учитывать padding в общей ширине */
|
||||
}
|
||||
|
||||
.info-grid {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
width: 100%; /* Обеспечение заполнения всей доступной ширины */
|
||||
}
|
||||
|
||||
.info-section {
|
||||
@ -546,6 +561,10 @@ h2 {
|
||||
padding: 1.5rem;
|
||||
border-radius: 0.375rem;
|
||||
border: 1px solid #e9ecef;
|
||||
width: 100%;
|
||||
box-sizing: border-box; /* Учитывать padding в общей ширине */
|
||||
overflow-wrap: break-word; /* Гарантия переноса длинных слов */
|
||||
word-wrap: break-word; /* Для поддержки старых браузеров */
|
||||
}
|
||||
|
||||
.section-header {
|
||||
@ -576,6 +595,10 @@ h2 {
|
||||
border: 1px solid #e9ecef;
|
||||
margin: 0;
|
||||
line-height: 1.6;
|
||||
overflow-wrap: break-word; /* Гарантия переноса длинных слов */
|
||||
word-wrap: break-word; /* Для поддержки старых браузеров */
|
||||
white-space: pre-line; /* Сохранение переносов строк в тексте */
|
||||
max-width: 100%; /* Ограничение ширины */
|
||||
}
|
||||
|
||||
.user-info {
|
||||
@ -842,6 +865,7 @@ h2 {
|
||||
.full-id {
|
||||
font-size: 0.8rem;
|
||||
word-break: break-all;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.report-content {
|
||||
@ -849,7 +873,9 @@ h2 {
|
||||
}
|
||||
|
||||
.info-section {
|
||||
padding: 1rem;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
@ -896,8 +922,9 @@ h2 {
|
||||
/* Маленькие экраны (481px - 767px) */
|
||||
@media (min-width: 481px) and (max-width: 767px) {
|
||||
.admin-report-detail {
|
||||
/* Corrected padding: top 1rem, sides 1rem, bottom 1.5rem */
|
||||
padding: 1rem 1rem 1.5rem 1rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
@ -946,8 +973,9 @@ h2 {
|
||||
/* Средние экраны (768px - 991px) */
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.admin-report-detail {
|
||||
/* Corrected padding: top 1.5rem, sides 1rem, bottom 2rem */
|
||||
padding: 1.5rem 1rem 2rem 1rem;
|
||||
max-width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.report-header {
|
||||
@ -967,24 +995,32 @@ h2 {
|
||||
.info-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1rem;
|
||||
.report-content {
|
||||
padding: 1.5rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Большие экраны (992px - 1199px) */
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.admin-report-detail {
|
||||
padding: 2rem 1.5rem; /* vertical 2rem, horizontal 1.5rem */
|
||||
padding: 2rem 1.5rem;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.info-grid {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Автоматическое управление колонками */
|
||||
gap: 1.5rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.info-section:last-child {
|
||||
@ -1000,14 +1036,17 @@ h2 {
|
||||
/* Очень большие экраны (1200px+) */
|
||||
@media (min-width: 1200px) {
|
||||
.admin-report-detail {
|
||||
padding: 2rem; /* All sides 2rem */
|
||||
padding: 2rem;
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.info-grid {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); /* Автоматическое управление колонками */
|
||||
gap: 2rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.info-section:last-child {
|
||||
@ -1032,186 +1071,30 @@ h2 {
|
||||
}
|
||||
}
|
||||
|
||||
/* Планшеты в ландшафтной ориентации */
|
||||
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
|
||||
.info-grid {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 1.5rem;
|
||||
/* Под шрифты и контент на разных разрешениях */
|
||||
@media (max-width: 576px) {
|
||||
.user-name {
|
||||
font-size: 0.95rem;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
gap: 1rem;
|
||||
.user-email {
|
||||
font-size: 0.8rem;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ландшафтная ориентация на мобильных */
|
||||
@media (max-height: 450px) and (orientation: landscape) {
|
||||
.admin-report-detail {
|
||||
/* Adjusted padding for landscape mobile */
|
||||
padding: 0.75rem 0.75rem 1rem 0.75rem; /* top, right, bottom, left */
|
||||
.description,
|
||||
.admin-notes {
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.header-controls {
|
||||
margin-bottom: 0.75rem;
|
||||
.form-group textarea {
|
||||
font-size: 1rem; /* Увеличение размера для лучшего взаимодействия на мобильных */
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 1rem;
|
||||
.modal-content {
|
||||
max-width: 100%;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.report-header {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.report-content {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.info-section {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.modal {
|
||||
max-height: 85vh;
|
||||
}
|
||||
}
|
||||
|
||||
/* Высокие экраны */
|
||||
@media (min-height: 800px) {
|
||||
.admin-report-detail {
|
||||
min-height: calc(100vh - 200px);
|
||||
}
|
||||
|
||||
.report-card {
|
||||
min-height: 400px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Улучшения для сенсорных экранов */
|
||||
@media (hover: none) and (pointer: coarse) {
|
||||
.btn {
|
||||
min-height: 44px;
|
||||
min-width: 44px;
|
||||
}
|
||||
|
||||
.back-btn {
|
||||
min-height: 44px;
|
||||
min-width: 44px;
|
||||
}
|
||||
|
||||
.view-user-btn {
|
||||
min-height: 44px;
|
||||
}
|
||||
|
||||
.modal-close {
|
||||
min-height: 44px;
|
||||
min-width: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Принтеры */
|
||||
@media print {
|
||||
.admin-report-detail {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.header-controls,
|
||||
.report-actions,
|
||||
.modal-overlay {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.report-card {
|
||||
box-shadow: none;
|
||||
border: 1px solid #000;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
border-bottom: 2px solid #000;
|
||||
padding-bottom: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Пользовательские карточки */
|
||||
.users-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
background: white;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 0.5rem;
|
||||
padding: 1rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.user-card:hover {
|
||||
border-color: #007bff;
|
||||
box-shadow: 0 2px 8px rgba(0, 123, 255, 0.1);
|
||||
}
|
||||
|
||||
.user-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.user-role {
|
||||
font-weight: 600;
|
||||
font-size: 0.85rem;
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.user-details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.user-email {
|
||||
color: #6c757d;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.arrow-divider {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #007bff;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.description-container,
|
||||
.admin-notes-container {
|
||||
background: white;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 0.375rem;
|
||||
padding: 1rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.resolve-date {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: #28a745;
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user