~repos /website

#astro#js#html#css

git clone https://pyrossh.dev/repos/website.git

木 Personal website of pyrossh. Built with astrojs, shiki, vite.


f9d46a83 pyrossh

2 years ago
improve mobile
components/Footer.tsx CHANGED
@@ -4,7 +4,7 @@ import LemonDrop from "../islands/LemonDrop.tsx";
4
4
  export default function Footer() {
5
5
  return (
6
6
  <footer class="flex w-full flex-1 flex-row justify-center text-xl leading-6">
7
- <div class="flex flex-row flex-1 p-4 max-w-5xl text-yellow">
7
+ <div class="flex flex-row flex-1 py-4 max-w-5xl text-yellow">
8
8
  <div class="flex-1">
9
9
  <SocialLinks />
10
10
  </div>
@@ -12,7 +12,7 @@ export default function Footer() {
12
12
  <span class="text-base text-yellow hover:no-underline">
13
13
  powered by
14
14
  </span>
15
- <a class="ml-2 -mt-3" href="https://fresh.deno.dev">
15
+ <a class="mx-2 -mt-3" href="https://fresh.deno.dev">
16
16
  <LemonDrop />
17
17
  </a>
18
18
  </div>
components/Header.tsx CHANGED
@@ -3,24 +3,24 @@ import SocialLinks from "./SocialLinks.tsx";
3
3
  export default function Header() {
4
4
  return (
5
5
  <header>
6
- <nav class="spy-2 m:py-0 flex w-full flex-1 flex-row justify-center bg-black text-xl font-mono">
6
+ <nav class="spy-2 m:py-0 flex w-full flex-1 flex-row justify-center bg-black font-mono">
7
- <div class="flex flex-row flex-1 items-center p-3.5 max-w-5xl">
7
+ <div class="flex flex-row flex-1 items-center p-3 max-w-5xl">
8
8
  <a
9
- class="flex text-yellow pr-4 hover:no-underline text-xl ml-0 pl-0"
9
+ class="flex text-yellow pr-4 hover:no-underline ml-0 pl-0"
10
10
  href="/"
11
11
  >
12
12
  <span class="mr-1 font-logo font-bold">木</span> pyros.sh
13
13
  </a>
14
- <div class="flex flex-row flex-1 items-center text-white [&>a]:mx-1 [&>a]:px-2 [&>a:hover]:bg-gray-600">
14
+ <div class="flex flex-row flex-1 items-center text-white sm:[&>a]:mx-1 [&>a]:px-2 [&>a:hover]:bg-gray-600 data-current:child:bg-gray-600">
15
- <a class="data-current:bg-gray-600" href="/dev" rel="prefetch">
15
+ <a href="/dev" rel="prefetch">
16
16
  dev
17
17
  </a>
18
18
  <div>|</div>
19
- <a class="data-current:bg-gray-600" href="/ref" rel="prefetch">
19
+ <a href="/ref" rel="prefetch">
20
20
  ref
21
21
  </a>
22
22
  <div>|</div>
23
- <a class="data-current:bg-gray-600" href="/blog" rel="prefetch">
23
+ <a href="/blog" rel="prefetch">
24
24
  blog
25
25
  </a>
26
26
  </div>
components/SocialLinks.tsx CHANGED
@@ -4,7 +4,7 @@ import LinkedInIcon from "./icons/LinkedInIcon.tsx";
4
4
 
5
5
  export default function SocialLinks() {
6
6
  return (
7
- <div class="flex hover:no-underline text-white [&>a]:ml-5">
7
+ <div class="flex hover:no-underline text-white child:mx-2 sm:child:ml-5">
8
8
  <a href="https://linkedin.com/in/pyrossh" title="My LinkedIn profile">
9
9
  <LinkedInIcon />
10
10
  </a>