Merge pull request #41 from OUCC/stretch-card

カードの縦幅を揃える
OUCC · Nov 25, 2023 · 4620186 · 4620186
2 parents 68596ea + 01511dd
commit 4620186
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 4 deletions.
diff --git a/src/components/index/about/AboutSection.astro b/src/components/index/about/AboutSection.astro
@@ -38,10 +38,10 @@ const items: Item[] = [
     <span class="inline-block">OUCCって</span>
     <span class="inline-block">どんなサークル？</span>
   </Fragment>
-  <ul class="flex flex-col items-center md:flex-row md:items-start gap-5">
+  <ul class="flex flex-col items-center md:flex-row md:items-stretch gap-5">
     {
       items.map(({ icon, description }) => (
-        <li class="flex-1 max-w-[32rem]">
+        <li class="flex-1 max-w-[32rem] flex items-stretch">
           <AboutCard>
             <Icon slot="icon" name={icon} alt="" class="w-20 h-20" />
             {description.map((x) => (

diff --git a/src/components/join/place/LargeCard.astro b/src/components/join/place/LargeCard.astro
@@ -7,7 +7,7 @@ const { title } = Astro.props
 ---
 
 <div
-  class="flex-1 min-w-[16rem] p-4 rounded-lg bg-secondary border-2 border-primary drop-shadow-contrast flex flex-col gap-2.5"
+  class="min-w-[16rem] p-4 rounded-lg bg-secondary border-2 border-primary drop-shadow-contrast grid grid-rows-[subgrid] row-span-3 gap-2.5"
 >
   <h2 class="text-xl font-bold">{title}</h2>
   <slot />

diff --git a/src/components/join/place/PlaceDescription.astro b/src/components/join/place/PlaceDescription.astro
@@ -3,7 +3,7 @@ import LargeCard from './LargeCard.astro'
 import SmallCard from './SmallCard.astro'
 ---
 
-<div class="flex flex-wrap items-start gap-2.5">
+<div class="grid grid-cols-1 md:grid-cols-2 gap-2.5">
   <LargeCard title="誰でも参加可能">
     <SmallCard title="Discord 公開サーバー">
       <p>

diff --git a/src/env.d.ts b/src/env.d.ts
@@ -1 +1,2 @@
+/// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		/// <reference path="../.astro/types.d.ts" />
		/// <reference types="astro/client" />