- made font available on all elements with body and pre
- added an example for later better accessibility with pre
This commit is contained in:
21
index.html
21
index.html
@@ -10,6 +10,7 @@
|
|||||||
<link href="./styles/style.css" type="text/css" rel="stylesheet">
|
<link href="./styles/style.css" type="text/css" rel="stylesheet">
|
||||||
<link href="./styles/global.css" type="text/css" rel="stylesheet">
|
<link href="./styles/global.css" type="text/css" rel="stylesheet">
|
||||||
<link href="./styles/text.css" type="text/css" rel="stylesheet">
|
<link href="./styles/text.css" type="text/css" rel="stylesheet">
|
||||||
|
<link href="./styles/pre.css" type="text/css" rel="stylesheet">
|
||||||
<link href="./styles/frames.css" type="text/css" rel="stylesheet">
|
<link href="./styles/frames.css" type="text/css" rel="stylesheet">
|
||||||
<link href="./styles/banners.css" type="text/css" rel="stylesheet">
|
<link href="./styles/banners.css" type="text/css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
@@ -40,6 +41,26 @@
|
|||||||
: 57447 U+E067
|
: 57447 U+E067
|
||||||
|
|
||||||
<section style="height: 200px;" class="left child-left-dense horizontal">
|
<section style="height: 200px;" class="left child-left-dense horizontal">
|
||||||
|
|
||||||
|
accessibility pre : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre#specifications
|
||||||
|
|
||||||
|
<figure>
|
||||||
|
<pre role="img" aria-label="ASCII COW">
|
||||||
|
___________________________
|
||||||
|
< I'm an expert in my field. >
|
||||||
|
---------------------------
|
||||||
|
\ ^__^
|
||||||
|
\ (oo)\_______
|
||||||
|
(__)\ )\/\
|
||||||
|
||----w |
|
||||||
|
|| ||
|
||||||
|
</pre>
|
||||||
|
<figcaption id="cow-caption">
|
||||||
|
A cow saying, "I'm an expert in my field." The cow is illustrated using
|
||||||
|
preformatted text characters.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
11
styles/pre.css
Normal file
11
styles/pre.css
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
pre {
|
||||||
|
line-height: 0.8;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 530px) {
|
||||||
|
pre {
|
||||||
|
font-size: 2.2vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@@ -5,18 +5,14 @@
|
|||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
h1, h2, h3, h4, h5, h6, p, pre, li {
|
/*
|
||||||
|
*/
|
||||||
|
body, pre {
|
||||||
font-family: "notomono", monospace;
|
font-family: "notomono", monospace;
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
p, li {
|
|
||||||
}
|
|
||||||
pre {
|
|
||||||
line-height: 0.8;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
ul {
|
ul {
|
||||||
/*
|
/*
|
||||||
*/
|
*/
|
||||||
@@ -29,9 +25,3 @@ li {
|
|||||||
li::marker {
|
li::marker {
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 530px) {
|
|
||||||
pre {
|
|
||||||
font-size: 2.2vw;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|||||||
Reference in New Issue
Block a user