Merge pull request #60 from TABA-4th/dev

merge dev branch
TABA-4th · Dec 1, 2023 · 05cf881 · 05cf881
2 parents 589d091 + 9593e0e
commit 05cf881
Show file tree

Hide file tree

Showing 18 changed files with 863 additions and 30 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/Footers/DarkFooter.js b/src/components/Footers/DarkFooter.js
@@ -31,10 +31,10 @@ function DarkFooter() {
         <div className="copyright" id="copyright">
           © {new Date().getFullYear()}, Designed by{" "}
           <a
-            href="https://github.com/siwooJang"
+            href="https://github.com/TABA-4th/taba-frontend"
             target="_blank"
           >
-            siwooJang
+            Nimonaemo FE
           </a>
         </div>
       </Container>

diff --git a/src/components/Footers/DefaultFooter.js b/src/components/Footers/DefaultFooter.js
@@ -34,10 +34,10 @@ function DefaultFooter() {
         <div className="copyright" id="copyright">
           © {new Date().getFullYear()}, Designed by{" "}
           <a
-            href="https://github.com/siwooJang"
+            href="https://github.com/TABA-4th/taba-frontend"
             target="_blank"
           >
-            siwooJang
+            Nimonaemo FE
           </a>
         </div>
       </Container>

diff --git a/src/components/Footers/TransparentFooter.js b/src/components/Footers/TransparentFooter.js
@@ -31,10 +31,10 @@ function TransparentFooter() {
         <div className="copyright" id="copyright">
           © {new Date().getFullYear()}, Designed by{" "}
           <a
-            href="https://github.com/siwooJang"
+            href="https://github.com/TABA-4th/taba-frontend"
             target="_blank"
           >
-            siwooJang
+            Nimonaemo FE
           </a>
         </div>
       </Container>

diff --git a/src/components/Headers/ProductHeader.js b/src/components/Headers/ProductHeader.js
@@ -0,0 +1,67 @@
+import React from "react";
+import { Container } from "reactstrap";
+
+
+const userName = sessionStorage.getItem("nickname");
+
+function ProductHeader() {
+  let pageHeader = React.createRef();
+
+  React.useEffect(() => {
+    if (window.innerWidth > 991) {
+      const updateScroll = () => {
+        let windowScrollTop = window.pageYOffset / 3;
+        pageHeader.current.style.transform =
+          "translate3d(0," + windowScrollTop + "px,0)";
+      };
+      window.addEventListener("scroll", updateScroll);
+      return function cleanup() {
+        window.removeEventListener("scroll", updateScroll);
+      };
+    }
+  });
+  return (
+    <>
+      <div
+        className="page-header clear-filter page-header-small"
+        filter-color="blue"
+      >
+        <div
+          className="page-header-image"
+          style={{
+            backgroundImage: "url(" + require("assets/img/bg5.jpg") + ")"  // 헤더 부분 배경 이미지
+          }}
+          ref={pageHeader}
+        ></div>
+        <Container>
+          {/* <div className="photo-container">
+            <img alt="..." src={require("assets/img/ryan.jpg")}></img>
+          </div> */}
+          <h1 className="title">당신의 두피특성에 딱 맞는 샴푸 추천!</h1>
+          <h6>표시되는 가격은 프로모션 및 쇼핑몰 사정 상 실제가격과 일부 차이가 있을 수 있음을 알려드립니다.</h6>
+          {/*<p className="category">Photographer</p>*/}
+
+          {/* 여기다가 총 검사건수
+          <div className="content">
+            <div className="social-description">
+              <h2>26</h2>
+              <p>Comments</p>
+            </div>
+
+            
+            <div className="social-description">
+              <h2>26</h2>
+              <p>Comments</p>
+            </div>
+            <div className="social-description">
+              <h2>48</h2>
+              <p>Bookmarks</p>
+            </div>
+          </div> */}
+        </Container>
+      </div>
+    </>
+  );
+}
+
+export default ProductHeader;
diff --git a/src/components/Headers/ProfileMypage.js b/src/components/Headers/ProfileMypage.js
@@ -0,0 +1,66 @@
+import React from "react";
+import { Container } from "reactstrap";
+
+
+const userName = sessionStorage.getItem("nickname");
+
+function ProfileMypageHeader() {
+  let pageHeader = React.createRef();
+
+  React.useEffect(() => {
+    if (window.innerWidth > 991) {
+      const updateScroll = () => {
+        let windowScrollTop = window.pageYOffset / 3;
+        pageHeader.current.style.transform =
+          "translate3d(0," + windowScrollTop + "px,0)";
+      };
+      window.addEventListener("scroll", updateScroll);
+      return function cleanup() {
+        window.removeEventListener("scroll", updateScroll);
+      };
+    }
+  });
+  return (
+    <>
+      <div
+        className="page-header clear-filter page-header-small"
+        filter-color="blue"
+      >
+        <div
+          className="page-header-image"
+          style={{
+            backgroundImage: "url(" + require("assets/img/bg5.jpg") + ")"  // 헤더 부분 배경 이미지
+          }}
+          ref={pageHeader}
+        ></div>
+        <Container>
+          <div className="photo-container">
+            <img alt="..." src={require("assets/img/ryan.jpg")}></img>
+          </div>
+          <h3 className="title">{userName}</h3>
+          {/*<p className="category">Photographer</p>*/}
+
+          {/* 여기다가 총 검사건수
+          <div className="content">
+            <div className="social-description">
+              <h2>26</h2>
+              <p>Comments</p>
+            </div>
+
+            
+            <div className="social-description">
+              <h2>26</h2>
+              <p>Comments</p>
+            </div>
+            <div className="social-description">
+              <h2>48</h2>
+              <p>Bookmarks</p>
+            </div>
+          </div> */}
+        </Container>
+      </div>
+    </>
+  );
+}
+
+export default ProfileMypageHeader;