1
0
Fork 0
mirror of https://github.com/kou029w/quot.git synced 2025-01-31 14:28:06 +00:00

Compare commits

...

5 commits

Author SHA1 Message Date
3cd4337c04 lang unknown 2022-08-31 13:39:46 +09:00
d94e5a07e5 header layout 2022-08-31 13:00:45 +09:00
bd57d3564b change theme
use sans-serif and monospace fonts
2022-08-31 12:28:58 +09:00
4baea21380 shrink padding-inline in body 2022-08-31 12:08:56 +09:00
f14e66d938 shadow in hover 2022-08-31 12:02:23 +09:00
4 changed files with 34 additions and 5 deletions

View file

@ -1,8 +1,15 @@
:root { :root {
font-size: 12px; font-size: 12px;
--nc-font-sans: sans-serif;
--nc-font-mono: monospace;
--nc-lk-1: #1875d1;
--nc-lk-2: #004a9f;
--nc-ac-1: #f57f17;
--nc-ac-tx: var(--nc-tx-1);
} }
body { body {
padding-inline: 1rem;
max-inline-size: 80rem; max-inline-size: 80rem;
} }
@ -12,6 +19,19 @@ header {
justify-content: space-evenly; justify-content: space-evenly;
} }
header h1 {
margin: 0;
}
header h1 > a,
header h1 > a:hover {
color: var(--nc-ac-1);
}
header nav > * {
font-size: 1.55rem;
}
a[href^="/"] { a[href^="/"] {
text-decoration: none; text-decoration: none;
} }

View file

@ -35,12 +35,12 @@ export default () => {
<h1> <h1>
<a href="/">Quot</a> <a href="/">Quot</a>
</h1> </h1>
<a href="/new">📄</a> <nav>
<a href="/new">📄</a>
</nav>
</header> </header>
{routes[pathname()] ?? ( {routes[pathname()] ?? (
<Page <Page id={parseInt(pathname().slice(1), 16) || random()} />
id={parseInt(pathname().slice(1), 16) || random()}
/>
)} )}
</> </>
); );

View file

@ -3,3 +3,12 @@
gap: 1rem; gap: 1rem;
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
} }
.cards > a:hover::after {
content: "";
background-color: rgba(0, 0, 0, 10%);
display: block;
position: relative;
top: -100%;
height: 100%;
}

View file

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="ja" dir="ltr"> <html lang="" dir="ltr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />