Spaces:
Sleeping
Sleeping
File size: 2,044 Bytes
470f9a1 09d63fd 470f9a1 09d63fd f157c01 09d63fd 470f9a1 284d622 09d63fd 284d622 09d63fd 284d622 f157c01 284d622 09d63fd 284d622 09d63fd 284d622 470f9a1 284d622 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 09d63fd 470f9a1 284d622 09d63fd | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 | @import url('https://fonts.googleapis.com/css2?family=Alegreya:ital,wght@0,400;0,500;0,700;0,800;0,900;1,400;1,500;1,700;1,800;1,900&display=swap');
@font-face {
font-family: 'YuMincho';
src: url("./fonts/yumin.ttf") format('truetype');
font-weight: regular;
}
:root {
--page-margin-x: 14mm;
--page-margin-y: 11mm;
--card-width: 91mm;
--card-height: 55mm;
--page-width: calc((210mm - 2 * var(--page-margin-x)));
--page-height: calc((297mm -2 * var(--page-margin-y)));
}
body {
font-size: 10pt;
color: #666;
font-family: Alegreya, "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", "MS PMincho", "Crimson Text", serif;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--card-width), 1fr));
grid-auto-rows: var(--card-height);
gap: 0;
}
h1 {
font-weight: bold;
}
p {
font-family: 'MS Mincho', serif;
}
img {
opacity: 1;
}
.card {
width: var(--card-width);
height: var(--card-height);
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(4, auto);
align-items: center;
justify-items: center;
border: 0px solid black;
position: relative;
}
.card > * {
margin: 0;
top: 0;
left: 0;
}
.card h1 {
font-size: 1.4rem;
font-weight: bold;
grid-column: 1;
grid-row: 2; /* centering h1 */
}
.card h2 {
font-size: 1rem;
grid-column: 1;
}
.card h3 {
font-size: 1rem;
grid-column: 1;
}
.card ul {
list-style: none;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-content: flex-start;
grid-column: 1;
}
.card ol {
list-style: none;
padding: 0;
}
.card li {
font-size: 0.6rem;
flex-basis: 50%;
}
.card img {
max-width: 100%;
max-height: 100%;
justify-self: end;
align-self: end;
position: absolute;
object-fit: cover;
z-index: -1;
}
@media print {
body {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-auto-rows: minmax(55mm, auto);
margin: var(--page-margin-y) var(--page-margin-x);
gap: 0;
}
.card {
margin: 0;
border: none;
width: auto;
height: auto;
}
} |