ruidy/deno_hello
1
0
Fork 0
mirror of https://github.com/rjNemo/deno_hello synced 2026-06-06 01:56:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

frontend css

Browse source
This commit is contained in:
Ruidy 2021-05-06 18:21:24 +02:00
parent 4cb341715c
commit df159cc6cb
1 changed files with 17 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
view.ts
View file

@ -5,30 +5,36 @@ export const htmlBody = ({ locale: language, message: hello }: Locale) =>
<html lang="en"> <html lang="en">
<head> <head>
<style> <style>
html,body {
height: 100%;
}
body { body {
max-width: 650px; max-width: 650px;
margin: 40px auto; margin: 40px auto;
padding: 0 10px; padding: 0 10px;
font: 18px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font: 18px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
color: #444 color: #444;
display: flex;
flex-direction: column;
justify-content: center;
} }
h1, h2, h3 { h1, h2, h3 {
line-height: 1.2 line-height: 1.2;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
body { body {
color: white; color: white;
background: #444 background: #444;
} }
a:link { a:link {
color: #5bf color: #5bf;
} }
a:visited { a:visited {
color: #ccf color: #ccf;
} }
} }
</style> </style>
@ -39,8 +45,10 @@ export const htmlBody = ({ locale: language, message: hello }: Locale) =>
<meta name="description" content="Simple client for Hello deno back end"> <meta name="description" content="Simple client for Hello deno back end">
<title>Hello client</title> <title>Hello client</title>
</head> </head>
<body> <body>
<h1>${hello}</h1> <article>
<p>Language: ${language}</p> <h1>${hello}</h1>
</body> <p>Language: ${language}</p>
</article>
</body>
</html>`; </html>`;