edpibu/web2.0
1
Fork 0
Code Issues Activity

Move print css to separate file

Browse source
This commit is contained in:
Edgar P. Burkhart 2023-03-18 17:27:47 +01:00
parent 67983bb3df
commit 648b681709
Signed by: edpibu
GPG key ID: 9833D3C5A25BD227
3 changed files with 43 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/index.html
View file

@ -16,6 +16,7 @@
<link rel="stylesheet" href="static/fonts/inter/inter.css" />
<link rel="stylesheet" href="static/fonts/remix/remixicon.css" />
<link rel="stylesheet" href="static/css/main.css" />
<link rel="stylesheet" media="print" href="static/css/print.css" />
<link
rel="preload"

48
src/static/css/main.css
View file

@ -59,11 +59,6 @@ body {
grid-template-columns: 1fr;
grid-gap: var(--colgap);
}
@media print {
body {
display: block;
}
}
/* body > div {
column-width: var(--colw);
column-gap: var(--gap);
@ -94,21 +89,6 @@ h1 {
margin: 0;
}
}
@media print {
div.title {
display: grid;
grid-template-columns: 1fr min-content;
align-items: center;
}
div.title > img {
grid-column: -1;
margin: 0;
}
div.title > * {
grid-row: 1;
margin: 0;
}
}
h1, h2, h3 {
font-weight: 250;
@ -135,12 +115,6 @@ h4 {font-size: 1.2rem}
h5 {font-size: 1rem}
h6 {font-size: .8rem}
@media print {
h2 {
display: none;
}
}
p, ul, ol, dl {line-height: var(--lh)}
em {font-variation-settings: 'slnt' -5}
strong {font-weight: 550}
@ -192,7 +166,7 @@ dd {
color: inherit;
text-decoration: none;
}
@media not print {
@media screen {
.link-block > a {
background: var(--bg-01);
padding: var(--gap);
@ -202,17 +176,6 @@ dd {
grid-template-rows: 1fr auto;
}
}
@media print {
.img-block {
display: none;
}
.link-block > a {
height: auto;
}
.link-block > a > .i {
display: none;
}
}
.link-block > a:hover {
background: var(--bg-02);
}
@ -244,13 +207,4 @@ footer {
margin: calc(-1 * var(--gap));
margin-top: 0;
}
@media print {
footer {
display: none;
}
}
@page {
size: a4 portrait;
margin: 2cm;
}

41
src/static/css/print.css Normal file
View file

@ -0,0 +1,41 @@
body {
display: block;
}
div.title {
display: grid;
grid-template-columns: 1fr min-content;
align-items: center;
}
div.title > img {
grid-column: -1;
margin: 0;
}
div.title > * {
grid-row: 1;
margin: 0;
}
h2 {
display: none;
}
.img-block {
display: none;
}
.link-block > a {
height: auto;
}
.link-block > a > .i {
display: none;
}
footer {
display: none;
}
@page {
size: a4 portrait;
margin: 2cm;
}