signs/public/signs.css

104 lines
2.1 KiB
CSS

@page {
margin: 0;
size: A4 landscape;
}
html {
font-family: 'Orbitron', sans-serif;
}
body {
margin: 0
}
.sheet {
display: table;
margin: 0;
position: relative;
box-sizing: border-box;
page-break-after: always;
padding: 10mm;
width: 297mm;
height: 209mm
}
/* Put everything in the correct location */
.logo {
display: table-row;
font-size: 15mm;
}
.main {
display: table-row;
font-size: 25mm;
width: 100%;
height: 12.5cm;
margin: 1cm 0;
text-align: center;
}
.subline {
display: table-row;
font-size: 12mm;
text-align: center;
}
.editable {
display: table-cell;
vertical-align: middle;
-webkit-user-modify: read-write;
-moz-user-modify: read-write;
user-modify: read-write;
border: none;
outline: none;
}
/** Screen **/
@media screen {
body {
background: #eee
}
.sheet {
background: white;
box-shadow: 0 .5mm 2mm rgba(0, 0, 0, .3);
margin: 20mm auto;
}
.sheet, .sheet::before, .sheet::after {
box-shadow: 1px 1px 1px rgba(0, 0, 0, .4);
border: 1px solid #bbb;
}
.sheet::before, .sheet::after {
content: "";
position: absolute;
width: 297mm;
height: 210mm;
background-color: #eee;
}
.sheet::before {
right: 15px;
top: 0;
transform: rotate(-1deg);
z-index: -1;
}
.sheet::after {
top: 5px;
right: -5px;
transform: rotate(1deg);
z-index: -2;
}
}
@media print {
body {
width: 297mm
}
.sheet {
overflow: hidden;
/* Make input caret transparent */
color: transparent;
text-shadow: 0 0 0 #000;
}
}