inline css

This commit is contained in:
max_richter 2025-01-06 19:01:19 +01:00
parent ba23bd9318
commit 6e82d9ca73
2 changed files with 60 additions and 57 deletions

View File

@ -1,13 +1,12 @@
import { AppProps } from "$fresh/server.ts";
import { PageProps } from "$fresh/server.ts";
import { Head } from "$fresh/runtime.ts";
export default function App({ Component }: AppProps) {
export default function App({ Component }: PageProps) {
const css = Deno.readTextFileSync("./static/global.css").replace("\n", "");
return (
<>
<Head>
<link href="/global.css" rel="stylesheet" />
<link href="/prism-material-dark.css" rel="stylesheet" />
<link
rel="apple-touch-icon"
sizes="180x180"
@ -31,54 +30,7 @@ export default function App({ Component }: AppProps) {
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#141218" />
<script src="/thumbnails.js" type="module"></script>
<style>
{`
:root {
--background: rgb(43, 41, 48);
--foreground: rgb(129, 129, 129);
--light: #2B2930;
}
.custom-grid {
grid-template-columns: repeat(auto-fit, minmax(37vw, 1fr)) ;
}
@media(min-width: 640px){
.custom-grid {
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) ;
}
}
/* work-sans-regular - latin */
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 400;
src: url('/fonts/work-sans-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-700 - latin */
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 700;
src: url('/fonts/work-sans-v18-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
body {
background: #141218;
padding: 0px 20px;
}
pre {
font-family:Work Sans;
}
a {
color: cadetblue;
font-family: Work Sans;
}
`}
</style>
<style>{css}</style>
</Head>
<Component />
</>

View File

@ -1,11 +1,62 @@
:root {
--background: rgb(43, 41, 48);
--foreground: rgb(129, 129, 129);
--light: #2B2930;
}
.custom-grid {
grid-template-columns: repeat(auto-fit, minmax(37vw, 1fr));
}
@media(min-width: 640px) {
.custom-grid {
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
}
/* work-sans-regular - latin */
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 400;
src: url('/fonts/work-sans-v18-latin-regular.woff2') format('woff2');
/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-700 - latin */
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 700;
src: url('/fonts/work-sans-v18-latin-700.woff2') format('woff2');
/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
body {
background: #141218;
padding: 0px 20px;
}
pre {
font-family: Work Sans;
}
a {
color: cadetblue;
font-family: Work Sans;
}
.animate-hover {
animation: hover 4s infinite;
animation: hover 4s infinite;
}
@keyframes hover {
0%, 100% {
0%,
100% {
transform: translateY(-15%);
}
50% {
transform: translateY(0);
}
@ -38,7 +89,7 @@ input[type=number] {
content: "";
top: 0;
left: 0;
z-index:0;
z-index: 0;
position: absolute;
height: 100%;
width: 100%;
@ -58,6 +109,6 @@ input[type=number] {
fill: #dcdbdc;
}
.items-52 > * {
height: 52px;
.items-52>* {
height: 52px;
}