Update responsive design.

Author: nikoshell

src/components/CompanyCard.astro

@@ -26,7 +26,7 @@ const html = marked.parse(company.body);
 
 ---
 
-<div class="max-w-[400px] flex flex-col gap-6 p-6 rounded-lg shadow-md bg-white text-black">
+<div class="lg:max-w-[400px] flex flex-col gap-6 p-6 rounded-lg shadow-md bg-white text-black">
   <div class="w-full flex justify-center items-center md:items-center ">
     <img src={logo} alt={title + " Logo"} class="max-h-[200px] object-contain" />
   </div>

src/pages/company/[company]/[job].astro

@@ -30,9 +30,9 @@ export async function getStaticPaths() {
   title="EuroPython 2025 | July 14th-20th 2025 | Prague, Czech Republic & Remote"
   description="EuroPython is the largest Python conference in Europe. We are looking forward to seeing you in Prague, Czech Republic & Remote from July 14th-20th 2025."
 >
-  <section class="space-y-12 pb-6">
-    <div class="flex flex-col md:flex-row-reverse gap-6">
-      <div class="sticky top-0 self-start">
+  <section class="space-y-12 pb-6 md:p-6">
+    <div class="flex flex-col lg:flex-row-reverse gap-6">
+      <div class="w-full lg:max-w-[400px]  lg:sticky lg:top-6 self-start">
         <CompanyCard {company} />
       </div>
       <div class="flex-1">

src/pages/company/[company]/index.astro

@@ -24,9 +24,10 @@ export async function getStaticPaths() {
 >
 
 
-    <section class="space-y-12 pb-6">
+    <section class="space-y-12 pb-6 md:p-6">
+          <div class="flex flex-col lg:flex-row-reverse gap-6">
             <div class="flex flex-col md:flex-row-reverse gap-6">
-              <div class="sticky top-0 self-start">
+              <div class="w-full lg:max-w-[400px]  lg:sticky lg:top-6 self-start">
                 <CompanyCard {company} />
               </div>
               <div class="flex-1 ">

src/pages/jobs.astro

@@ -1,5 +1,5 @@
 ---
-import { getCollection, getEntry } from "astro:content";
+import { type CollectionEntry, getCollection, getEntry } from "astro:content";
 
 import Layout from "@layouts/MarkdownLayout.astro";
 
@@ -27,13 +27,13 @@ for (const path in jobFiles) {
   title="EuroPython 2025 | July 14th-20th 2025 | Prague, Czech Republic & Remote"
   description="EuroPython is the largest Python conference in Europe. We are looking forward to seeing you in Prague, Czech Republic & Remote from July 14th-20th 2025."
 >
-  <section class="space-y-12 pb-6">
+  <section class="space-y-12 pb-6 md:p-6">
     {
       companies.map((company) => {
         const companyJobs = companiesJobsMap[company.id];
         return (
-          <div class="flex flex-col md:flex-row-reverse gap-6">
-            <div class="sticky top-0 self-start">
+          <div class="flex flex-col lg:flex-row-reverse gap-6">
+            <div class="w-full lg:max-w-[400px]  lg:sticky lg:top-6 self-start">
               <CompanyCard {company} />
             </div>
             <div class="flex-1 ">