Skip to content

HP細部のデザイン修正 #127

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
hengin-eer wants to merge 8 commits into
base: main
Choose a base branch
from
Open

HP細部のデザイン修正 #127

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
7a54ed2
fix: #114 ロゴ紹介欄のテキストを太くする
hengin-eer May 26, 2026
44151ec
fix: #114 重要なお知らせ欄のデザインを修正
hengin-eer May 27, 2026
a343c0d
fix: #114 お知らせ欄の余白を修正
hengin-eer May 27, 2026
414a487
fix: #114 トップページの背景とお知らせ枠を修正
hengin-eer May 27, 2026
aba331f
fix: #114 フッターのテキストを太くする
hengin-eer May 27, 2026
5b10fe6
fix: #114 leadingの競合を削除
hengin-eer May 27, 2026
c4ddbf5
fix #114 影のカラーテーマを追加
hengin-eer May 28, 2026
b075092
fix: ハードコードをカラーテーマ利用に修正
hengin-eer May 28, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/app/(frontend)/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@
--color-font-main: #f6f8ff;
--color-font-gray: #8b8982;
--color-accent: #ff5bef;
--color-shadow: #111d53;

--font-kaisotai: var(--font-kaisotai-next), sans-serif;
--font-sans:
Expand Down
6 changes: 3 additions & 3 deletions src/components/layout/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ export default function Footer() {
<SnsIconLinks />
</section>

<section className="flex w-full max-w-68 flex-col gap-xs text-text">
<section className="flex w-full max-w-68 flex-col gap-xs text-textb">
<div className="flex flex-col gap-xs">
<p className="text-black">アンケート</p>
<a
Expand Down Expand Up @@ -119,7 +119,7 @@ export default function Footer() {
</div>
</section>

<p className="text-center text-text">技大祭実行委員会</p>
<p className="text-center text-textb">技大祭実行委員会</p>
</div>
{/* PCレイアウト */}
<div className="w-full">
Expand Down Expand Up @@ -156,7 +156,7 @@ export default function Footer() {
</div>
</div>
<div className="items-top flex">
<div className="flex flex-col pl-xs text-text leading-4.25">
<div className="flex flex-col pl-xs text-textb leading-4.25">
<p className="flex items-center gap-1.5">
<MessageCircleMore
className="size-4"
Expand Down
8 changes: 3 additions & 5 deletions src/components/ui/ImportantFrame.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,10 @@ type ImportantFrameProps = {

export default function ImportantFrame({ title, children }: ImportantFrameProps) {
return (
<div className="w-full border-y-[1.4px] border-main bg-base-dark py-l shadow-[0px_2px_6px_0px_var(--color-base)] md:px-pl md:py-3l">
<div className="w-full border-y-[1.4px] border-main bg-base-dark py-l shadow-[0px_2px_6px_0px] shadow-shadow md:px-pl md:py-3l">
<div className="mx-auto flex w-full max-w-260 flex-col gap-0.5 px-3l md:px-0">
<h3 className="font-sans text-title-small leading-7.25 text-accent md:text-Ptitle-small md:leading-8">
{title}
</h3>
<div className="font-sans text-text-large text-white md:text-Ptext-large">{children}</div>
<h3 className="font-sans text-button text-accent md:text-Ptitle-small">{title}</h3>
<div className="font-sans text-textb text-white md:text-Ptext-large">{children}</div>
</div>
</div>
);
Expand Down
6 changes: 3 additions & 3 deletions src/components/ui/NewsItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ type NewsItemProps = {

export default function NewsItem({ date, dateTime, title, content, important }: NewsItemProps) {
return (
<li className="flex flex-col gap-ss border-b border-font-main px-ss pb-ss text-text text-font-main md:text-Ptext">
<li className="flex flex-col border-b border-font-main px-ss pb-ss text-text text-font-main md:text-Ptext">
<div className="flex items-center gap-xs">
<time dateTime={dateTime} className="whitespace-nowrap">
{date}
Expand All @@ -19,10 +19,10 @@ export default function NewsItem({ date, dateTime, title, content, important }:
</span>
)}
</div>
<div className="-ml-[0.5em] text-button font-bold text-font-main before:content-['［_'] after:content-['_］'] md:text-Pbutton">
<div className="mt-1 -ml-[0.5em] text-button font-bold text-font-main before:content-['［_'] after:content-['_］'] md:text-Pbutton">
{title}
</div>
<p className="text-justify whitespace-pre-wrap">{content}</p>
<p className="mt-ss text-justify whitespace-pre-wrap">{content}</p>
</li>
);
}
18 changes: 9 additions & 9 deletions src/modules/top/TopPageView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ function NewsSection({ newsItems }: { newsItems: Awaited<ReturnType<typeof getLa
<section className="w-full md:bg-base-dark md:px-pl md:py-3l">
<div className="mx-auto flex w-full max-w-105 flex-col items-center gap-m md:max-w-190 md:items-start">
<div className="flex w-full flex-col items-end gap-m md:w-full md:max-w-none md:items-start md:gap-l">
<div className="w-full bg-base-dark px-ll py-m md:bg-transparent md:px-ss md:py-0">
<div className="w-full bg-base-dark px-ll py-l md:bg-transparent md:px-ss md:py-0">
{newsItems.length > 0 ? (
<ul className="flex flex-col gap-m md:gap-l">
{newsItems.map((news) => (
Expand Down Expand Up @@ -158,7 +158,7 @@ async function TopPageContent() {
alt=""
width={220}
height={151}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack1-1.svg"
Expand All @@ -177,7 +177,7 @@ async function TopPageContent() {
alt=""
width={105}
height={170}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack1-2.svg"
Expand All @@ -194,7 +194,7 @@ async function TopPageContent() {
alt=""
width={198}
height={215}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack2.svg"
Expand Down Expand Up @@ -236,7 +236,7 @@ function TopPageSkeleton() {
alt=""
width={105}
height={170}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack1-2.svg"
Expand All @@ -253,7 +253,7 @@ function TopPageSkeleton() {
alt=""
width={198}
height={215}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack2.svg"
Expand All @@ -272,7 +272,7 @@ function TopPageSkeleton() {
<section className="w-full md:bg-base-dark md:px-pl md:py-3l">
<div className="mx-auto flex w-full max-w-105 flex-col items-center gap-m md:max-w-190 md:items-start">
<div className="flex w-full flex-col items-end gap-m md:w-full md:max-w-none md:items-start md:gap-l">
<div className="w-full bg-base-dark px-ll py-m md:bg-transparent md:px-ss md:py-0">
<div className="w-full bg-base-dark px-ll py-l md:bg-transparent md:px-ss md:py-0">
<ul className="flex flex-col gap-m md:gap-l">
<NewsItemSkeleton key="news-skeleton-0" skeletonClassName="bg-base" />
<NewsItemSkeleton key="news-skeleton-1" skeletonClassName="bg-base" />
Expand Down Expand Up @@ -306,7 +306,7 @@ export default function TopPageView() {
alt=""
width={185}
height={70}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack3-2.svg"
Expand All @@ -322,7 +322,7 @@ export default function TopPageView() {
alt=""
width={136}
height={405}
className="h-auto w-full md:hidden"
className="h-auto w-full opacity-80 md:hidden"
/>
<Image
src="/image/top/PTopBack3-1.svg"
Expand Down
2 changes: 1 addition & 1 deletion src/modules/top/ui/LogoInfo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export default function LogoInfo() {
height={260}
className="h-[140px] w-[140px] md:h-[260px] md:w-[260px]"
/>
<p className="px-3l text-center text-text text-font-main md:flex-1 md:px-0 md:text-left md:text-Ptext-large md:font-bold">
<p className="px-3l text-center text-textb text-font-main md:flex-1 md:px-0 md:text-left md:text-Ptext-large md:font-bold">
技大祭へようこそ！
<br />
「Bluem Up Date」と一緒に、花開くような
Expand Down
Loading