feat: add link to junk, add about, better css
This commit is contained in:
parent
25d42c745a
commit
30e523a698
3 changed files with 87 additions and 30 deletions
30
about.html
Normal file
30
about.html
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
<!doctype html>
|
||||
<html lang="en-US">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>About Yozora.Tech</title>
|
||||
<link rel="stylesheet" href="/res/main.css" />
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<a class="logo" href="//yozora.tech/">
|
||||
<svg width="192" height="48" aria-label="Yozora.Tech">
|
||||
<use xlink:href="/res/yozora.tech.svg#logo" />
|
||||
</svg>
|
||||
</a>
|
||||
<ul class="links">
|
||||
<li><a href="/about.html">About</a></li>
|
||||
</li>
|
||||
</nav>
|
||||
<main>
|
||||
<h1>About</h1>
|
||||
<p><a href="https://unseen-site.fun/about">Nait</a> wants a company.</p>
|
||||
<p>Wish he will have a happy time.</p>
|
||||
</main>
|
||||
<footer>
|
||||
<p>Copyright © 2025, Yozora Tech LTD.</p>
|
||||
<p>Site content available under <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA 4.0</a>.</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
12
index.html
12
index.html
|
|
@ -14,19 +14,23 @@
|
|||
</svg>
|
||||
</a>
|
||||
<ul class="links">
|
||||
<!-- <li><a href="/about.html">About</a></li> -->
|
||||
<li><a href="/about.html">About</a></li>
|
||||
</li>
|
||||
</nav>
|
||||
<main>
|
||||
<h1 class="slogan">Software Made Simple</h1>
|
||||
<p>We serve neat software.</p>
|
||||
<p>We serve neat software</p>
|
||||
<ul class="showcase">
|
||||
<li><a href="//git.yozora.tech/">Git Repositories & Mirrors</a></li>
|
||||
<li><a href="//git.yozora.tech/explore/repos">Git Repositories</a></li>
|
||||
</ul>
|
||||
<p>And some personal stuff</p>
|
||||
<ul class="showcase">
|
||||
<li><a href="//junk.yozora.tech/">Historical Interests</a></li>
|
||||
</ul>
|
||||
<p>There are more for us to do…</p>
|
||||
</main>
|
||||
<footer>
|
||||
<p>Copyright © 2024, Yozora Tech LTD.</p>
|
||||
<p>Copyright © 2025, Yozora Tech LTD.</p>
|
||||
<p>Site content available under <a href="https://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA 4.0</a>.</p>
|
||||
</footer>
|
||||
</body>
|
||||
|
|
|
|||
75
res/main.css
75
res/main.css
|
|
@ -1,8 +1,8 @@
|
|||
|
||||
:root {
|
||||
--fore: #202020;
|
||||
--back: #f8f8f8;
|
||||
--back2: #f4f4f4;
|
||||
--fore: #101010;
|
||||
--bottom: #f0f0f0;
|
||||
--back: #e8e8e8;
|
||||
--shade: #a0a0a0;
|
||||
}
|
||||
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
|
||||
body {
|
||||
color: var(--fore);
|
||||
background-color: var(--back);
|
||||
background-color: var(--bottom);
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
font-family: system-ui, sans-serif;
|
||||
|
|
@ -22,8 +22,8 @@ body {
|
|||
nav {
|
||||
position: sticky;
|
||||
margin: 1em 0;
|
||||
padding: 4px 0 2px 0;
|
||||
background-color: var(--back2);
|
||||
padding: 0;
|
||||
background-color: var(--back);
|
||||
border-top: 1px solid var(--shade);
|
||||
border-bottom: 1px solid var(--shade);
|
||||
top: 0;
|
||||
|
|
@ -33,29 +33,40 @@ nav {
|
|||
|
||||
nav > .logo {
|
||||
display: block;
|
||||
margin: 0 2em;
|
||||
margin: 2px 1em;
|
||||
height: 52px;
|
||||
color: var(--fore);
|
||||
}
|
||||
nav > .links {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
margin: 0 8px;
|
||||
margin: 0;
|
||||
padding: 0 1em;
|
||||
justify-content: center;
|
||||
line-height: 54px;
|
||||
}
|
||||
nav > .links > * {
|
||||
margin: 0 2em;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
nav > .links a {
|
||||
display: inline-block;
|
||||
transition: border 0.32s 0s ease-out;
|
||||
padding: 0 1em;
|
||||
line-height: 54px;
|
||||
border-bottom: 2px solid transparent;
|
||||
}
|
||||
nav > .links a:any-link {
|
||||
color: var(--fore);
|
||||
text-decoration: none;
|
||||
}
|
||||
nav > .links a:hover {
|
||||
border-bottom: 2px solid var(--fore);
|
||||
}
|
||||
|
||||
h1.slogan {
|
||||
font-size: 2.4em;
|
||||
font-size: 2.5em;
|
||||
font-weight: 200;
|
||||
margin: 4rem 0;
|
||||
margin: 1.5em 0;
|
||||
}
|
||||
|
||||
a:any-link {
|
||||
|
|
@ -63,6 +74,15 @@ a:any-link {
|
|||
text-decoration: underline;
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 4em auto;
|
||||
max-width: 21cm;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.frontpage {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -70,36 +90,39 @@ a:any-link {
|
|||
.showcase {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 4rem auto;
|
||||
padding: 1rem;
|
||||
width: 28rem;
|
||||
max-width: calc(100% - 2rem);
|
||||
margin: 2em auto 5em auto;
|
||||
padding: 1em;
|
||||
width: 28em;
|
||||
max-width: calc(100% - 2em);
|
||||
border: 1px solid var(--fore);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.showcase > * {
|
||||
margin: 2rem 0;
|
||||
margin: 1.5em 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 1rem 0;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
font-size: 0.8em;
|
||||
margin-top: 6rem;
|
||||
margin-bottom: 2rem;
|
||||
padding: 0.5rem 0;
|
||||
margin: 2em 0;
|
||||
padding: 0.5em 0;
|
||||
border-top: 1px solid var(--shade);
|
||||
border-bottom: 1px solid var(--shade);
|
||||
background-color: var(--back2);
|
||||
background-color: var(--back);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--fore: #a0a0a0;
|
||||
--back: #202020;
|
||||
--back2: #242424;
|
||||
--fore: #d0d0d0;
|
||||
--bottom: #181818;
|
||||
--back: #242424;
|
||||
--shade: #808080;
|
||||
}
|
||||
img.dim {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue