yet more mobile improvements.

components/ProjectCard.tsx

@@ -5,7 +5,7 @@ import type { Project } from "@/data/content";
 import SimpleGallery from "./SimpleGallery";
 import Link from "next/link";
 import { relative } from "path";
-
+import "../styles/project-card.css";
 
 type Props = {
   project: Project;
@@ -114,7 +114,7 @@ export default function ProjectCard({ project, visible, selected = false, setSel
         style={{
           minWidth: "10em",
           maxWidth: "90vw",
-          overflow: "hidden",
+    
           textDecoration: "none",
           padding: 28,
           marginTop: 3,
@@ -130,9 +130,7 @@ export default function ProjectCard({ project, visible, selected = false, setSel
           pointerEvents: "auto",
           cursor: "pointer"
         }}>
-        <div
-          style={{display: "flex", justifyContent: "space-between", alignItems: "flex-start", marginBottom: 12
-          }}>
+        <div className="project-card-title-year-box">
           <div
             style={{fontFamily: "var(--mono)", fontSize: 18, fontWeight: 700, color: hovered ? "var(--accent)" : "var(--fg)", transition: "color 0.2s"}}>
             {project.title}
@@ -142,7 +140,8 @@ export default function ProjectCard({ project, visible, selected = false, setSel
           </div>
         </div>
          {projectTagsComponent(project)}
-        <p style={{fontFamily: "var(--sans)", fontSize: 14, lineHeight: 1.6, color: "var(--fg-secondary)", margin: "0 0 16px 0"}}>
+        <p
+         style={{fontFamily: "var(--sans)", fontSize: 14, lineHeight: 1.6, color: "var(--fg-secondary)", margin: "0 0 16px 0"}}>
           {project.description}
         </p>
      
@@ -158,15 +157,11 @@ export default function ProjectCard({ project, visible, selected = false, setSel
           border: `1px solid ${hovered ? "var(--accent)" : "var(--border)"}`,
           backgroundColor: "var(--bg)",
           height: "3em",
-          display: "block",
           alignContent: "center",
           alignItems: "center",
           textAlign: "center",
           width: "10em",
           borderRadius: "var(--radius-md)",
-          position: "absolute",
-          right: "1em",
-          bottom: "1em"
         }} href={"/project/"+project.slug} >See More</Link>
       </div>
     );