added report styles

This commit is contained in:
2025-09-14 20:03:04 +03:00
parent 2ab098063e
commit 87938e7459
5 changed files with 228 additions and 15 deletions

View File

@@ -693,26 +693,30 @@ body.dark-mode .export-description {
}
/* Specific styles for Quality Reports Card ONLY */
.report-form-card {
padding: 15px; /* Reduced padding for more compact card */
}
.report-form-card .form-centered {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 15px;
gap: 10px; /* Reduced gap between columns */
align-items: center;
padding: 6px 0; /* Reduced vertical padding */
padding: 0; /* No vertical padding for maximum compactness */
}
.report-form-card .form-centered .report-description {
margin: 0;
padding-right: 10px;
font-size: 0.85em; /* Smaller text for quality reports */
line-height: 1.3;
padding-right: 5px; /* Reduced padding */
font-size: 0.82em; /* Slightly smaller text */
line-height: 1.2; /* Tighter line spacing */
}
.report-form-card .form-centered .btn {
margin: 0;
white-space: nowrap;
font-size: 0.8em; /* Smaller button text for quality reports */
padding: 8px 12px; /* Adjust padding for smaller text */
font-size: 0.78em; /* Smaller button text */
padding: 6px 10px; /* Reduced button padding for compactness */
}
/* Keep original form-centered styles for other pages */
@@ -764,20 +768,27 @@ body.dark-mode .export-description {
/* Responsive design for Quality Reports Card only */
@media (max-width: 768px) {
.report-form-card {
padding: 10px; /* Even more compact on mobile */
}
.report-form-card .form-centered {
grid-template-columns: 1fr;
gap: 10px;
gap: 5px; /* Reduced gap on mobile */
text-align: center;
padding: 0; /* No vertical padding on mobile */
}
.report-form-card .form-centered .report-description {
padding-right: 0;
margin-bottom: 5px;
font-size: 0.8em; /* Even smaller on mobile */
margin-bottom: 2px; /* Very tight spacing */
font-size: 0.78em; /* Smaller text on mobile */
line-height: 1.1; /* Tighter line spacing on mobile */
}
.report-form-card .form-centered .btn {
font-size: 0.75em; /* Smaller buttons on mobile */
font-size: 0.72em; /* Smaller buttons on mobile */
padding: 4px 8px; /* Reduced button padding on mobile */
}
}