✅ Restauração do código oficial do GPI-JWT-V3
This commit is contained in:
402
src/client/styles/reports.css
Normal file
402
src/client/styles/reports.css
Normal file
@@ -0,0 +1,402 @@
|
||||
/* Report Print Styles */
|
||||
|
||||
@page {
|
||||
size: A4;
|
||||
margin: 10mm;
|
||||
}
|
||||
|
||||
.report-container {
|
||||
visibility: visible;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 210mm;
|
||||
min-height: 297mm;
|
||||
background: #fff;
|
||||
padding: 12mm;
|
||||
box-sizing: border-box;
|
||||
color: #000;
|
||||
font-family: system-ui, -apple-system, sans-serif;
|
||||
font-size: 11pt;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
@media screen {
|
||||
.report-container {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: #fff !important;
|
||||
color: #000 !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
-webkit-print-color-adjust: exact !important;
|
||||
print-color-adjust: exact !important;
|
||||
}
|
||||
|
||||
/* Esconde tudo */
|
||||
body * {
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
/* Mostra apenas o container do relatório e seus filhos */
|
||||
.report-container,
|
||||
.report-container * {
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
.report-container {
|
||||
display: block !important;
|
||||
position: absolute !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
width: 210mm !important;
|
||||
/* Largura fixa A4 */
|
||||
height: auto !important;
|
||||
min-height: 0 !important;
|
||||
margin: 0 !important;
|
||||
padding: 8mm !important;
|
||||
background-color: #fff !important;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.report-header {
|
||||
display: grid;
|
||||
grid-template-columns: 80px 1fr 180px;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #999;
|
||||
padding-bottom: 4mm;
|
||||
margin-bottom: 6mm;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.system-title {
|
||||
font-size: 8pt;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
text-transform: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.brand-title {
|
||||
font-size: 13pt;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.16em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.brand-subtitle {
|
||||
font-size: 8pt;
|
||||
color: #666;
|
||||
margin-top: 1mm;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.brand-logo {
|
||||
width: 36mm;
|
||||
height: 36mm;
|
||||
object-fit: contain;
|
||||
border-radius: 2mm;
|
||||
}
|
||||
|
||||
.logo-placeholder {
|
||||
width: 36mm;
|
||||
height: 36mm;
|
||||
border-radius: 2mm;
|
||||
border: 1px solid #ccc;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
.meta {
|
||||
text-align: right;
|
||||
font-size: 10pt;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.meta div {
|
||||
margin-bottom: 1mm;
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: inline-block;
|
||||
border: 1px solid #333;
|
||||
border-radius: 999px;
|
||||
padding: 1mm 3mm;
|
||||
font-size: 7pt;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.14em;
|
||||
margin-top: 2mm;
|
||||
}
|
||||
|
||||
.summary {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 4mm;
|
||||
margin-bottom: 6mm;
|
||||
}
|
||||
|
||||
.summary-item {
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2mm;
|
||||
padding: 3mm;
|
||||
}
|
||||
|
||||
.summary-label {
|
||||
font-size: 7pt;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.14em;
|
||||
color: #555;
|
||||
margin-bottom: 1mm;
|
||||
}
|
||||
|
||||
.summary-value {
|
||||
font-size: 13pt;
|
||||
font-weight: 700;
|
||||
margin-bottom: 1mm;
|
||||
}
|
||||
|
||||
.summary-sub {
|
||||
font-size: 8pt;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
margin: 2mm 0 2mm;
|
||||
border-top: 1px solid #ccc;
|
||||
padding-top: 2mm;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.section-title h2 {
|
||||
font-size: 9pt;
|
||||
letter-spacing: 0.16em;
|
||||
text-transform: uppercase;
|
||||
color: #333;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.section-title span {
|
||||
font-size: 8pt;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 1mm;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
.table thead th {
|
||||
text-align: left;
|
||||
padding: 2mm 1.5mm;
|
||||
border-bottom: 1px solid #000;
|
||||
font-size: 8pt;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.12em;
|
||||
}
|
||||
|
||||
.table tbody tr {
|
||||
border-bottom: 0.4pt solid #bbb;
|
||||
}
|
||||
|
||||
.table td {
|
||||
padding: 2mm 1.5mm;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.col-cod {
|
||||
width: 16mm;
|
||||
}
|
||||
|
||||
.col-obra {
|
||||
width: 45mm;
|
||||
}
|
||||
|
||||
.col-evol {
|
||||
width: 14mm;
|
||||
}
|
||||
|
||||
.col-cron {
|
||||
width: 36mm;
|
||||
}
|
||||
|
||||
.col-peso {
|
||||
width: 22mm;
|
||||
}
|
||||
|
||||
.col-tinta {
|
||||
width: 40mm;
|
||||
}
|
||||
|
||||
.col-cor {
|
||||
width: 20mm;
|
||||
}
|
||||
|
||||
.obra-nome {
|
||||
font-weight: 600;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
.obra-cliente {
|
||||
font-size: 8pt;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.evol-bar {
|
||||
margin-top: 1mm;
|
||||
height: 3mm;
|
||||
border-radius: 999px;
|
||||
background: #eee;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.evol-fill {
|
||||
height: 100%;
|
||||
background: #000 !important;
|
||||
width: var(--progress, 0%);
|
||||
}
|
||||
|
||||
.cron {
|
||||
font-size: 8pt;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.tinta {
|
||||
font-size: 8pt;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.tinta strong {
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.report-footer {
|
||||
margin-top: 4mm;
|
||||
border-top: 1px solid #999;
|
||||
padding-top: 2mm;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
/* Alinha o título do sistema com o texto do rodapé */
|
||||
font-size: 7.5pt;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.sig-group {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.sig-line {
|
||||
margin-top: 2mm;
|
||||
}
|
||||
|
||||
.sig-line span {
|
||||
display: inline-block;
|
||||
min-width: 38mm;
|
||||
border-bottom: 0.4pt solid #000;
|
||||
margin-left: 2mm;
|
||||
height: 3mm;
|
||||
}
|
||||
|
||||
.badge {
|
||||
font-size: 7pt;
|
||||
font-weight: 700;
|
||||
padding: 0.5mm 1.5mm;
|
||||
border-radius: 1mm;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.badge-ok {
|
||||
background: #eee;
|
||||
border: 1px solid #000;
|
||||
}
|
||||
|
||||
.badge-err {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.text-11pt {
|
||||
font-size: 11pt;
|
||||
}
|
||||
|
||||
.text-8pt {
|
||||
font-size: 8pt;
|
||||
}
|
||||
|
||||
.text-7pt {
|
||||
font-size: 7pt;
|
||||
}
|
||||
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.p-10mm {
|
||||
padding: 10mm;
|
||||
}
|
||||
|
||||
.p-5mm {
|
||||
padding: 5mm;
|
||||
}
|
||||
|
||||
.text-gray-muted {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.grid-2col {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 8mm;
|
||||
}
|
||||
|
||||
.w-15 {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
.w-20 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.w-25 {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.w-35 {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
.w-40 {
|
||||
width: 40%;
|
||||
}
|
||||
Reference in New Issue
Block a user