start/styles.css
2023-04-09 17:27:30 -05:00

109 lines
2.5 KiB
CSS

@font-face {
font-family: firacode;
src: url(firacode.ttf);
}
@font-face {
font-family: firacode_bold;
src: url(firacode_bold.ttf);
}
html {
align-items: center;
/*background: linear-gradient(315deg,#021B79,#0575E6);*/
background: radial-gradient(50% 123.47% at 50% 50%, #00FF94 0%, #720059 100%), linear-gradient(121.28deg, #669600 0%, #FF0000 100%), linear-gradient(360deg, #0029FF 0%, #8FFF00 100%), radial-gradient(100% 164.72% at 100% 100%, #6100FF 0%, #00FF57 100%), radial-gradient(100% 148.07% at 0% 0%, #FFF500 0%, #51D500 100%);
background-blend-mode: screen, color-dodge, overlay, difference, normal;
display: flex;
font: 22px/1 "firacode";
height: 100%;
justify-content: center;
}
body {
background-color: rgb(29, 31, 33, 1.0);
border-radius: 4px;
box-shadow: 10px 10px;
color: #000000;
display: flex;
flex-direction: column;
min-height: 20ch;
min-width: 50vw;
padding: 2em;
}
main_title {
margin: 0;
color: #ffffff;
}
main_title span {
color: #0fb1f1;
}
a {
color: inherit;
text-decoration: none;
color: #ffffff;
}
a:focus, a:hover {
font: 22px/1 "firacode_bold";
}
li:first-child {
font: 22px/1 "firacode_bold";
}
li:last-child {
margin: 0 0 1em;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
ul:nth-child(5n + 1) li:first-child {
background: -webkit-linear-gradient(right, #cb2d3e, #ef473a);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
ul:nth-child(5n + 2) li:first-child {
background: -webkit-linear-gradient(right, #f12711, #f5af19);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
ul:nth-child(5n + 3) li:first-child {
background: -webkit-linear-gradient(right, #1d976c, #93f9b9);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
ul:nth-child(5n + 4) li:first-child {
background: -webkit-linear-gradient(right, #9cecfb, #65c7f7, #0052d4);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
ul:nth-child(5n + 5) li:first-child {
background: -webkit-linear-gradient(right, #12c2e9, #c471ed, #f64f59);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
ul:nth-child(5n + 6) li:first-child {
background: -webkit-linear-gradient(right, #dce35b, #45b649);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
nav {
column-gap: 2em;
display: grid;
grid-template-columns: auto auto auto auto;
padding: 1em 0;
}