diff --git a/public/static/images/canvas/ico-flx01.svg b/public/static/images/canvas/ico-flx01.svg
new file mode 100644
index 0000000..84185ff
--- /dev/null
+++ b/public/static/images/canvas/ico-flx01.svg
@@ -0,0 +1,4 @@
+
diff --git a/public/static/images/canvas/ico-flx02.svg b/public/static/images/canvas/ico-flx02.svg
new file mode 100644
index 0000000..400d973
--- /dev/null
+++ b/public/static/images/canvas/ico-flx02.svg
@@ -0,0 +1,5 @@
+
diff --git a/public/static/images/canvas/ico-flx03.svg b/public/static/images/canvas/ico-flx03.svg
new file mode 100644
index 0000000..44c2eea
--- /dev/null
+++ b/public/static/images/canvas/ico-flx03.svg
@@ -0,0 +1,5 @@
+
diff --git a/public/static/images/canvas/ico-flx04.svg b/public/static/images/canvas/ico-flx04.svg
new file mode 100644
index 0000000..ae584b3
--- /dev/null
+++ b/public/static/images/canvas/ico-flx04.svg
@@ -0,0 +1,6 @@
+
diff --git a/src/app/main/page.jsx b/src/app/main/page.jsx
new file mode 100644
index 0000000..46b2919
--- /dev/null
+++ b/src/app/main/page.jsx
@@ -0,0 +1,12 @@
+import Header from "@/components/header/Header";
+
+export default function MainPage() {
+ return(
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/canvas/CanvasMenu.jsx b/src/components/canvas/CanvasMenu.jsx
index 4ef52ac..e9631a9 100644
--- a/src/components/canvas/CanvasMenu.jsx
+++ b/src/components/canvas/CanvasMenu.jsx
@@ -5,6 +5,7 @@ import MenuDepth01 from "./MenuDepth01";
import { useRecoilState } from "recoil";
import { modalState } from "@/store/modalAtom";
+
export default function CanvasMenu() {
const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
const [menuNumber, setMenuNumber] = useState(null);
@@ -77,8 +78,42 @@ export default function CanvasMenu() {
}
- {(menuNumber === 5) && 'asdasd'}
- {(menuNumber === 6) && '103516516'}
+ {(menuNumber === 5) &&
+ <>
+
+
+
+
+
+
+
+ }
+ {(menuNumber === 6) &&
+ <>
+
+
+
+
+
+ }
diff --git a/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx b/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
index cee0ed5..f2174c3 100644
--- a/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
+++ b/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
@@ -7,7 +7,7 @@ import { useRecoilState } from "recoil";
export default function OuterLineWall (){
- const [modalOption, setModalOption] = useRecoilState(modalState);
+ const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
const [buttonAct, setButtonAct] = useState(1);
const [close, setClose] = useState(false)
const HandleClickClose = () => {
diff --git a/src/components/publishpage/PublishPage.jsx b/src/components/publishpage/PublishPage.jsx
index c09a770..1bea5f4 100644
--- a/src/components/publishpage/PublishPage.jsx
+++ b/src/components/publishpage/PublishPage.jsx
@@ -83,6 +83,13 @@ export default function PublishPage() {
|
2024-09-06 |
+
+ | MainPage |
+ |
+ MainPage |
+ |
+ 2024-09-11 |
+
diff --git a/src/styles/_contents.scss b/src/styles/_contents.scss
index c2e13d0..1d37812 100644
--- a/src/styles/_contents.scss
+++ b/src/styles/_contents.scss
@@ -110,6 +110,25 @@
}
}
}
+ .ico-btn-from{
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ button{
+ .ico{
+ display: block;
+ width: 14px;
+ height: 14px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ &.ico01{background-image: url(../../public/static/images/canvas/ico-flx01.svg);}
+ &.ico02{background-image: url(../../public/static/images/canvas/ico-flx02.svg);}
+ &.ico03{background-image: url(../../public/static/images/canvas/ico-flx03.svg);}
+ &.ico04{background-image: url(../../public/static/images/canvas/ico-flx04.svg);}
+ }
+ }
+ }
.vertical-horizontal{
display: flex;
min-width: 170px;
diff --git a/src/styles/_reset.scss b/src/styles/_reset.scss
index 0401850..a47b525 100644
--- a/src/styles/_reset.scss
+++ b/src/styles/_reset.scss
@@ -172,6 +172,7 @@ button{
font-weight: 500;
}
}
+ &:hover,
&.act{
background-color: #1083E3;
border: 1px solid #1083E3;
@@ -182,6 +183,17 @@ button{
display: block;
width: 100%;
}
+ &.ico-flx{
+ display: flex;
+ align-items: center;
+ .ico{
+ margin-right: 10px;
+ }
+ &:hover,
+ &.act{
+ font-weight: 400;
+ }
+ }
}
// select