CSS
This commit is contained in:
parent
42b0dca91a
commit
bbbb9fac8d
5 changed files with 71 additions and 2 deletions
BIN
AtkinsonHyperlegible-Regular.woff2
Normal file
BIN
AtkinsonHyperlegible-Regular.woff2
Normal file
Binary file not shown.
62
index.css
Normal file
62
index.css
Normal file
|
@ -0,0 +1,62 @@
|
|||
@import url('./AtkinsonHyperlegible-Regular.woff2');
|
||||
|
||||
.atkinson-hyperlegible-regular {
|
||||
font-family: "Atkinson Hyperlegible", serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.atkinson-hyperlegible-bold {
|
||||
font-family: "Atkinson Hyperlegible", serif;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Atkinson Hyperlegible';
|
||||
padding: 1%;
|
||||
height: 100vh;
|
||||
font-size: 18px;
|
||||
max-width: 40em;
|
||||
margin: 1%, 1%, 1%, 1%;
|
||||
background: linear-gradient(234deg, #ffecf2, #ffd9e5);
|
||||
-webkit-animation: AnimationName 5s ease infinite;
|
||||
-moz-animation: AnimationName 5s ease infinite;
|
||||
-o-animation: AnimationName 5s ease infinite;
|
||||
animation: AnimationName 5s ease infinite;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background: linear-gradient(234deg, #28282B, #353935);
|
||||
-webkit-animation: AnimationName 5s ease infinite;
|
||||
-moz-animation: AnimationName 5s ease infinite;
|
||||
-o-animation: AnimationName 5s ease infinite;
|
||||
animation: AnimationName 5s ease infinite;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes AnimationName {
|
||||
0%{background-position:0% 50%}
|
||||
50%{background-position:100% 50%}
|
||||
100%{background-position:0% 50%}
|
||||
}
|
||||
|
||||
@-moz-keyframes AnimationName {
|
||||
0%{background-position:0% 50%}
|
||||
50%{background-position:100% 50%}
|
||||
100%{background-position:0% 50%}
|
||||
}
|
||||
|
||||
@-o-keyframes AnimationName {
|
||||
0%{background-position:0% 50%}
|
||||
50%{background-position:100% 50%}
|
||||
100%{background-position:0% 50%}
|
||||
}
|
||||
|
||||
@keyframes AnimationName {
|
||||
0%{background-position:0% 50%}
|
||||
50%{background-position:100% 50%}
|
||||
100%{background-position:0% 50%}
|
||||
}
|
|
@ -1,7 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<head>
|
||||
<title>Every pizza instant messenger!</title>
|
||||
<title>Every pizza instant messenger!</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="index.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<header>home | <a href="rules.html">rules</a> | <a href="sysinfo.html">system info</a></header>
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<head>
|
||||
<title>Every pizza instant messenger! (rules)</title>
|
||||
<title>Every pizza instant messenger! (rules)</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="index.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<header><a href="index.html">home</a> | rules | <a href="sysinfo.html">system info</a></header>
|
||||
|
|
|
@ -1,5 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>Every pizza instant messenger! (system info)</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="index.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<header><a href="index.html">home</a> | <a href="rules.html">rules</a> | system info</header>
|
||||
|
|
Loading…
Add table
Reference in a new issue