Skip to content

フッターコンポーネント追加#9

Open
masakurapa wants to merge 1 commit intofeature/april-releasefrom
feature/footer
Open

フッターコンポーネント追加#9
masakurapa wants to merge 1 commit intofeature/april-releasefrom
feature/footer

Conversation

@masakurapa
Copy link
Contributor

@masakurapa masakurapa commented Mar 20, 2026

  • Footer.astroを追加しました
  • メインビジュアルとのマージンは気にせず表示されるところまでです
  • リンクは一旦HOMEのみ

@masakurapa masakurapa self-assigned this Mar 20, 2026
@netlify
Copy link

netlify bot commented Mar 20, 2026

Deploy Preview for unrivaled-empanada-4b1c20 ready!

Name Link
🔨 Latest commit 380b2ae
🔍 Latest deploy log https://app.netlify.com/projects/unrivaled-empanada-4b1c20/deploys/69bd46d63e9918000854bc31
😎 Deploy Preview https://deploy-preview-9--unrivaled-empanada-4b1c20.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@masakurapa masakurapa marked this pull request as ready for review March 20, 2026 13:10
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

svg だと容量が増えるので、JPG か PNG で良いのかなと思いました

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

こちらであぼねこさんから共有いただいたものの中に含まれています!

https://discord.com/channels/1440153039540588647/1475363204115988490/1484371585166217276

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

現在のものは白枠のロゴですが、デザイン上のフッターのロゴは白枠がないものかと思います

<slot />
</div>
<div class="footer-area">
<FooterVisual class="footer-visual" />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FooterVisual はページによってない場所もありそうなので、レイアウトに含めずにページ側で随時追加するのでも良いのかなと思います

.footer-area {
display: flex;
flex-direction: column;
gap: 4px;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

この gap は不要でしょうか?

export const constants = {
pageTitle: "Go Conference 2026",
pageDescription:
"Go Conference is a conference for Go programming language users.",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

まだどこからも使われていないものですが、こちら日本語でもよくないでしょうか?

Comment on lines +15 to +21
<div class="link-column site-link-group">
<div class="link-group">
<a href={getRelativeLocaleUrl(currentLocale)} class="text-link"
>Home</a
>
</div>
</div>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Figma 上でも Text Link というコンポーネントで作ってくださっているので、TextLink.astro を使えると良いのかなと思いました

<a
href={href}
target={isBlankLink ? "_blank" : undefined}
rel={isBlankLink ? "noopener noreferrer" : undefined}
>
<span class="text-body-large-strong">{text}</span>
{isBlankLink && <OpenInNewIcon class="link-icon" fill="red" />}
</a>

.link-group {
display: flex;
flex-direction: column;
gap: 8px;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

細かいですが、デザイン上はここの gap は 4px です。

Image

.footer-gradient {
width: 100%;
height: 8px;
background: var(--gradient);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ここの色指定で変数名が間違っていそうです。

<hr />
<div class="footer-info">
<div class="logo-container">
<FooterLogo class="footer-logo" />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

デザインよりもロゴのサイズが小さそうです

実装

Image

デザイン

Image

background: var(--gradient);
}

@media (max-width: 768px) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SP サイズのフッターのデザインがだいぶ違っていそうです。

実装

Image

デザイン

Image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

これはどこだろう?角丸ではない気がするから見ている場所が違うかもしれない?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

昨晩修正いただいたみたいです。こちらが今のデザインですね

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants