Skip to content

[김도균] Sprint3 #130

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

Merged
kich555 merged 23 commits into from
Nov 13, 2024
Merged

[김도균] Sprint3 #130

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
32829f0
chore: commit 생성
Oct 29, 2024
25ea232
chore : Project 디렉토리 삭제 및 템플릿 파일 복구
Oct 30, 2024
f81abbc
fix : 오타 수정 및 img 요소 alt 속성 명시
Nov 2, 2024
4082fd9
refactor : 시맨틱 태그 수정, CSS 업데이트는 후속 작업으로 예정
Nov 2, 2024
34cfdb9
chore : h1 태그 미사용으로 분리
Nov 2, 2024
24f6681
refactor : CSS 업데이트
Nov 2, 2024
cd395f2
docs : README.md 양식 변경
Nov 2, 2024
f952bee
feat : 로그인 페이지 HTML 작성
Nov 2, 2024
1ea6eff
feat : 로그인 페이지 CSS 생성
Nov 2, 2024
e4e9f18
chore : 로그인 버튼 색상 변경 및 hover, focus 추가
Nov 2, 2024
9f4ac74
feat : 회원가입 페이지 생성 및 CSS 업데이트
Nov 2, 2024
73b1971
chore : 이미지 수정
Nov 2, 2024
a109c25
chore : 메인 페이지 header 고정 및 오타 수정
Nov 2, 2024
9414283
chore : gray 및 blue 색상 변수 등록 및 적용
Nov 2, 2024
0605656
feat : Media Query 적용 완료
Nov 2, 2024
74e6ee3
docs : README.md Tools 항목 추가
Nov 9, 2024
9f516e0
chore : 디바이스 뷰포트 기준 수정
Nov 9, 2024
94c2eb8
chore : 로그인 페이지 및 회원가입 페이지 미디어쿼리 수정
Nov 9, 2024
29011ba
chore: 루트페이지 태블릿 크기 미디어쿼리 수정
Nov 9, 2024
ab2e4ba
chore : 루트페이지 모바일 크기 미디어쿼리 수정
Nov 9, 2024
68d7b38
chore : img alt속성, input name추가, a rel속성 noreferrer추가
Nov 9, 2024
b9da3bf
chore : og 태그 추가 완료
Nov 9, 2024
5194f1d
Merge branch 'Basic-김도균' into Basic-김도균-sprint3
ToKyun02 Nov 12, 2024
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
5 changes: 5 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1,6 @@
# Troubleshooting

# Tools

- Text Editor : VS Code
- Formatting : Prettier
58 changes: 30 additions & 28 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,11 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Open Graph 메타 태그 -->
<meta property="og:image" content="img/Img_home_03.png" />
<meta property="og:title" content="판다 마켓" />
<meta property="og:description" content="일상의 모든 물건을 거래해보세요" />
<meta property="og:url" content="https://tokyun02.github.io/" />
<title>판다마켓</title>
<link rel="icon" href="img/favicon.svg" type="image/svg" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
Expand All @@ -21,41 +26,38 @@
<body>
<header class="top-navigation">
<a href="./index.html"
><img
src="img/logo.png"
alt="이미지를 생성하지 못했습니다."
class="logo"
><img src="img/logo.png" alt="logo img 생성 불가" class="logo"
/></a>
<a class="login" href="login.html">로그인</a>
</header>

<main>
<section class="banner top-banner">
<div class="banner-explain">
<h1></h1>
<h1>판다마켓을 소개합니다.</h1>
<h2>
일상의 모든 물건을<br />
일상의 모든 물건을<br class="top-banner-title-next-line" />
거래해 보세요
</h2>
<a class="browsing" href="items.html">구경하러 가기</a>
</div>
<img
src="img/Img_home_top.png"
alt="이미지를 생성하지 못했습니다."
alt="top banner img 생성 불가"
class="top-banner-img"
/>
</section>

<section class="home-main-section">
<img
src="img/img_home_01.png"
alt="이미지를 생성하지 못했습니다."
alt="section1 img 생성 불가"
class="section-img"
/>
<div class="section-explain">
<span class="keyword">Hot item</span>
<h2>
인기 상품을<br />
<h2 class="section-title">
인기 상품을<br class="section-title-next-line" />
확인해 보세요
</h2>
<p>
Expand All @@ -68,8 +70,8 @@ <h2>
<section class="home-main-section">
<div class="section-explain">
<span class="keyword">Search</span>
<h2>
구매를 원하는<br />
<h2 class="section-title">
구매를 원하는<br class="section-title-next-line" />
상품을 검색하세요
</h2>
<p>
Expand All @@ -78,22 +80,22 @@ <h2>
</p>
</div>
<img
src="img/img_home_02.png"
alt="이미지를 생성하지 못했습니다."
src="img/Img_home_02.png"
alt="section2 img 생성 불가"
class="section-img"
/>
</section>

<section class="home-main-section">
<img
src="img/img_home_03.png"
alt="이미지를 생성하지 못했습니다."
src="img/Img_home_03.png"
alt="section3 img 생성 불가"
class="section-img"
/>
<div class="section-explain">
<span class="keyword">Register</span>
<h2>
판매를 원하는<br />
<h2 class="section-title">
판매를 원하는<br class="section-title-next-line" />
상품을 등록하세요
</h2>
<p>
Expand All @@ -112,8 +114,8 @@ <h2>
</div>

<img
src="img/img_home_bottom.png"
alt="이미지를 생성하지 못했습니다."
src="img/Img_home_bottom.png"
alt="bottom banner img 생성 불가"
class="bottom-banner-img"
/>
</section>
Expand All @@ -132,34 +134,34 @@ <h2>

<ul class="social-list">
<li class="social-list-item">
<a href="https://www.facebook.com" target="_blank"
<a href="https://www.facebook.com" target="_blank" rel="noreferrer"
Copy link
Collaborator

@kich555 kich555 Nov 13, 2024

Choose a reason for hiding this comment

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

👍👍

><img
src="img/ic_facebook.png"
alt="이미지를 생성하지 못했습니다."
alt="facebook img 생성 불가"
Copy link
Collaborator

@kich555 kich555 Nov 13, 2024

Choose a reason for hiding this comment

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

alt에는 에러메세지를 표현하기보다는 해당 이미지 자체를 글로 묘사하는게 더 좋습니다!

class="social-img"
/></a>
</li>
<li class="social-list-item">
<a href="https://www.x.com" target="_blank"
<a href="https://www.x.com" target="_blank" rel="noreferrer"
><img
src="img/ic_twitter.png"
alt="이미지를 생성하지 못했습니다."
alt="twitter img 생성 불가"
class="social-img"
/></a>
</li>
<li class="social-list-item">
<a href="https://www.youtube.com" target="_blank"
<a href="https://www.youtube.com" target="_blank" rel="noreferrer"
><img
src="img/ic_youtube.png"
alt="이미지를 생성하지 못했습니다."
alt="youtube img 생성 불가"
class="social-img"
/></a>
</li>
<li class="social-list-item">
<a href="https://www.instagram.com" target="_blank"
<a href="https://www.instagram.com" target="_blank" rel="noreferrer"
><img
src="img/ic_instagram.png"
alt="이미지를 생성하지 못했습니다."
alt="instagram img 생성 불가"
class="social-img"
/></a>
</li>
Expand Down
32 changes: 20 additions & 12 deletions login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,10 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>판다마켓</title>
<link rel="icon" href="img/favicon.svg" type="image/svg" />

<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
Expand All @@ -20,44 +22,50 @@
<body>
<header>
<a href="./index.html"
><img
src="img/logo.png"
alt="이미지를 생성하지 못했습니다."
class="logo"
><img src="img/logo.png" alt="logo img 생성불가" class="logo"
/></a>
</header>
<main>
<form class="login-info">
<label for="email" class="email">이메일</label>
<div class="input-id">
<input type="email" id="email" placeholder="이메일을 입력해주세요" />
<input
type="email"
name="email"
id="email"
placeholder="이메일을 입력해주세요"
/>
</div>

<label for="password" class="password">비밀번호</label>
<div class="input-password">
<input
type="password"
name="password"
id="password"
placeholder="비밀번호를 입력해주세요"
/>
<img
src="img/img_closed_eye.png"
alt="이미지를 생성하지 못했습니다."
alt="closed_eye img 생성불가"
class="toggle-password"
/>
</div>

<button class="login-btn">로그인</button>
<button type="submit" class="login-btn">로그인</button>
</form>

<nav class="simple-login">
<span>간편 로그인하기</span>
<p class="simple-login-text">간편 로그인하기</p>
<div class="login-list">
<a href="https://www.google.com/" target="_blank"
><img src="img/ic_google.png" alt="이미지를 생성하지 못했습니다."
<a href="https://www.google.com/" target="_blank" rel="noreferrer"
><img src="img/ic_google.png" alt="google img 생성불가"
/></a>
<a href="https://www.kakaocorp.com/page/" target="_blank"
><img src="img/ic_kakao.png" alt="이미지를 생성하지 못했습니다."
<a
href="https://www.kakaocorp.com/page/"
target="_blank"
rel="noreferrer"
><img src="img/ic_kakao.png" alt="kakao img 생성불가"
/></a>
</div>
</nav>
Expand Down
34 changes: 21 additions & 13 deletions signup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,22 +20,25 @@
<body>
<header>
<a href="./index.html"
><img
src="img/logo.png"
alt="이미지를 생성하지 못했습니다."
class="logo"
><img src="img/logo.png" alt="logo img 생성불가" class="logo"
/></a>
</header>
<main>
<form class="login-info">
<label for="email" class="email">이메일</label>
<div class="input-id">
<input type="email" id="email" placeholder="이메일을 입력해주세요" />
<input
type="email"
name="email"
id="email"
placeholder="이메일을 입력해주세요"
/>
</div>
<label for="nickname" class="nickname">닉네임</label>
<div class="input-nickname">
<input
type="text"
name="nickname"
id="nickname"
placeholder="닉네임을 입력해주세요"
/>
Expand All @@ -45,40 +48,45 @@
<div class="input-password">
<input
type="password"
name="password"
id="password"
placeholder="비밀번호를 입력해주세요"
/>
<img
src="img/img_closed_eye.png"
alt="이미지를 생성하지 못했습니다."
alt="closed_eye img 생성불가"
class="toggle-password"
/>
</div>
<label for="password-confirm">비밀번호 확인</label>
<div class="input-password-confirm">
<input
type="password"
name="password-confirm"
id="password-confirm"
placeholder="비밀번호를 다시 한 번 입력해주세요"
/>
<img
src="img/img_closed_eye.png"
alt="이미지를 생성하지 못했습니다."
alt="closed_eye img 생성불가"
class="toggle-password"
/>
</div>

<button class="login-btn">회원가입</button>
<button type="submit" class="login-btn register-btn">회원가입</button>
</form>

<nav class="simple-login">
<span>간편 로그인하기</span>
<p class="simple-login-text">간편 로그인하기</p>
<div class="login-list">
<a href="https://www.google.com/" target="_blank"
><img src="img/ic_google.png" alt="이미지를 생성하지 못했습니다."
<a href="https://www.google.com/" target="_blank" rel="noreferrer"
><img src="img/ic_google.png" alt="google img 생성불가"
/></a>
<a href="https://www.kakaocorp.com/page/" target="_blank"
><img src="img/ic_kakao.png" alt="이미지를 생성하지 못했습니다."
<a
href="https://www.kakaocorp.com/page/"
target="_blank"
rel="noreferrer"
><img src="img/ic_kakao.png" alt="kakao img 생성불가"
/></a>
</div>
</nav>
Expand Down
Loading