make mobile overflow less common

This commit is contained in:
Reid 2025-01-15 20:50:17 -08:00
parent e5af16bfeb
commit e6510e2833
Signed by: reidlab
GPG key ID: DAF5EAF6665839FD
3 changed files with 6 additions and 2 deletions

View file

@ -13,7 +13,7 @@ const { title } = Astro.props;
<style>
.card h2 {
font-family: "Sharp PC3K-2x", monospace;
font-size: 1.2em;
font-size: 1em;
text-align: center;
padding: 8px 0 4px 0;
background-color: var(--foreground);

View file

@ -22,7 +22,7 @@ let lastYear = 0;
<p>{project.data.description}</p>
<div class="links">
{project.data.links.map((link) => {
return <a target="_blank" rel="noopener" href={link}>{link}</a>;
return <a class="link" target="_blank" rel="noopener" href={link}>{link}</a>;
})}
</div>
</div>
@ -65,4 +65,7 @@ let lastYear = 0;
flex-direction: column;
align-items: flex-end;
}
.link {
word-break: break-all;
}
</style>

View file

@ -38,6 +38,7 @@ import "../styles/main.css";
</head>
<body>
<Sidebar />
<!-- container is here b/c view transitions + background = bad -->
<div class="container">
<main
data-vtbot-replace="main"