diff options
| -rw-r--r-- | index.html | 24 | ||||
| -rw-r--r-- | style.css | 43 |
2 files changed, 36 insertions, 31 deletions
diff --git a/index.html b/index.html index 095c38f..834d57f 100644 --- a/index.html +++ b/index.html @@ -19,6 +19,15 @@ <body> <header> <h1>Runxi Yu</h1> + <nav> + <ul> + <li><a href="https://git.runxiyu.org/">Git</a></li> + <li><a href="#contact">Contact</a></li> + <li><a href="./microblog">Microblog</a></li> + <li><a href="#articles">Articles</a></li> + <li><a href="#faq">FAQs</a></li> + </ul> + </nav> </header> <article> @@ -37,21 +46,6 @@ <li>sr.ht <a href="https://sr.ht/~runxiyu"><code>~runxiyu</code></a></li> </ul> -<h2 id="sites">Sites</h2> - -<ul> - <li><a href="./microblog">Microblog</a></li> - <li>Git Repositories - <ul> - <li><a href="https://git.runxiyu.org/">Current</a></li> - <li><a href="https://oldgit.runxiyu.org/">Archive</a></li> - <li><a href="https://oldgit.runxiyu.org/">Contrib</a></li> - </ul> - </li> - <!--<li><a href="https://evosaur.andrewyu.org/">The Evosaur Project</a></li>--> -</ul> - - <h2 id="articles">Personal Articles</h2> <p>Pages for other projects (i.e. Evosaur) are not listed—only independent articles are listed here. These are generally sorted from newest to oldest. Some do not come with HTML anchors: these articles are not published online, but are still listed here for the sake of completeness. Articles marked with "*" are fictional/literary.</p> <ul> diff --git a/style.css b/style.css index 1d06d84..c0ce359 100644 --- a/style.css +++ b/style.css @@ -84,7 +84,7 @@ body { justify-items:center; margin:var(--page-margin); font-size:var(--base-font-size); - font-family:"Segoe UI",ui-sans-serif,system-ui,sans-serif; + font-family:ui-sans-serif,system-ui,sans-serif; line-height:var(--linespread); hyphens:auto; font-variant-ligatures:common-ligatures contextual; @@ -124,8 +124,10 @@ h1 { margin-bottom:0; margin-top:1rem; font-size:max(var(--heading-base),var(--base-font-size)); - padding-bottom:.1em; - border-bottom:1px solid var(--color-faded) +} +header { + padding-bottom:0.28rem; + border-bottom:1px solid var(--color-faded); } h2 { font-size:max(calc(var(--heading-base)*var(--heading-ratio)),var(--base-font-size)) @@ -170,7 +172,7 @@ p { position:relative } code { - font-family:ui-monospace,Consolas,Inconsolata,"Roboto Mono","Fira Mono",monospace; + font-family:ui-monospace,monospace; overflow-wrap:anywhere; hyphens:none } @@ -209,6 +211,20 @@ footer ul li:first-of-type { footer li:not(:last-child):not(:first-child)::after { content:" • " } +nav ul { + display:flex; + flex-wrap:wrap; + justify-content:center; + margin:0; + padding:0 +} +nav ul li { + display:inline; + list-style-type:none +} +nav li:not(:last-child)::after { + content:" • " +} abbr { text-decoration:none; font-variant-caps:all-small-caps; @@ -265,8 +281,7 @@ figure { justify-content:center; flex-direction:column } -figcaption, -nav ul ul ul li { +figcaption { font-style:italic } @media (min-width:70em) { @@ -289,26 +304,19 @@ nav ul ul ul li { margin-left:3em } } -nav li { - list-style:none -} -nav>ul, ul.inline { padding-left:0 } -nav ul ul ul li, ul.inline>li { display:inline; list-style-type:none } @media (min-width:55rem) { - nav ul ul ul li, ul.inline>li { white-space:nowrap } } -:is(nav ul ul ul li, -ul.inline>li):not(:first-child)::before { +:is(ul.inline>li):not(:first-child)::before { content:" • " } dd>p { @@ -318,11 +326,11 @@ dl.bold>dt, summary { font-weight:500 } -header p { +/* header p { font-style:italic; position:absolute; right:var(--margin-width) -} +} */ summary { list-style-position:outside } @@ -345,3 +353,6 @@ summary { list-style-type: disclosure-open; } +nav { + text-align: center; +} |