diff --git a/src/app/canvas/page.jsx b/src/app/canvas/page.jsx
index da62fdb..890b65b 100644
--- a/src/app/canvas/page.jsx
+++ b/src/app/canvas/page.jsx
@@ -104,7 +104,7 @@ export default function CanvasPage() {
{/* */}
{/* 처마∙케라바 변경 */}
- {/* */}
+
{/* 동선이동∙형 올림 내림 */}
{/* */}
diff --git a/src/app/main/page.jsx b/src/app/main/page.jsx
index abf5aa9..2c7027f 100644
--- a/src/app/main/page.jsx
+++ b/src/app/main/page.jsx
@@ -1,7 +1,9 @@
import Footer from "@/components/layout/Footer";
import Header from "@/components/layout/Header";
+import ChangePasswordPop from "@/components/main/ChangePasswordPop";
import MainContents from "@/components/main/MainContents";
import '@/styles/style.scss'
+import '@/styles/contents.scss'
export default function MainPage() {
return(
@@ -37,6 +39,9 @@ export default function MainPage() {
+
+ {/* 비밀번호 변경팝업 */}
+
)
}
\ No newline at end of file
diff --git a/src/components/main/ChangePasswordPop.jsx b/src/components/main/ChangePasswordPop.jsx
new file mode 100644
index 0000000..aa06728
--- /dev/null
+++ b/src/components/main/ChangePasswordPop.jsx
@@ -0,0 +1,57 @@
+
+export default function ChangePasswordPop(){
+ return(
+
+
+
+
+
パスワード変更
+
+
+
+
+
+
+
+
+
+
新しいパスワードを入力
+
半角10文字以内
+
+
+
+
+
+
+
+
新規パスワード再入力
+
半角10文字以内
+
+
+
+
+
+
+
+ 初期化されたパスワードでログインした場合、パスワードを変更しなければサイト利用が可能です。
+ パスワードを変更しない場合は、ログイン画面に進みます。
+
+
+
+
+
+
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/styles/_reset.scss b/src/styles/_reset.scss
index 6073b36..70c05a9 100644
--- a/src/styles/_reset.scss
+++ b/src/styles/_reset.scss
@@ -289,7 +289,7 @@ button{
.btn-origin{
display: inline-block;
height: 30px;
- padding: 0 14px;
+ padding: 0 10px;
border-radius: 2px;
background-color: #101010;
color: #fff;
@@ -299,7 +299,7 @@ button{
&.navy{
background-color: #304961;
&:hover{
- background-color: #1083E3;
+ background-color: #233546;
}
}
&.grey{
diff --git a/src/styles/_submodal.scss b/src/styles/_submodal.scss
new file mode 100644
index 0000000..ad4dd17
--- /dev/null
+++ b/src/styles/_submodal.scss
@@ -0,0 +1,147 @@
+.modal-popup{
+ position: fixed;
+ top: 0;
+ left: 0;
+ width:100%;
+ height:100%;
+ overflow-x: hidden;
+ overflow-y: auto;
+ background:rgba(0,0,0,.75);
+ z-index:110000;
+ .modal-dialog {
+ position: relative;
+ display: flex;
+ align-items: center;
+ min-height: calc(100% - (1.5rem * 2));
+ width: 680px;
+ z-index:200000;
+ margin: 1.5rem auto;
+ pointer-events: none;
+ .modal-content{
+ flex:1;
+ position: relative;
+ background-clip: padding-box;
+ background-color: transparent;
+ outline: 0 none;
+ pointer-events: auto;
+ border-radius: 4px;
+ .modal-header{
+ display: flex;
+ align-items: center;
+ padding: 10px 24px;
+ background-color: #364864;
+ border-radius: 4px 4px 0px 0px;
+ // overflow: hidden;
+ h1.title{
+ font-size: 13px;
+ color: $pop-color;
+ font-weight: 700;
+ }
+ .modal-close{
+ margin-left: auto;
+ color: transparent;
+ font-size: 0;
+ width: 10px;
+ height: 10px;
+ background: url(../../public/static/images/canvas/modal_close.svg)no-repeat center;
+ }
+ }
+ .modal-body{
+ padding: 30px;
+ background-color: #fff;
+ border-radius: 0px 0px 4px 4px;
+ .modal-body-inner{
+ margin-bottom: 20px;
+ &.border{
+ padding-bottom: 20px;
+ border-bottom: 1px solid #ECF0F4;
+ }
+ }
+ .footer-btn-wrap{
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ }
+ }
+ }
+ }
+}
+
+// modal-contents
+
+// 비밀번호 변경
+.change-password-guide{
+
+ span{
+ display: block;
+ margin-bottom: 5px;
+ font-size: 13px;
+ font-weight: 400;
+ color: #101010;
+ &:last-child{
+ margin-bottom: 0;
+ }
+ }
+}
+
+.change-password-box{
+ padding: 30px;
+ border-radius: 4px;
+ background: #F4F4F7;
+ margin-bottom: 20px;
+ .change-password-tit{
+ .tit-b{
+ font-size: 13px;
+ font-weight: 500;
+ color: #344356;
+ }
+ .tit-s{
+ font-size: 12px;
+ font-weight: 400;
+ color: #898989;
+ }
+ }
+ .change-password-input{
+ width: 100%;
+ .change-password{
+ width: 100%;
+ height: 45px;
+ border-radius: 4px;
+ border: 1px solid #E9E9E9;
+ background-color: #fff;
+ padding: 0 10px;
+ font-size: 12px;
+ color: #364864;
+ font-family: 'Noto Sans JP', sans-serif;
+ &::placeholder{
+ font-size: 12px;
+ }
+ }
+ }
+ .table-item-th{
+ width: 145px;
+ }
+}
+.form-table{
+ display: table;
+ table-layout: auto;
+ width: 100%;
+ .table-item{
+ display: table-row;
+ .table-item-th,
+ .table-item-td{
+ display: table-cell;
+ vertical-align: middle;
+ padding-bottom: 10px;
+ }
+ &:last-child{
+ .table-item-th,
+ .table-item-td{
+ padding-bottom: 0;
+ }
+ }
+ .table-item-td{
+ padding-left: 10px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/styles/contents.scss b/src/styles/contents.scss
index 38e7ff8..613c064 100644
--- a/src/styles/contents.scss
+++ b/src/styles/contents.scss
@@ -1,4 +1,5 @@
@import '_contents.scss';
@import '_modal.scss';
+@import '_submodal.scss';
@import '_table.scss';
@import '_canvasside.scss';
\ No newline at end of file