Optimize for smaller screens
This commit is contained in:
parent
3be4764fb0
commit
658bf29a41
3 changed files with 85 additions and 66 deletions
|
@ -17,7 +17,7 @@
|
|||
</div>
|
||||
<div class="name">
|
||||
<h1 class="logo">Pongpeera Wongprasitthiporn</h1>
|
||||
<a class="gtk-button-pill" href="/index.html">See my real face</a>
|
||||
<a class="gtk-button-pill" href="/">See my real face</a>
|
||||
</div>
|
||||
|
||||
|
||||
|
@ -26,7 +26,7 @@
|
|||
Linux
|
||||
</a>
|
||||
<a class="headerbutton">
|
||||
Libvirt & QEMU/KVM
|
||||
Libvirtd
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://podman.io/" class="headerbutton">
|
||||
Podman
|
||||
|
@ -37,54 +37,27 @@
|
|||
<a target="_blank" rel="noopener noreferrer" href="https://www.docker.com/" class="headerbutton">
|
||||
Docker
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://flatpak.org/" class="headerbutton">
|
||||
Flatpak
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.openstreetmap.org/" class="headerbutton">
|
||||
OpenStreetMap
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://boinc.berkeley.edu/" class="headerbutton">
|
||||
BOINC
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://penpot.app/" class="headerbutton">
|
||||
Penpot
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gitlab.com/" class="headerbutton">
|
||||
GitLab CI, Pages
|
||||
GitLab
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://forgejo.org/" class="headerbutton">
|
||||
Forgejo
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
On-premise hosting
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://aws.amazon.com/" class="headerbutton">
|
||||
Amazon EC2, SES
|
||||
</a>
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.cloudflare.com/" class="headerbutton">
|
||||
Cloudflare
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://systemd.io/" class="headerbutton">
|
||||
systemd
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://woodpecker-ci.org/" class="headerbutton">
|
||||
Woodpecker/Drone CI
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gohugo.io/" class="headerbutton">
|
||||
Hugo
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.python.org/" class="headerbutton">
|
||||
Python
|
||||
</a>
|
||||
|
@ -98,8 +71,34 @@
|
|||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Content Creation
|
||||
Servers
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://aws.amazon.com/" class="headerbutton">
|
||||
Amazon EC2, SES
|
||||
</a>
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.cloudflare.com/" class="headerbutton">
|
||||
Cloudflare
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://flatpak.org/" class="headerbutton">
|
||||
Flatpak
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://penpot.app/" class="headerbutton">
|
||||
Penpot
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gohugo.io/" class="headerbutton">
|
||||
Hugo
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://systemd.io/" class="headerbutton">
|
||||
systemd
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Documentation
|
||||
</a>
|
||||
|
@ -107,6 +106,12 @@
|
|||
Localization
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Content Creation
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="grid-container">
|
||||
|
||||
|
@ -225,6 +230,13 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="16px" viewBox="0 0 16 16" width="16px" ><path fill="currentColor" d="m 4 0.996094 v 1 c 0 0.296875 0.125 0.558594 0.328125 0.742187 l 5.257813 5.257813 l -5.257813 5.261718 l -0.035156 0.03125 c -0.179688 0.183594 -0.292969 0.433594 -0.292969 0.707032 v 1 h 1 c 0.277344 0 0.527344 -0.109375 0.707031 -0.292969 l 0.035157 -0.03125 l 6.671874 -6.675781 l -6.671874 -6.671875 c -0.183594 -0.199219 -0.449219 -0.328125 -0.742188 -0.328125 z m 0 0"/></svg>
|
||||
</a>
|
||||
<div class="separator"></div>
|
||||
<a class="listaction" href="work-i-bitz.html">
|
||||
<div style="display: flex; margin-left: 0.5cm; align-items: center;">
|
||||
<p>Intern at i-bitz company limited</p>
|
||||
</div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="16px" viewBox="0 0 16 16" width="16px" ><path fill="currentColor" d="m 4 0.996094 v 1 c 0 0.296875 0.125 0.558594 0.328125 0.742187 l 5.257813 5.257813 l -5.257813 5.261718 l -0.035156 0.03125 c -0.179688 0.183594 -0.292969 0.433594 -0.292969 0.707032 v 1 h 1 c 0.277344 0 0.527344 -0.109375 0.707031 -0.292969 l 0.035157 -0.03125 l 6.671874 -6.675781 l -6.671874 -6.671875 c -0.183594 -0.199219 -0.449219 -0.328125 -0.742188 -0.328125 z m 0 0"/></svg>
|
||||
</a>
|
||||
<div class="separator"></div>
|
||||
<a class="listaction" href="work-others.html">
|
||||
<div style="display: flex; margin-left: 0.5cm; align-items: center;">
|
||||
<p>Other works</p>
|
||||
|
|
67
index.html
67
index.html
|
@ -26,7 +26,7 @@
|
|||
Linux
|
||||
</a>
|
||||
<a class="headerbutton">
|
||||
Libvirt & QEMU/KVM
|
||||
Libvirtd
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://podman.io/" class="headerbutton">
|
||||
Podman
|
||||
|
@ -37,25 +37,17 @@
|
|||
<a target="_blank" rel="noopener noreferrer" href="https://www.docker.com/" class="headerbutton">
|
||||
Docker
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://flatpak.org/" class="headerbutton">
|
||||
Flatpak
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.openstreetmap.org/" class="headerbutton">
|
||||
OpenStreetMap
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://boinc.berkeley.edu/" class="headerbutton">
|
||||
BOINC
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://penpot.app/" class="headerbutton">
|
||||
Penpot
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gitlab.com/" class="headerbutton">
|
||||
GitLab CI, Pages
|
||||
GitLab
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://forgejo.org/" class="headerbutton">
|
||||
Forgejo
|
||||
|
@ -63,28 +55,9 @@
|
|||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
On-premise hosting
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://aws.amazon.com/" class="headerbutton">
|
||||
Amazon EC2, SES
|
||||
</a>
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.cloudflare.com/" class="headerbutton">
|
||||
Cloudflare
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://systemd.io/" class="headerbutton">
|
||||
systemd
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a target="_blank" rel="noopenTHEORY OF COMPUTATION, 2023er noreferrer" href="https://woodpecker-ci.org/" class="headerbutton">
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://woodpecker-ci.org/" class="headerbutton">
|
||||
Woodpecker/Drone CI
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gohugo.io/" class="headerbutton">
|
||||
Hugo
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.python.org/" class="headerbutton">
|
||||
Python
|
||||
</a>
|
||||
|
@ -98,8 +71,34 @@
|
|||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Content Creation
|
||||
Servers
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://aws.amazon.com/" class="headerbutton">
|
||||
Amazon EC2, SES
|
||||
</a>
|
||||
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.cloudflare.com/" class="headerbutton">
|
||||
Cloudflare
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://flatpak.org/" class="headerbutton">
|
||||
Flatpak
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://penpot.app/" class="headerbutton">
|
||||
Penpot
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://gohugo.io/" class="headerbutton">
|
||||
Hugo
|
||||
</a>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://systemd.io/" class="headerbutton">
|
||||
systemd
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Documentation
|
||||
</a>
|
||||
|
@ -107,6 +106,12 @@
|
|||
Localization
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="header">
|
||||
<a class="headerbutton">
|
||||
Content Creation
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="grid-container">
|
||||
|
||||
|
|
10
style.css
10
style.css
|
@ -54,6 +54,7 @@ html *
|
|||
|
||||
.logo {
|
||||
color: #000;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
|
@ -95,13 +96,13 @@ html *
|
|||
align-items: center;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin: 4px 2px;
|
||||
padding-left: 0.3cm;
|
||||
padding-right: 0.3cm;
|
||||
cursor: pointer;
|
||||
height: 35px;
|
||||
min-height: 35px;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
|
@ -212,6 +213,7 @@ html *
|
|||
|
||||
.logo {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
body {
|
||||
|
@ -257,13 +259,13 @@ html *
|
|||
align-items: center;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin: 4px 2px;
|
||||
padding-left: 0.3cm;
|
||||
padding-right: 0.3cm;
|
||||
cursor: pointer;
|
||||
height: 35px;
|
||||
min-height: 35px;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue