From 69bb602e29f3c52d345a7a4d7ee2820454321794 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=B0=BD=EC=88=98?= <chang9811@interplug.co.kr>
Date: Tue, 21 Jan 2025 09:44:52 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A1=9C=EB=94=A9=EB=B0=94=20=EC=9C=84?=
 =?UTF-8?q?=EC=B9=98=20=EB=B0=8F=20css=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/management/newproduct/page.jsx        |  4 +++
 .../common/spinner/LoadingSpinner.jsx}        |  2 +-
 src/components/publishpage/PublishPage.jsx    | 26 ++++---------------
 src/styles/spinner.scss                       |  6 ++++-
 4 files changed, 15 insertions(+), 23 deletions(-)
 rename src/{app/spinner/page.jsx => components/common/spinner/LoadingSpinner.jsx} (76%)

diff --git a/src/app/management/newproduct/page.jsx b/src/app/management/newproduct/page.jsx
index 755bf75..58d307a 100644
--- a/src/app/management/newproduct/page.jsx
+++ b/src/app/management/newproduct/page.jsx
@@ -7,6 +7,7 @@ import '@/styles/grid.scss';
 import NewProductTable from "@/components/sub/management/newproduct/NewProductTable";
 import FindAddressPop from "@/components/sub/management/newproduct/FindAddressPop";
 import DesignRequestPop from "@/components/sub/management/newproduct/DesignRequestPop";
+import LoadingSpinner from "@/components/common/spinner/LoadingSpinner";
 
 export default function NewProductPage(){
     return(
@@ -48,6 +49,9 @@ export default function NewProductPage(){
 
             {/* 설계의뢰 불러오기 팝업 */}
             {/* <DesignRequestPop/> */}
+
+            {/* 로딩바 */}
+            <LoadingSpinner/>
         </div>
     )
 }
\ No newline at end of file
diff --git a/src/app/spinner/page.jsx b/src/components/common/spinner/LoadingSpinner.jsx
similarity index 76%
rename from src/app/spinner/page.jsx
rename to src/components/common/spinner/LoadingSpinner.jsx
index 4f43cbc..de17aaf 100644
--- a/src/app/spinner/page.jsx
+++ b/src/components/common/spinner/LoadingSpinner.jsx
@@ -1,6 +1,6 @@
 import '@/styles/spinner.scss'
 
-export default function LoadingSpinnerPage() {
+export default function LoadingSpinner() {
     return(
         <div className='spinner-wrap'>
             <span className="loader"></span>
diff --git a/src/components/publishpage/PublishPage.jsx b/src/components/publishpage/PublishPage.jsx
index 5a81f40..efd6381 100644
--- a/src/components/publishpage/PublishPage.jsx
+++ b/src/components/publishpage/PublishPage.jsx
@@ -362,7 +362,11 @@ export default function PublishPage() {
                   </Link>
                 </td>
                 <td className="coding_stat_web"></td>
-                <td className='red al-c'></td>
+                <td className='red al-c'>
+                  <ul>
+                    <li>*예시 로딩바 추가</li>
+                  </ul>
+                </td>
                 <td className="t-center">2024-10-11</td>
               </tr>
               <tr>
@@ -450,26 +454,6 @@ export default function PublishPage() {
                 <td className='red al-c'></td>
                 <td className="t-center">2024-10-14</td>
               </tr>
-              <tr>
-                <td className="t-center">
-                  <strong>로딩페이지</strong>
-                </td>
-                <td>
-                </td>
-                <td>
-                  <Link href="/spinner" target="_blank">
-                    LoadingPage
-                  </Link>
-                </td>
-                <td className="coding_stat_web"></td>
-                <td className='red al-c'>
-                  <ul>
-                    <li>2024-11-28</li>
-                    <li>*로딩페이지 추가</li>
-                  </ul>
-                </td>
-                <td className="t-center">2024-11-28</td>
-              </tr>
             </tbody>
           </table>
         </div>
diff --git a/src/styles/spinner.scss b/src/styles/spinner.scss
index b6398e9..45e124a 100644
--- a/src/styles/spinner.scss
+++ b/src/styles/spinner.scss
@@ -1,10 +1,14 @@
 .spinner-wrap{
+    position: fixed;
+    top: 0;
+    left: 0;
     width: 100%;
     height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
-    background-color: #fff;
+    background-color: rgba($color: #101010, $alpha: 0.2);
+    z-index: 2000000;
     .loader {
         font-size: 10px;
         width: 1.2em;