AramJonghu/aramjonghu-site
1
0
Fork 0
mirror of https://git.aramjonghu.dev/AramJonghu/aramjonghu-site.git synced 2026-09-05 23:23:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(mobile): improve mobile view by introducing css for small devices

Browse Source
This commit is contained in:
AramJonghu
2026-07-31 18:30:57 +02:00
parent 6b94a75e30
commit 9edde535bb
3 changed files with 26 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/Header.tsx
+3 -3
View File
@@ -31,7 +31,7 @@ export default function Header({ theme }: HeaderProps) {
};
return (
<header className="bg-ctp-mantle flex justify-between items-center px-12 py-6 gap-6 border-b border-ctp-lavender-800">
<header className="bg-ctp-mantle flex justify-between items-center px-4 md:px-12 py-4 md:py-6 gap-4 md:gap-6 border-b border-ctp-lavender-800">
<img
className="size-16 cursor-pointer"
src={Aku}
@@ -39,12 +39,12 @@ export default function Header({ theme }: HeaderProps) {
onClick={goHome}
/>
<nav className="flex flex-wrap gap-3 items-center">
<nav className="flex flex-wrap justify-end gap-2 md:gap-3 items-center">
{navItems.map((item) => (
<a
key={item.label}
href={item.url}
className="ui-btn ui-btn:hover"
className="ui-btn ui-btn:hover px-2 py-1 md:px-3 md:py-1"
>
{item.label}
</a>