фикс
This commit is contained in:
Professional
parent
157a29ceb2
commit
52e8199ba5
@ -31,16 +31,22 @@
|
||||
<div class="report-header">
|
||||
<div class="report-info">
|
||||
<div class="report-id-section">
|
||||
<i class="bi-file-text"></i>
|
||||
<i class="bi-file-text report-icon"></i>
|
||||
<div class="id-info">
|
||||
<h3>Жалоба #{{ report._id.substring(0, 8) }}</h3>
|
||||
<span class="full-id">ID: {{ report._id }}</span>
|
||||
<h3 class="report-title">Жалоба #{{ report._id.substring(0, 8) }}</h3>
|
||||
<div class="full-id-container">
|
||||
<span class="id-label">ID:</span>
|
||||
<span class="full-id">{{ report._id }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="report-date">
|
||||
<i class="bi-calendar3"></i>
|
||||
<span>Подана {{ formatDate(report.createdAt) }}</span>
|
||||
<i class="bi-calendar3 date-icon"></i>
|
||||
<div class="date-info">
|
||||
<span class="date-label">Подана</span>
|
||||
<span class="date-value">{{ formatDate(report.createdAt) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -142,11 +148,11 @@
|
||||
<h4>Действия с жалобой</h4>
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<button @click="showResolveModal = true" class="btn resolve-btn">
|
||||
<button @click="openResolveModal" class="btn resolve-btn">
|
||||
<i class="bi-check-circle"></i>
|
||||
<span>Рассмотреть</span>
|
||||
</button>
|
||||
<button @click="showDismissModal = true" class="btn dismiss-btn">
|
||||
<button @click="openDismissModal" class="btn dismiss-btn">
|
||||
<i class="bi-x-circle"></i>
|
||||
<span>Отклонить</span>
|
||||
</button>
|
||||
@ -271,6 +277,7 @@ export default {
|
||||
|
||||
// Обновление статуса жалобы
|
||||
const updateReportStatus = async (status) => {
|
||||
console.log('updateReportStatus called with status:', status);
|
||||
updating.value = true;
|
||||
|
||||
try {
|
||||
@ -301,6 +308,20 @@ export default {
|
||||
}
|
||||
};
|
||||
|
||||
// Функция для открытия модального окна рассмотрения
|
||||
const openResolveModal = () => {
|
||||
console.log('openResolveModal called, current showResolveModal:', showResolveModal.value);
|
||||
showResolveModal.value = true;
|
||||
console.log('showResolveModal set to:', showResolveModal.value);
|
||||
};
|
||||
|
||||
// Функция для открытия модального окна отклонения
|
||||
const openDismissModal = () => {
|
||||
console.log('openDismissModal called, current showDismissModal:', showDismissModal.value);
|
||||
showDismissModal.value = true;
|
||||
console.log('showDismissModal set to:', showDismissModal.value);
|
||||
};
|
||||
|
||||
// Возврат к списку жалоб
|
||||
const goBack = () => {
|
||||
router.push({ name: 'AdminReports' });
|
||||
@ -375,6 +396,11 @@ export default {
|
||||
|
||||
onMounted(() => {
|
||||
loadReport();
|
||||
|
||||
// Отладочная информация о состоянии модальных окон
|
||||
console.log('Component mounted, initial modal states:');
|
||||
console.log('showResolveModal:', showResolveModal.value);
|
||||
console.log('showDismissModal:', showDismissModal.value);
|
||||
});
|
||||
|
||||
return {
|
||||
@ -387,6 +413,8 @@ export default {
|
||||
adminNotes,
|
||||
loadReport,
|
||||
updateReportStatus,
|
||||
openResolveModal,
|
||||
openDismissModal,
|
||||
goBack,
|
||||
viewUser,
|
||||
formatDate,
|
||||
@ -518,47 +546,107 @@ h2 {
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
min-height: 80px;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.report-id-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.report-icon {
|
||||
color: #007bff;
|
||||
font-size: 1.5rem;
|
||||
margin-top: 0.25rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.id-info {
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.report-info h3 {
|
||||
margin: 0;
|
||||
.report-title {
|
||||
margin: 0 0 0.5rem 0;
|
||||
color: #333;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.full-id-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.25rem;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.id-label {
|
||||
color: #6c757d;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 500;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
color: #6c757d;
|
||||
font-size: 0.9rem;
|
||||
font-size: 0.85rem;
|
||||
word-break: break-all;
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
font-family: 'Courier New', monospace;
|
||||
background: rgba(108, 117, 125, 0.1);
|
||||
padding: 0.125rem 0.25rem;
|
||||
border-radius: 0.25rem;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
color: #6c757d;
|
||||
font-size: 0.9rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.25rem;
|
||||
align-items: flex-start;
|
||||
gap: 0.5rem;
|
||||
flex-shrink: 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.date-icon {
|
||||
color: #28a745;
|
||||
font-size: 1.1rem;
|
||||
margin-top: 0.125rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.125rem;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.date-label {
|
||||
font-size: 0.8rem;
|
||||
color: #6c757d;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 0.9rem;
|
||||
color: #495057;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@ -714,7 +802,6 @@ h2 {
|
||||
transition: all 0.2s ease;
|
||||
text-decoration: none;
|
||||
min-height: 40px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.resolve-btn {
|
||||
@ -963,114 +1050,71 @@ h2 {
|
||||
}
|
||||
|
||||
.report-header {
|
||||
padding: 1rem;
|
||||
padding: 0.75rem;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.report-content,
|
||||
.info-section,
|
||||
.report-actions {
|
||||
padding: 1rem;
|
||||
.report-info {
|
||||
width: 100%;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.back-btn .btn-text {
|
||||
display: none;
|
||||
.report-id-section {
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 0.75rem;
|
||||
position: relative;
|
||||
padding: 0.5rem 0;
|
||||
.report-icon {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.arrow-divider {
|
||||
position: absolute;
|
||||
top: calc(50% - 1rem);
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: white;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 50%;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||||
z-index: 2;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.report-title {
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
display: none;
|
||||
.full-id-container {
|
||||
flex-direction: column;
|
||||
gap: 0.125rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.vs-text {
|
||||
display: block;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
padding: 0.75rem;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.user-header {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.user-role {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.user-email {
|
||||
.id-label {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.view-user-btn {
|
||||
padding: 0.3rem 0.5rem;
|
||||
.full-id {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.0625rem 0.125rem;
|
||||
width: 100%;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
width: 100%;
|
||||
gap: 0.375rem;
|
||||
text-align: left;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.date-icon {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
text-align: left;
|
||||
gap: 0.0625rem;
|
||||
}
|
||||
|
||||
.date-label {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.view-user-btn span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.reporter {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.reported {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
padding: 0.75rem 1rem;
|
||||
}
|
||||
|
||||
.modal-actions {
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.modal-actions .btn {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1080,57 +1124,34 @@ h2 {
|
||||
padding: 1rem 0.75rem calc(60px + env(safe-area-inset-bottom, 0px)) 0.75rem;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1rem;
|
||||
position: relative;
|
||||
padding: 0.75rem 0;
|
||||
}
|
||||
|
||||
.arrow-divider {
|
||||
position: absolute;
|
||||
top: calc(50% - 0.75rem);
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: white;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 50%;
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||||
z-index: 2;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.vs-text {
|
||||
display: block;
|
||||
font-size: 0.85rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.reporter {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.reported {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
.report-header {
|
||||
padding: 1rem;
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
align-items: flex-start;
|
||||
gap: 1rem;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.btn {
|
||||
.report-info {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1140,43 +1161,26 @@ h2 {
|
||||
padding: 1.25rem calc(60px + env(safe-area-inset-bottom, 0px)) 1.25rem;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
position: relative;
|
||||
.report-header {
|
||||
padding: 1.25rem;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.arrow-divider {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -0.5rem;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
background: #f8f9fa;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #dee2e6;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||||
margin: 0;
|
||||
.report-info {
|
||||
flex: 1;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
transform: rotate(90deg);
|
||||
.report-date {
|
||||
flex-shrink: 0;
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
width: 100%;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.view-user-btn {
|
||||
align-self: flex-start;
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
justify-content: center;
|
||||
.date-value {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1186,17 +1190,21 @@ h2 {
|
||||
padding: 1.5rem 1.25rem calc(60px + env(safe-area-inset-bottom, 0px)) 1.25rem;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
.report-header {
|
||||
padding: 1.5rem;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
display: block;
|
||||
.report-info {
|
||||
flex: 1;
|
||||
max-width: calc(100% - 200px);
|
||||
}
|
||||
|
||||
.vs-text {
|
||||
display: none;
|
||||
.report-date {
|
||||
flex-shrink: 0;
|
||||
min-width: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1206,10 +1214,18 @@ h2 {
|
||||
padding: 2rem 1.5rem calc(60px + env(safe-area-inset-bottom, 0px)) 1.5rem;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
.report-header {
|
||||
padding: 1.75rem;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
max-width: calc(100% - 220px);
|
||||
}
|
||||
|
||||
.report-date {
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Десктопные экраны (1200px+) */
|
||||
@ -1220,30 +1236,29 @@ h2 {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
.report-header {
|
||||
padding: 2rem;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
min-height: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Планшеты в ландшафтной ориентации */
|
||||
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
|
||||
.admin-report-detail {
|
||||
padding: 1.5rem 1.25rem calc(60px + env(safe-area-inset-bottom, 0px)) 1.25rem;
|
||||
.report-info {
|
||||
max-width: calc(100% - 250px);
|
||||
}
|
||||
|
||||
.users-grid {
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
gap: 1.25rem;
|
||||
.report-date {
|
||||
min-width: 230px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
.report-title {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1325,4 +1340,247 @@ h2 {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Адаптивные стили для блока header жалобы на разных экранах */
|
||||
|
||||
/* Очень маленькие экраны (до 360px) - адаптация header */
|
||||
@media (max-width: 360px) {
|
||||
.report-header {
|
||||
padding: 0.75rem;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
width: 100%;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.report-id-section {
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.report-icon {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.full-id-container {
|
||||
flex-direction: column;
|
||||
gap: 0.125rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.id-label {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.0625rem 0.125rem;
|
||||
width: 100%;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
width: 100%;
|
||||
gap: 0.375rem;
|
||||
text-align: left;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.date-icon {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
text-align: left;
|
||||
gap: 0.0625rem;
|
||||
}
|
||||
|
||||
.date-label {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 0.8rem;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
/* Маленькие экраны (361px - 480px) - адаптация header */
|
||||
@media (min-width: 361px) and (max-width: 480px) {
|
||||
.report-header {
|
||||
padding: 1rem;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 1rem;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
/* Средние экраны (481px - 767px) - адаптация header */
|
||||
@media (min-width: 481px) and (max-width: 767px) {
|
||||
.report-header {
|
||||
padding: 1.25rem;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
flex: 1;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
flex-shrink: 0;
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* Большие экраны (768px - 991px) - адаптация header */
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.report-header {
|
||||
padding: 1.5rem;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
flex: 1;
|
||||
max-width: calc(100% - 200px);
|
||||
}
|
||||
|
||||
.report-date {
|
||||
flex-shrink: 0;
|
||||
min-width: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Очень большие экраны (992px - 1199px) - адаптация header */
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.report-header {
|
||||
padding: 1.75rem;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
max-width: calc(100% - 220px);
|
||||
}
|
||||
|
||||
.report-date {
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Десктопные экраны (1200px+) - адаптация header */
|
||||
@media (min-width: 1200px) {
|
||||
.report-header {
|
||||
padding: 2rem;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
max-width: calc(100% - 250px);
|
||||
}
|
||||
|
||||
.report-date {
|
||||
min-width: 230px;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ландшафтная ориентация на мобильных - адаптация header */
|
||||
@media (max-height: 450px) and (orientation: landscape) {
|
||||
.report-header {
|
||||
padding: 0.75rem 1rem;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.report-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.full-id-container {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.full-id {
|
||||
font-size: 0.75rem;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.report-date {
|
||||
flex-shrink: 0;
|
||||
gap: 0.375rem;
|
||||
}
|
||||
|
||||
.date-info {
|
||||
gap: 0.0625rem;
|
||||
}
|
||||
|
||||
.date-label {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user