From bc702098a5d6f75df72f3a7c06d8f1b911eb3234 Mon Sep 17 00:00:00 2001 From: chaehoon Date: Wed, 31 Jul 2024 19:59:32 +0900 Subject: [PATCH] cafe24-thesuperlast --- .../css/pages/login_20240730002437.css | 0 .history/css/pages/login_20240731195030.css | 104 ++++ .history/css/pages/login_20240731195031.css | 104 ++++ .history/css/pages/login_20240731195032.css | 104 ++++ .../css/pages/main_20240730002441.css | 0 .history/css/pages/main_20240731194924.css | 7 + .history/css/pages/main_20240731195033.css | 7 + .../css/pages/sub-category_20240730002443.css | 0 .../css/pages/sub-category_20240731194807.css | 18 + .../css/pages/sub-category_20240731194809.css | 18 + .../css/pages/sub-category_20240731195035.css | 18 + .../css/pages/sub-category_20240731195501.css | 19 + .../css/pages/sub-category_20240731195522.css | 19 + .../css/pages/sub-category_20240731195606.css | 18 + .../css/pages/sub-category_20240731195617.css | 18 + .../css/pages/sub-category_20240731195623.css | 19 + .../css/pages/sub-category_20240731195626.css | 19 + .../css/pages/sub-category_20240731195628.css | 19 + .../css/pages/sub-category_20240731195749.css | 17 + .../css/pages/sub-category_20240731195800.css | 18 + .../css/pages/sub-category_20240731195801.css | 18 + .history/index_20240731195059.html | 449 ++++++++++++++++++ .history/index_20240731195100.html | 449 ++++++++++++++++++ .history/login_20240731195126.html | 123 +++++ .history/login_20240731195252.html | 123 +++++ .history/login_20240731195254.html | 123 +++++ .history/outer_20240731195200.html | 378 +++++++++++++++ .history/outer_20240731195201.html | 378 +++++++++++++++ .history/outer_20240731195224.html | 378 +++++++++++++++ .history/outer_20240731195509.html | 378 +++++++++++++++ .history/outer_20240731195825.html | 378 +++++++++++++++ {src/css => css}/components/footer.css | 0 {src/css => css}/components/header.css | 0 {src/css => css}/components/product-list.css | 0 css/pages/login.css | 104 ++++ css/pages/main.css | 7 + css/pages/sub-category.css | 18 + index.html | 2 +- login.html | 2 +- outer.html | 2 +- 40 files changed, 3853 insertions(+), 3 deletions(-) rename src/css/pages/login.css => .history/css/pages/login_20240730002437.css (100%) create mode 100644 .history/css/pages/login_20240731195030.css create mode 100644 .history/css/pages/login_20240731195031.css create mode 100644 .history/css/pages/login_20240731195032.css rename src/css/pages/main.css => .history/css/pages/main_20240730002441.css (100%) create mode 100644 .history/css/pages/main_20240731194924.css create mode 100644 .history/css/pages/main_20240731195033.css rename src/css/pages/sub-category.css => .history/css/pages/sub-category_20240730002443.css (100%) create mode 100644 .history/css/pages/sub-category_20240731194807.css create mode 100644 .history/css/pages/sub-category_20240731194809.css create mode 100644 .history/css/pages/sub-category_20240731195035.css create mode 100644 .history/css/pages/sub-category_20240731195501.css create mode 100644 .history/css/pages/sub-category_20240731195522.css create mode 100644 .history/css/pages/sub-category_20240731195606.css create mode 100644 .history/css/pages/sub-category_20240731195617.css create mode 100644 .history/css/pages/sub-category_20240731195623.css create mode 100644 .history/css/pages/sub-category_20240731195626.css create mode 100644 .history/css/pages/sub-category_20240731195628.css create mode 100644 .history/css/pages/sub-category_20240731195749.css create mode 100644 .history/css/pages/sub-category_20240731195800.css create mode 100644 .history/css/pages/sub-category_20240731195801.css create mode 100644 .history/index_20240731195059.html create mode 100644 .history/index_20240731195100.html create mode 100644 .history/login_20240731195126.html create mode 100644 .history/login_20240731195252.html create mode 100644 .history/login_20240731195254.html create mode 100644 .history/outer_20240731195200.html create mode 100644 .history/outer_20240731195201.html create mode 100644 .history/outer_20240731195224.html create mode 100644 .history/outer_20240731195509.html create mode 100644 .history/outer_20240731195825.html rename {src/css => css}/components/footer.css (100%) rename {src/css => css}/components/header.css (100%) rename {src/css => css}/components/product-list.css (100%) create mode 100644 css/pages/login.css create mode 100644 css/pages/main.css create mode 100644 css/pages/sub-category.css diff --git a/src/css/pages/login.css b/.history/css/pages/login_20240730002437.css similarity index 100% rename from src/css/pages/login.css rename to .history/css/pages/login_20240730002437.css diff --git a/.history/css/pages/login_20240731195030.css b/.history/css/pages/login_20240731195030.css new file mode 100644 index 0000000..a1571f4 --- /dev/null +++ b/.history/css/pages/login_20240731195030.css @@ -0,0 +1,104 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +.header__title a { + text-decoration: none; + color: black; +} +.login-wrapper { + height: 80vh; + display: flex; + flex-direction: column; + padding: 0 700px; + padding-top: 100px; +} +.login__title { + font-size: 30px; + font-weight: 700; + margin-bottom: 15px; +} +.login__text { + color: rgba(0, 0, 0, 0.5); + margin-bottom: 7px; + text-decoration: none; + transition: color 0.2s ease-in-out; +} + +.login__form { + display: flex; + flex-direction: column; +} +.login__btn { + background-color: black; + border-radius: 5px; + color: white; + font-size: 18px; + padding: 10px 0; + border: none; + margin: 5px 0; + display: flex; + justify-content: center; + align-items: center; + position: relative; + transition: background-color 0.2s ease-in-out; + transition: transform 0.2s ease-in-out; +} +.login__btn:active { + transform: scale(1.07); +} +.login__btn:hover { + background-color: rgb(50, 49, 49); +} + +.login__btn svg { + width: 25px; + height: 25px; + position: absolute; + left: 30px; +} +.login__btn-kakao { + margin-top: 50px; + background-color: #fee500; + color: black; + margin-bottom: 30px; +} +.login__btn-kakao:hover { + background-color: #f7e85d; +} +.login__btn-naver { + background-color: #1dc800; +} +.login__btn-naver:hover { + background-color: #49cd32; +} +.login__btn-naver { + fill: white; +} +.login__text-box { + margin-bottom: 30px; + display: flex; + justify-content: space-between; +} +.login__label { + display: flex; + flex-direction: column; + margin: 10px 0; +} + +.login__input { + border: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.5); + margin-top: 10px; +} + +.login__input:focus { + outline: none; + border-color: black; +} +.login__label:focus-within .login__text { + color: black; +} +.login__text-box .login__text:hover { + color: black; +} diff --git a/.history/css/pages/login_20240731195031.css b/.history/css/pages/login_20240731195031.css new file mode 100644 index 0000000..a1571f4 --- /dev/null +++ b/.history/css/pages/login_20240731195031.css @@ -0,0 +1,104 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +.header__title a { + text-decoration: none; + color: black; +} +.login-wrapper { + height: 80vh; + display: flex; + flex-direction: column; + padding: 0 700px; + padding-top: 100px; +} +.login__title { + font-size: 30px; + font-weight: 700; + margin-bottom: 15px; +} +.login__text { + color: rgba(0, 0, 0, 0.5); + margin-bottom: 7px; + text-decoration: none; + transition: color 0.2s ease-in-out; +} + +.login__form { + display: flex; + flex-direction: column; +} +.login__btn { + background-color: black; + border-radius: 5px; + color: white; + font-size: 18px; + padding: 10px 0; + border: none; + margin: 5px 0; + display: flex; + justify-content: center; + align-items: center; + position: relative; + transition: background-color 0.2s ease-in-out; + transition: transform 0.2s ease-in-out; +} +.login__btn:active { + transform: scale(1.07); +} +.login__btn:hover { + background-color: rgb(50, 49, 49); +} + +.login__btn svg { + width: 25px; + height: 25px; + position: absolute; + left: 30px; +} +.login__btn-kakao { + margin-top: 50px; + background-color: #fee500; + color: black; + margin-bottom: 30px; +} +.login__btn-kakao:hover { + background-color: #f7e85d; +} +.login__btn-naver { + background-color: #1dc800; +} +.login__btn-naver:hover { + background-color: #49cd32; +} +.login__btn-naver { + fill: white; +} +.login__text-box { + margin-bottom: 30px; + display: flex; + justify-content: space-between; +} +.login__label { + display: flex; + flex-direction: column; + margin: 10px 0; +} + +.login__input { + border: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.5); + margin-top: 10px; +} + +.login__input:focus { + outline: none; + border-color: black; +} +.login__label:focus-within .login__text { + color: black; +} +.login__text-box .login__text:hover { + color: black; +} diff --git a/.history/css/pages/login_20240731195032.css b/.history/css/pages/login_20240731195032.css new file mode 100644 index 0000000..a1571f4 --- /dev/null +++ b/.history/css/pages/login_20240731195032.css @@ -0,0 +1,104 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +.header__title a { + text-decoration: none; + color: black; +} +.login-wrapper { + height: 80vh; + display: flex; + flex-direction: column; + padding: 0 700px; + padding-top: 100px; +} +.login__title { + font-size: 30px; + font-weight: 700; + margin-bottom: 15px; +} +.login__text { + color: rgba(0, 0, 0, 0.5); + margin-bottom: 7px; + text-decoration: none; + transition: color 0.2s ease-in-out; +} + +.login__form { + display: flex; + flex-direction: column; +} +.login__btn { + background-color: black; + border-radius: 5px; + color: white; + font-size: 18px; + padding: 10px 0; + border: none; + margin: 5px 0; + display: flex; + justify-content: center; + align-items: center; + position: relative; + transition: background-color 0.2s ease-in-out; + transition: transform 0.2s ease-in-out; +} +.login__btn:active { + transform: scale(1.07); +} +.login__btn:hover { + background-color: rgb(50, 49, 49); +} + +.login__btn svg { + width: 25px; + height: 25px; + position: absolute; + left: 30px; +} +.login__btn-kakao { + margin-top: 50px; + background-color: #fee500; + color: black; + margin-bottom: 30px; +} +.login__btn-kakao:hover { + background-color: #f7e85d; +} +.login__btn-naver { + background-color: #1dc800; +} +.login__btn-naver:hover { + background-color: #49cd32; +} +.login__btn-naver { + fill: white; +} +.login__text-box { + margin-bottom: 30px; + display: flex; + justify-content: space-between; +} +.login__label { + display: flex; + flex-direction: column; + margin: 10px 0; +} + +.login__input { + border: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.5); + margin-top: 10px; +} + +.login__input:focus { + outline: none; + border-color: black; +} +.login__label:focus-within .login__text { + color: black; +} +.login__text-box .login__text:hover { + color: black; +} diff --git a/src/css/pages/main.css b/.history/css/pages/main_20240730002441.css similarity index 100% rename from src/css/pages/main.css rename to .history/css/pages/main_20240730002441.css diff --git a/.history/css/pages/main_20240731194924.css b/.history/css/pages/main_20240731194924.css new file mode 100644 index 0000000..c65188a --- /dev/null +++ b/.history/css/pages/main_20240731194924.css @@ -0,0 +1,7 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/slider.css"; +@import "/intro.css"; +@import "/css/components/product-list.css"; +@import "/css/components/footer.css"; diff --git a/.history/css/pages/main_20240731195033.css b/.history/css/pages/main_20240731195033.css new file mode 100644 index 0000000..c65188a --- /dev/null +++ b/.history/css/pages/main_20240731195033.css @@ -0,0 +1,7 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/slider.css"; +@import "/intro.css"; +@import "/css/components/product-list.css"; +@import "/css/components/footer.css"; diff --git a/src/css/pages/sub-category.css b/.history/css/pages/sub-category_20240730002443.css similarity index 100% rename from src/css/pages/sub-category.css rename to .history/css/pages/sub-category_20240730002443.css diff --git a/.history/css/pages/sub-category_20240731194807.css b/.history/css/pages/sub-category_20240731194807.css new file mode 100644 index 0000000..f060423 --- /dev/null +++ b/.history/css/pages/sub-category_20240731194807.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731194809.css b/.history/css/pages/sub-category_20240731194809.css new file mode 100644 index 0000000..f060423 --- /dev/null +++ b/.history/css/pages/sub-category_20240731194809.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195035.css b/.history/css/pages/sub-category_20240731195035.css new file mode 100644 index 0000000..f060423 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195035.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195501.css b/.history/css/pages/sub-category_20240731195501.css new file mode 100644 index 0000000..7729f9d --- /dev/null +++ b/.history/css/pages/sub-category_20240731195501.css @@ -0,0 +1,19 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195522.css b/.history/css/pages/sub-category_20240731195522.css new file mode 100644 index 0000000..7729f9d --- /dev/null +++ b/.history/css/pages/sub-category_20240731195522.css @@ -0,0 +1,19 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195606.css b/.history/css/pages/sub-category_20240731195606.css new file mode 100644 index 0000000..6354a20 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195606.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195617.css b/.history/css/pages/sub-category_20240731195617.css new file mode 100644 index 0000000..6354a20 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195617.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195623.css b/.history/css/pages/sub-category_20240731195623.css new file mode 100644 index 0000000..7729f9d --- /dev/null +++ b/.history/css/pages/sub-category_20240731195623.css @@ -0,0 +1,19 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195626.css b/.history/css/pages/sub-category_20240731195626.css new file mode 100644 index 0000000..515e8f1 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195626.css @@ -0,0 +1,19 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; + +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195628.css b/.history/css/pages/sub-category_20240731195628.css new file mode 100644 index 0000000..515e8f1 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195628.css @@ -0,0 +1,19 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/pages/sub-category.css"; + +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195749.css b/.history/css/pages/sub-category_20240731195749.css new file mode 100644 index 0000000..615ee9f --- /dev/null +++ b/.history/css/pages/sub-category_20240731195749.css @@ -0,0 +1,17 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css" .main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195800.css b/.history/css/pages/sub-category_20240731195800.css new file mode 100644 index 0000000..6354a20 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195800.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/css/pages/sub-category_20240731195801.css b/.history/css/pages/sub-category_20240731195801.css new file mode 100644 index 0000000..6354a20 --- /dev/null +++ b/.history/css/pages/sub-category_20240731195801.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/.history/index_20240731195059.html b/.history/index_20240731195059.html new file mode 100644 index 0000000..703e859 --- /dev/null +++ b/.history/index_20240731195059.html @@ -0,0 +1,449 @@ + + + + + + + + cafe24_clone + + + + +
+
+ +

HOON'S SHOP

+
    +
  • + +
    • +
  • +
    +2,000P
    + +
    • +
  • +
    2
    + +
    • +
  • + +
    • +
+
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+ +
+
+

MAN'S CLOTHES

+ + +
+ STYLE IN EVERY DAY +
+ main-slider_img +
+ FOR SPRING SET-UP +
+ + +
+
+
+
+
+
+
+ +
+
+ +
+

OPEN EVENT

+ 여름옷 30% 할인이벤트 +
+
+
+

HOON'S SHOP

+ 남자들을 위한 최상의 브랜드샵 +
+
+ + +
+

가게 위치

+ 서울시 강서구 양천로 1000길 XX로 +
+
+
+ + +
+

해시태그

+ #남성쇼핑몰 #여름옷 #패션룩 +
+
+
+ +
+

Best of the month

+ 이달의 베스트 상품이에요 +
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/index_20240731195100.html b/.history/index_20240731195100.html new file mode 100644 index 0000000..703e859 --- /dev/null +++ b/.history/index_20240731195100.html @@ -0,0 +1,449 @@ + + + + + + + + cafe24_clone + + + + +
+
+ +

HOON'S SHOP

+
    +
  • + +
    • +
  • +
    +2,000P
    + +
    • +
  • +
    2
    + +
    • +
  • + +
    • +
+
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+ +
+
+

MAN'S CLOTHES

+ + +
+ STYLE IN EVERY DAY +
+ main-slider_img +
+ FOR SPRING SET-UP +
+ + +
+
+
+
+
+
+
+ +
+
+ +
+

OPEN EVENT

+ 여름옷 30% 할인이벤트 +
+
+
+

HOON'S SHOP

+ 남자들을 위한 최상의 브랜드샵 +
+
+ + +
+

가게 위치

+ 서울시 강서구 양천로 1000길 XX로 +
+
+
+ + +
+

해시태그

+ #남성쇼핑몰 #여름옷 #패션룩 +
+
+
+ +
+

Best of the month

+ 이달의 베스트 상품이에요 +
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/login_20240731195126.html b/.history/login_20240731195126.html new file mode 100644 index 0000000..1b675df --- /dev/null +++ b/.history/login_20240731195126.html @@ -0,0 +1,123 @@ + + + + + + Document + + + + + +
+
+ +

HOON'S SHOP

+
    +
  • + +
    • +
  • +
    +2,000P
    + +
    • +
  • +
    2
    + +
    • +
  • + +
    • +
+
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+ +
+ + + + + + + +
+ + + + diff --git a/.history/login_20240731195252.html b/.history/login_20240731195252.html new file mode 100644 index 0000000..5e865a9 --- /dev/null +++ b/.history/login_20240731195252.html @@ -0,0 +1,123 @@ + + + + + + Document + + + + + +
+
+ +

HOON'S SHOP

+
    +
  • + +
    • +
  • +
    +2,000P
    + +
    • +
  • +
    2
    + +
    • +
  • + +
    • +
+
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+ +
+ + + + + + + +
+ + + + diff --git a/.history/login_20240731195254.html b/.history/login_20240731195254.html new file mode 100644 index 0000000..5e865a9 --- /dev/null +++ b/.history/login_20240731195254.html @@ -0,0 +1,123 @@ + + + + + + Document + + + + + +
+
+ +

HOON'S SHOP

+
    +
  • + +
    • +
  • +
    +2,000P
    + +
    • +
  • +
    2
    + +
    • +
  • + +
    • +
+
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+ +
+ + + + + + + +
+ + + + diff --git a/.history/outer_20240731195200.html b/.history/outer_20240731195200.html new file mode 100644 index 0000000..97781a4 --- /dev/null +++ b/.history/outer_20240731195200.html @@ -0,0 +1,378 @@ + + + + + + Document + + + + + +
+
+ +

+ HOON'S SHOP +

+ +
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/outer_20240731195201.html b/.history/outer_20240731195201.html new file mode 100644 index 0000000..97781a4 --- /dev/null +++ b/.history/outer_20240731195201.html @@ -0,0 +1,378 @@ + + + + + + Document + + + + + +
+
+ +

+ HOON'S SHOP +

+ +
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/outer_20240731195224.html b/.history/outer_20240731195224.html new file mode 100644 index 0000000..4cd6d8c --- /dev/null +++ b/.history/outer_20240731195224.html @@ -0,0 +1,378 @@ + + + + + + Document + + + + + +
+
+ +

+ HOON'S SHOP +

+ +
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/outer_20240731195509.html b/.history/outer_20240731195509.html new file mode 100644 index 0000000..692c7a3 --- /dev/null +++ b/.history/outer_20240731195509.html @@ -0,0 +1,378 @@ + + + + + + Document + + + + + +
+
+ +

+ HOON'S SHOP +

+ +
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/.history/outer_20240731195825.html b/.history/outer_20240731195825.html new file mode 100644 index 0000000..4cd6d8c --- /dev/null +++ b/.history/outer_20240731195825.html @@ -0,0 +1,378 @@ + + + + + + Document + + + + + +
+
+ +

+ HOON'S SHOP +

+ +
+ +
+
    +
  • BEST
    • +
  • NEW5%
    • +
  • 1+1
    • +
  • OUTER
    • +
  • TOP
    • +
  • SHIRTS
    • +
  • DRESS
    • +
  • PANTS
    • +
  • ACC
    • +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 그린자켓

+
+
+ + #스트릿 #캐쥬얼 #유럽여행 #거리에서 화보를 + +
+
+ 20,0000원 + 30,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 조거팬츠

+
+
+ + #스트릿 #코레오 #모델들이 찾는 #댄서룩 + +
+
+ 18,0000원 + 28,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 코트

+
+
+ + #슬림핏 #울코트 #가을룩 #출근길에도 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 슬림핏 티셔츠

+
+
+ + #집에서나 #밖에서나 #티셔츠만 입어도 모델핏 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 베이직 슬림 무지 티셔츠 +

+
+
+ + #편하게 입을 수 있어요 #간편해요 #데일리룩으로 좋아요 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

모먼트 베이직 골지 세트

+
+
+ + #집에서 #간편해요 #시원해요 + +
+
+ 18,0000원 + 20,000원 + 30% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 화이트 트레이닝 세트 +

+
+
+ + #캐쥬얼 #운동 #잠옷으로도 #집에서도 편하게 + +
+
+ 13,0000원 + 25,000원 + 25% +
+
+
+
+ +
+
+
+
+
+
+
+
+
+

+ 모먼트 그레이 트레이닝세트(공용) +

+
+
+ + #남녀모두 #운동룩 #한강에서 러닝하면서 + +
+
+ 15,0000원 + 23,000원 + 40% +
+
+
+
+ + + + diff --git a/src/css/components/footer.css b/css/components/footer.css similarity index 100% rename from src/css/components/footer.css rename to css/components/footer.css diff --git a/src/css/components/header.css b/css/components/header.css similarity index 100% rename from src/css/components/header.css rename to css/components/header.css diff --git a/src/css/components/product-list.css b/css/components/product-list.css similarity index 100% rename from src/css/components/product-list.css rename to css/components/product-list.css diff --git a/css/pages/login.css b/css/pages/login.css new file mode 100644 index 0000000..a1571f4 --- /dev/null +++ b/css/pages/login.css @@ -0,0 +1,104 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +.header__title a { + text-decoration: none; + color: black; +} +.login-wrapper { + height: 80vh; + display: flex; + flex-direction: column; + padding: 0 700px; + padding-top: 100px; +} +.login__title { + font-size: 30px; + font-weight: 700; + margin-bottom: 15px; +} +.login__text { + color: rgba(0, 0, 0, 0.5); + margin-bottom: 7px; + text-decoration: none; + transition: color 0.2s ease-in-out; +} + +.login__form { + display: flex; + flex-direction: column; +} +.login__btn { + background-color: black; + border-radius: 5px; + color: white; + font-size: 18px; + padding: 10px 0; + border: none; + margin: 5px 0; + display: flex; + justify-content: center; + align-items: center; + position: relative; + transition: background-color 0.2s ease-in-out; + transition: transform 0.2s ease-in-out; +} +.login__btn:active { + transform: scale(1.07); +} +.login__btn:hover { + background-color: rgb(50, 49, 49); +} + +.login__btn svg { + width: 25px; + height: 25px; + position: absolute; + left: 30px; +} +.login__btn-kakao { + margin-top: 50px; + background-color: #fee500; + color: black; + margin-bottom: 30px; +} +.login__btn-kakao:hover { + background-color: #f7e85d; +} +.login__btn-naver { + background-color: #1dc800; +} +.login__btn-naver:hover { + background-color: #49cd32; +} +.login__btn-naver { + fill: white; +} +.login__text-box { + margin-bottom: 30px; + display: flex; + justify-content: space-between; +} +.login__label { + display: flex; + flex-direction: column; + margin: 10px 0; +} + +.login__input { + border: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.5); + margin-top: 10px; +} + +.login__input:focus { + outline: none; + border-color: black; +} +.login__label:focus-within .login__text { + color: black; +} +.login__text-box .login__text:hover { + color: black; +} diff --git a/css/pages/main.css b/css/pages/main.css new file mode 100644 index 0000000..c65188a --- /dev/null +++ b/css/pages/main.css @@ -0,0 +1,7 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/slider.css"; +@import "/intro.css"; +@import "/css/components/product-list.css"; +@import "/css/components/footer.css"; diff --git a/css/pages/sub-category.css b/css/pages/sub-category.css new file mode 100644 index 0000000..6354a20 --- /dev/null +++ b/css/pages/sub-category.css @@ -0,0 +1,18 @@ +@import "/reset.css"; +@import "/common.css"; +@import "/css/components/header.css"; +@import "/css/components/footer.css"; +@import "/css/components/product-list.css"; +.main { + padding-top: 30px; + display: flex; + flex-direction: column; + align-items: center; +} +.header__title a { + text-decoration: none; + color: black; +} +.gotologin { + color: black; +} diff --git a/index.html b/index.html index 37fb8bd..703e859 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - + cafe24_clone