Skip to content

Commit 907d4aa

Browse files
sikkzzsikkzz
committed
fix: test
1 parent 2420d10 commit 907d4aa

File tree

6 files changed

+50
-50
lines changed

6 files changed

+50
-50
lines changed

‎apps/tuk-landing/src/app/(home)/src/components/Footer.tsx‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import { useEffect, useRef, useState } from 'react';
66

77
const Footer = () => {
88
const footerRef = useRef<HTMLDivElement | null>(null);
9-
109
const [inView, setInView] = useState(false);
1110

1211
useEffect(() => {
@@ -28,14 +27,18 @@ const Footer = () => {
2827

2928
return (
3029
<section ref={footerRef}>
31-
<div
32-
className="w-full bg-cover bg-center bg-no-repeat"
33-
style={{
34-
backgroundImage:
35-
'linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%), url(/footer-bg.jpg)',
36-
}}
37-
>
38-
<div className="m-auto max-w-screen-xl overflow-hidden px-[70px] pb-[162px] pt-[180px] max-[1280px]:max-w-[880px] max-[1280px]:px-6 max-[1280px]:pb-[172px] max-[1280px]:pt-[208px] max-[880px]:flex max-[880px]:flex-col max-[880px]:items-center max-[880px]:pb-[70px] max-[880px]:pt-[72px]">
30+
<div className="relative w-full">
31+
<Image
32+
src="/footer-bg.jpg"
33+
alt="footer background"
34+
fill
35+
priority
36+
quality={100}
37+
className="object-cover object-center"
38+
/>
39+
<div className="absolute inset-0 bg-black-default/70" />
40+
41+
<div className="relative z-10 m-auto max-w-screen-xl overflow-hidden px-[70px] pb-[162px] pt-[180px] max-[1280px]:max-w-[880px] max-[1280px]:px-6 max-[1280px]:pb-[172px] max-[1280px]:pt-[208px] max-[880px]:flex max-[880px]:flex-col max-[880px]:items-center max-[880px]:pb-[70px] max-[880px]:pt-[72px]">
3942
<h2 className="text-[48px] font-bold text-white-default max-[1280px]:text-[40px] max-[880px]:text-center max-[880px]:text-[36px]">
4043
우리의 만남을 위해
4144
<br /> TUK
@@ -48,14 +51,14 @@ const Footer = () => {
4851
<div className="flex gap-3 max-[880px]:hidden">
4952
<Link
5053
href="/"
51-
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-solid border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
54+
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
5255
>
5356
<Image src="/app-store.png" alt="appStoreImg" width={24} height={24} />
5457
App Store
5558
</Link>
5659
<Link
5760
href="/"
58-
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-solid border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
61+
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
5962
>
6063
<Image src="/play-store.png" alt="playStoreImg" width={24} height={24} />
6164
Google Play

‎apps/tuk-landing/src/app/(home)/src/components/MainSection.tsx‎

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,23 @@
1+
'use client';
2+
13
import Image from 'next/image';
24
import Link from 'next/link';
35

46
const MainSection = () => {
57
return (
6-
<section
7-
id="thumbnail"
8-
className="fixed left-0 top-0 z-[-1] h-[calc(calc(var(--vh,1vh)*100)+26px)] w-full bg-cover bg-center bg-no-repeat opacity-90 transition-[background-image] duration-100"
9-
style={{
10-
backgroundImage:
11-
'linear-gradient(0deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2) 100%), url(/main-bg.jpg)',
12-
}}
13-
>
14-
<div className="relative m-auto h-full max-w-screen-xl overflow-hidden px-[70px] max-[1280px]:max-w-[55rem] max-[1280px]:px-6 max-[880px]:flex max-[880px]:flex-col max-[880px]:items-center max-[880px]:justify-end max-[880px]:pb-[1.625rem]">
8+
<section id="thumbnail" className="fixed left-0 top-0 z-[-1] h-dvh w-full">
9+
<div className="absolute inset-0 z-0">
10+
<Image
11+
src="/main-bg.jpg"
12+
alt="Main Background"
13+
fill
14+
priority
15+
quality={100}
16+
className="object-cover object-center opacity-90"
17+
/>
18+
</div>
19+
20+
<div className="relative z-10 m-auto h-full max-w-screen-xl overflow-hidden px-[70px] max-[1280px]:max-w-[55rem] max-[1280px]:px-6 max-[880px]:flex max-[880px]:flex-col max-[880px]:items-center max-[880px]:justify-end max-[880px]:pb-[1.625rem]">
1521
<div className="center-vertical absolute max-[880px]:relative max-[880px]:top-auto max-[880px]:mb-6 max-[880px]:translate-y-0 max-[880px]:text-center">
1622
<div className="mb-6 text-[22px] font-medium text-white-default max-[880px]:mb-3 max-[880px]:text-lg">
1723
단톡방은 살아있지만, 모임은 사라진 사이에게
@@ -26,16 +32,16 @@ const MainSection = () => {
2632
<div className="flex gap-3 max-[880px]:hidden">
2733
<Link
2834
href="/"
29-
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-solid border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
35+
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
3036
>
31-
<Image src="/app-store.png" alt="appStoreImg" width={24} height={24} />
37+
<Image src="/app-store.png" alt="App Store" width={24} height={24} />
3238
App Store
3339
</Link>
3440
<Link
3541
href="/"
36-
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-solid border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
42+
className="flex h-[3.625rem] w-[10.75rem] cursor-pointer items-center justify-center gap-2 rounded-xl border-[1.5px] border-white-default/20 bg-black-default/30 text-sm font-bold text-white-default"
3743
>
38-
<Image src="/play-store.png" alt="playStoreImg" width={24} height={24} />
44+
<Image src="/play-store.png" alt="Google Play" width={24} height={24} />
3945
Google Play
4046
</Link>
4147
</div>

‎apps/tuk-landing/src/app/(home)/src/components/ResponsiveHeightResize.tsx‎

Lines changed: 0 additions & 18 deletions
This file was deleted.

‎apps/tuk-landing/src/app/(home)/src/components/ServiceInfoSection.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Link from 'next/link';
33

44
const ServiceInfoSection = () => {
55
return (
6-
<div className="mt-[calc(var(--vh,1vh)*100)] rounded-t-[3.75rem] bg-white-default pt-[3.75rem] max-[880px]:rounded-t-[1.625rem] max-[880px]:pt-[1.625rem]">
6+
<div className="mt-[100dvh] rounded-t-[3.75rem] bg-white-default pt-[3.75rem] max-[880px]:rounded-t-[1.625rem] max-[880px]:pt-[1.625rem]">
77
<section className="relative mb-40 mt-[8.75rem] max-[1280px]:mt-[6.25rem] max-[880px]:mt-10">
88
<div className="m-auto max-w-screen-xl overflow-hidden p-0 px-[4.375rem] max-[1280px]:max-w-[880px] max-[1280px]:px-6 min-[1281px]:p-[2.875rem]">
99
<div className="px-6">
@@ -43,7 +43,7 @@ const ServiceInfoSection = () => {
4343

4444
<div className="block max-[880px]:hidden">
4545
<section className="grid select-none grid-cols-2">
46-
<div className="sticky top-0 flex h-[calc(var(--vh,1vh)*100)] justify-end bg-[linear-gradient(135deg,_#FF976A_0%,_#FF3838_100%)] pt-[320px] max-[1280px]:pt-[200px]">
46+
<div className="sticky top-0 flex h-dvh justify-end bg-[linear-gradient(135deg,_#FF976A_0%,_#FF3838_100%)] pt-[320px] max-[1280px]:pt-[200px]">
4747
<div className="w-[640px] pl-[70px] max-[1280px]:w-[440px] max-[1280px]:pl-6">
4848
<div className="w-[456px] max-[1280px]:w-[308px]">
4949
<h2 className="mb-8 mt-5 text-[48px] font-bold text-white-default max-[1280px]:mt-4 max-[1280px]:text-[40px]">

‎apps/tuk-landing/src/app/layout.tsx‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,19 @@
1-
import type { Metadata } from 'next';
1+
import type { Metadata, Viewport } from 'next';
22

33
import '@/styles/globals.css';
44

55
export const metadata: Metadata = {
6-
title: 'Create Next App',
7-
description: 'Generated by create next app',
6+
title: 'TUK',
7+
description: '툭, 건네는 만남 TUK',
8+
};
9+
10+
export const viewport: Viewport = {
11+
width: 'device-width',
12+
initialScale: 1,
13+
minimumScale: 1,
14+
maximumScale: 1,
15+
userScalable: false,
16+
viewportFit: 'cover',
817
};
918

1019
export default function RootLayout({
@@ -14,6 +23,9 @@ export default function RootLayout({
1423
}>) {
1524
return (
1625
<html lang="en">
26+
<head>
27+
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
28+
</head>
1729
<body>{children}</body>
1830
</html>
1931
);

‎apps/tuk-landing/src/app/page.tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { useEffect, useState } from 'react';
55
import Footer from '@/app/(home)/src/components/Footer';
66
import Header from '@/app/(home)/src/components/Header';
77
import MainSection from '@/app/(home)/src/components/MainSection';
8-
import { ResponsiveHeightResize } from '@/app/(home)/src/components/ResponsiveHeightResize';
98
import ServiceInfoSection from '@/app/(home)/src/components/ServiceInfoSection';
109

1110
export default function LandingPage() {
@@ -30,8 +29,6 @@ export default function LandingPage() {
3029

3130
return (
3231
<>
33-
<ResponsiveHeightResize />
34-
3532
<Header isScrolledPastMain={isScrolledPastMain} />
3633

3734
<MainSection />

0 commit comments

Comments
 (0)