style.css
ASCII text
1/* Colors */ 2 3:root { 4--primary: #101010; 5--secondary: #f9a911; 6--teriary: #efee00; 7 8--primary-text: #fff; 9--primary-code: #1f1f1f; 10} 11 12/* Fonts */ 13 14@font-face { 15font-family: "Gully"; 16src: url("gully.ttf") format("truetype"); 17} 18 19@font-face { 20font-family: "Stampatello Faceto"; 21src: url("StampatelloFaceto.otf") format("truetype"); 22} 23 24@font-face { 25font-family: "RH Mono"; 26src: url("RedHatMonoVF.ttf") format("truetype"); 27} 28 29@font-face { 30font-family: "Willow"; 31src: url("willow.otf") format("truetype"); 32} 33 34/* Styles */ 35 36body { 37background-color: var(--primary); 38color: var(--primary-text); 39font-family: "Gully"; 40width: min(896px, 100vw); 41margin: 0 auto; 42padding: 35px; 43height: calc(100% - 70px); 44box-shadow: 0px 0px 50px #000; 45} 46 47html { 48background-image: url("./background.webp"); 49background-color: #FFF; 50height: 100%; 51} 52 53:is(h1, h2, h3, h4, h5, h6) { 54font-family: "Willow"; 55} 56 57:any-link { 58background: linear-gradient( 5990deg, 60rgb(255, 150, 150) 0%, 61rgb(255, 194, 102) 10%, 62rgb(244, 255, 107) 20%, 63rgb(176, 253, 173) 30%, 64rgb(155, 255, 254) 40%, 65rgb(192, 246, 255) 50%, 66rgb(96, 172, 255) 60%, 67rgb(138, 79, 255) 70%, 68rgb(217, 110, 255) 80%, 69rgb(255, 126, 237) 90%, 70rgb(255, 145, 145) 100% 71); 72background-clip: text; 73-webkit-text-fill-color: transparent; 74} 75 76th, 77td { 78text-align: center; 79} 80 81#ThemeList { 82padding: 0; 83margin: 0; 84} 85 86#ThemeList li { 87width: fit-content; 88display: inline-block; 89list-style: none; 90 91} 92 93code { 94background-color: var(--primary-code); 95display: inline-block; 96font-family: "RH Mono"; 97} 98 99code:has(pre) { 100display: block; 101padding: 5px; 102} 103 104[aria-label=breadcrumbs] ol { 105padding: 0; 106} 107 108[aria-label=breadcrumbs] li { 109list-style: none; 110display: inline-block; 111} 112 113[aria-label=breadcrumbs] li + li::before { 114content: " / "; 115} 116