diff --git a/src/assets/sponsors/wifi/wifi_1.png b/src/assets/sponsors/wifi/wifi_1.png new file mode 100644 index 0000000..77bc9ba Binary files /dev/null and b/src/assets/sponsors/wifi/wifi_1.png differ diff --git a/src/components/top/Sponsors.astro b/src/components/top/Sponsors.astro index b4f217c..7e742e5 100644 --- a/src/components/top/Sponsors.astro +++ b/src/components/top/Sponsors.astro @@ -8,6 +8,7 @@ import Lunch from "./sponsor/Lunch.astro"; import Bronze from "./sponsor/Bronze.astro"; import Gopher from "./sponsor/Gopher.astro"; import Tool from "./sponsor/Tool.astro"; +import Wifi from "./sponsor/Wifi.astro"; import { goldSponsors, silverSponsors, @@ -16,6 +17,7 @@ import { bronzeSponsors, gopherSponsors, toolSponsors, + wifiSponsors, } from "./sponsors"; const currentLocale = Astro.currentLocale || "ja"; @@ -27,7 +29,8 @@ if ( lunchSponsors.length === 0 && bronzeSponsors.length === 0 && gopherSponsors.length === 0 && - toolSponsors.length === 0 + toolSponsors.length === 0 && + wifiSponsors.length === 0 ) { return null; } @@ -55,6 +58,7 @@ if ( + diff --git a/src/components/top/sponsor/Drink.astro b/src/components/top/sponsor/Drink.astro index 9c1be2e..f418c27 100644 --- a/src/components/top/sponsor/Drink.astro +++ b/src/components/top/sponsor/Drink.astro @@ -81,26 +81,30 @@ const currentLocale = Astro.currentLocale || "ja"; a > img, li > img { - width: 100%; + width: 354px; height: auto; aspect-ratio: 354 / 164; - max-width: 354px; + max-width: 100%; object-fit: contain; display: block; + padding: 16px; + box-sizing: border-box; } @media screen and (max-width: 768px) { ul { - padding: 0 40px; + padding: 0; } li { width: 100%; } - a > img { - width: 262px; - aspect-ratio: 262 / 64; + a > img, + li > img { + width: 342px; + aspect-ratio: 262 / 90; + padding: 4px 32px; } } diff --git a/src/components/top/sponsor/Gold.astro b/src/components/top/sponsor/Gold.astro index 67cd756..cd61dd0 100644 --- a/src/components/top/sponsor/Gold.astro +++ b/src/components/top/sponsor/Gold.astro @@ -39,6 +39,8 @@ const currentLocale = Astro.currentLocale || "ja"; src={sponsor.imageSrc} alt={sponsor.name} title={sponsor.name} + width={532} + height={280} loading="lazy" priority /> @@ -48,6 +50,8 @@ const currentLocale = Astro.currentLocale || "ja"; src={sponsor.imageSrc} alt={sponsor.name} title={sponsor.name} + width={532} + height={280} loading="lazy" priority /> @@ -109,7 +113,8 @@ const currentLocale = Astro.currentLocale || "ja"; justify-content: center; } - a > img { + a > img, + li > img { width: 342px; aspect-ratio: 342 / 160; } diff --git a/src/components/top/sponsor/Lunch.astro b/src/components/top/sponsor/Lunch.astro index 7f418d6..5d7fe9d 100644 --- a/src/components/top/sponsor/Lunch.astro +++ b/src/components/top/sponsor/Lunch.astro @@ -87,13 +87,15 @@ const currentLocale = Astro.currentLocale || "ja"; max-width: 100%; object-fit: contain; display: block; + padding: 16px; + box-sizing: border-box; } @media screen and (max-width: 768px) { ul { grid-template-columns: repeat(1, auto); gap: 24px; - padding: 0 40px; + padding: 0; } li { @@ -101,9 +103,11 @@ const currentLocale = Astro.currentLocale || "ja"; justify-content: center; } - a > img { - width: 262px; - aspect-ratio: 262 / 64; + a > img, + li > img { + width: 342px; + aspect-ratio: 262 / 90; + padding: 4px 32px; } } diff --git a/src/components/top/sponsor/Silver.astro b/src/components/top/sponsor/Silver.astro index ca80188..009bb74 100644 --- a/src/components/top/sponsor/Silver.astro +++ b/src/components/top/sponsor/Silver.astro @@ -86,13 +86,15 @@ const currentLocale = Astro.currentLocale || "ja"; max-width: 100%; object-fit: contain; display: block; + padding: 16px; + box-sizing: border-box; } @media screen and (max-width: 768px) { ul { grid-template-columns: repeat(1, auto); gap: 24px; - padding: 0 40px; + padding: 0; } li { @@ -100,9 +102,11 @@ const currentLocale = Astro.currentLocale || "ja"; justify-content: center; } - a > img { - width: 262px; - aspect-ratio: 262 / 64; + a > img, + li > img { + width: 342px; + aspect-ratio: 262 / 90; + padding: 4px 32px; } } diff --git a/src/components/top/sponsor/Wifi.astro b/src/components/top/sponsor/Wifi.astro new file mode 100644 index 0000000..d3971d4 --- /dev/null +++ b/src/components/top/sponsor/Wifi.astro @@ -0,0 +1,82 @@ +--- +import { Image } from "astro:assets"; +import type { Sponsor } from "../sponsors"; + +interface Props { + sponsors: Sponsor[]; +} + +const { sponsors } = Astro.props; + +if (sponsors.length === 0) { + return null; +} + +const currentLocale = Astro.currentLocale || "ja"; +--- + + + + diff --git a/src/components/top/sponsors.ts b/src/components/top/sponsors.ts index 45fb27f..d21d963 100644 --- a/src/components/top/sponsors.ts +++ b/src/components/top/sponsors.ts @@ -61,6 +61,7 @@ import gopher18Img from "../../assets/sponsors/gopher/gopher_18.jpg"; import gopher19Img from "../../assets/sponsors/gopher/gopher_19.png"; import gopher20Img from "../../assets/sponsors/gopher/gopher_20.png"; import gopher21Img from "../../assets/sponsors/gopher/gopher_21.png"; +import wifi1Img from "../../assets/sponsors/wifi/wifi_1.png"; export type SponsorWithUrl = { name: string; @@ -236,4 +237,10 @@ export const gopherSponsors: Sponsor[] = [ // { name: "瀬上 祐匡", imageSrc: gopher22Img }, ]; -export const toolSponsors: Sponsor[] = []; +export const toolSponsors: Sponsor[] = [ + { name: "株式会社LayerX", imageSrc: gold2Img }, +]; + +export const wifiSponsors: Sponsor[] = [ + { name: "インターネット・ゼミ", imageSrc: wifi1Img }, +];