207 lines
3.7 KiB
HTML
207 lines
3.7 KiB
HTML
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
|
<style>
|
|
body {
|
|
font-family: Arial;
|
|
}
|
|
|
|
table {
|
|
border: 0.35mm solid black; /* line weight based on DIN 15 */
|
|
padding: 0;
|
|
border-bottom: 0;
|
|
border-right: 0;
|
|
border-spacing: 0mm;
|
|
}
|
|
|
|
td {
|
|
border: 0.25mm solid black; /* line weight based on DIN 15 */
|
|
border-top: 0;
|
|
border-left: 0;
|
|
|
|
overflow: hidden;
|
|
/* display: inline-block; */
|
|
white-space: nowrap;
|
|
font-size: 2.8mm;
|
|
}
|
|
|
|
img {
|
|
position: relative;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
max-height: 100%;
|
|
max-width: 100%;
|
|
}
|
|
|
|
svg {
|
|
max-width: 95%;
|
|
max-height: 100%;
|
|
position: relative;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
#frame {
|
|
position: relative;
|
|
border: 0.35mm solid black
|
|
}
|
|
|
|
/* Canvas size based on DIN 823 / DIN 6771 / EN ISO 5457 */
|
|
|
|
.A4 { /* portrait */
|
|
width: 180mm;
|
|
height: 277mm;
|
|
}
|
|
|
|
.A3 { /* landscape */
|
|
width: 390mm;
|
|
height: 277mm;
|
|
}
|
|
|
|
.A2 { /* landscape */
|
|
width: 564mm;
|
|
height: 400mm;
|
|
}
|
|
|
|
.US_letter, .sheetsize_default {
|
|
width: 190mm;
|
|
height: 250mm;
|
|
}
|
|
|
|
.US_letter_landscape {
|
|
width: 250mm;
|
|
height: 190mm;
|
|
}
|
|
|
|
#titleblock {
|
|
position: absolute;
|
|
bottom: 0mm;
|
|
right: -0mm;
|
|
}
|
|
|
|
#titleblock table {
|
|
width: 120mm;
|
|
height: 38.25mm;
|
|
}
|
|
|
|
#titleblock tr, #bom tr {
|
|
height: 4.25mm;
|
|
}
|
|
|
|
.A4 #bom { /* BOM on top of title block */
|
|
position: absolute;
|
|
bottom: 38.25mm;
|
|
right: 0;
|
|
}
|
|
|
|
.A3 #bom, .A2 #bom { /* BOM to the left of title block */
|
|
position: absolute;
|
|
bottom: 0mm;
|
|
left: 0mm;
|
|
}
|
|
|
|
#bom table {
|
|
width:180mm
|
|
}
|
|
|
|
#diagram {
|
|
position: relative;
|
|
top: 0;
|
|
left: 0;
|
|
max-width: 100%;
|
|
height: calc(100% - 5 * 4.25mm);
|
|
/* TODO: auto-adapt to height of title block + BOM table;
|
|
BOM table might be above (A4) or to the left (A3 and larger) of the title block */
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.name {
|
|
width: 16mm;
|
|
}
|
|
|
|
.date {
|
|
width: 10mm;
|
|
}
|
|
|
|
.revno {
|
|
text-align: center;
|
|
width: 6mm;
|
|
}
|
|
|
|
.changelog {
|
|
width: 22mm;
|
|
}
|
|
|
|
.process {
|
|
width: 18mm;
|
|
}
|
|
|
|
.title {
|
|
width: 82mm;
|
|
font-size: 5mm;
|
|
text-align: center;
|
|
white-space: normal;
|
|
}
|
|
|
|
.company {
|
|
font-size: 4mm;
|
|
text-align: center;
|
|
white-space: normal;
|
|
}
|
|
|
|
.partno {
|
|
font-size: 5mm;
|
|
text-align: center;
|
|
white-space: normal;
|
|
}
|
|
|
|
.sheetno {
|
|
width: 12.75mm;
|
|
text-align: center;
|
|
}
|
|
|
|
</style>
|
|
<style type="text/css" media="print">
|
|
|
|
@page {
|
|
size: landscape;
|
|
margin: 0;
|
|
}
|
|
|
|
/* TODO: auto-adjust based on portrait (larger margin on left) or landscape (larger margin on top) */
|
|
#page {
|
|
margin: 13mm;
|
|
margin-left: 13mm;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="page">
|
|
<div id="frame" class="sheetsize_default">
|
|
|
|
<div id="diagram">
|
|
<!-- diagram -->
|
|
</div>
|
|
|
|
<div id="titleblock">
|
|
<table>
|
|
<tr>
|
|
<td class="title" colspan="3"><!-- part_title --></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="partno" colspan="3"><!-- part_number --></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="company" colspan="2"><!-- company --></td>
|
|
<td class="sheetno"><!-- sheet_current --> of <!-- sheet_total --></td>
|
|
</tr>
|
|
</table>
|
|
</div> <!-- /titleblock -->
|
|
|
|
</div> <!-- /frame -->
|
|
</div> <!-- /page -->
|
|
</body>
|
|
</html>
|