diff --git a/src/app/layout.js b/src/app/layout.js index 520eaea7..4f7acb9d 100644 --- a/src/app/layout.js +++ b/src/app/layout.js @@ -1,4 +1,4 @@ -import { Inter } from 'next/font/google' +// import { Inter } from 'next/font/google' import { headers } from 'next/headers' import { redirect } from 'next/navigation' @@ -8,14 +8,15 @@ import UIProvider from './UIProvider' import { ToastContainer } from 'react-toastify' +import { QcastProvider } from './QcastProvider' import Header from '@/components/header/Header' import QModal from '@/components/common/modal/QModal' -import { QcastProvider } from './QcastProvider' import './globals.css' import '../styles/style.scss' +import Dimmed from '@/components/ui/Dimmed' -const inter = Inter({ subsets: ['latin'] }) +// const inter = Inter({ subsets: ['latin'] }) export const metadata = { title: 'Create Next App', @@ -35,22 +36,23 @@ export default async function RootLayout({ children }) { } return ( - - - {/*{headerPathname !== '/login' && }*/} - + + + + {/*{headerPathname !== '/login' && }*/}
-
- + +
+ {children} - -
+
+
- - - + + + ) } diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index 33e522ee..f7280734 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -1,14 +1,14 @@ 'use client' +import { useEffect, useState } from 'react' +import { useRecoilValue } from 'recoil' +import { useAxios } from '@/hooks/useAxios' +import { globalLocaleStore } from '@/store/localeAtom' import CanvasMenu from '@/components/floor-plan/CanvasMenu' import SettingModal01 from '@/components/floor-plan/modal/setting01/SettingModal01' import CanvasLayout from '@/components/floor-plan/CanvasLayout' -import '@/styles/contents.scss' import OuterLineWall from '@/components/floor-plan/modal/outerlinesetting/OuterLineWall' -import { useEffect, useState } from 'react' -import { globalLocaleStore } from '@/store/localeAtom' -import { useRecoilValue } from 'recoil' -import { useAxios } from '@/hooks/useAxios' +import '@/styles/contents.scss' export default function FloorPlan() { const [showCanvasSettingModal, setShowCanvasSettingModal] = useState(false) diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx index e8a4e872..9e84f642 100644 --- a/src/components/header/Header.jsx +++ b/src/components/header/Header.jsx @@ -6,6 +6,8 @@ import { useMessage } from '@/hooks/useMessage' import { logout } from '@/lib/authActions' import QSelectBox from '@/components/common/select/QSelectBox' +import { useRecoilValue } from 'recoil' +import { dimmedStore } from '@/store/commonAtom' export const ToggleonMouse = (e, act, target) => { const listWrap = e.target.closest(target) @@ -31,6 +33,9 @@ export default function Header(props) { // } const [selected, setSelected] = useState('') + const dimmedState = useRecoilValue(dimmedStore) + const isDimmed = dimmedState ? 'opacity-50 bg-black' : '' + const SelectOptions = [ { id: 0, name: 'オンライン保証シ', link: '' }, { id: 1, name: 'ステム', link: '' }, @@ -108,7 +113,7 @@ export default function Header(props) { return ( !(pathName.includes('login') || pathName.includes('join')) && ( -
+

diff --git a/src/components/ui/Dimmed.jsx b/src/components/ui/Dimmed.jsx new file mode 100644 index 00000000..c38e45cc --- /dev/null +++ b/src/components/ui/Dimmed.jsx @@ -0,0 +1,11 @@ +'use client' + +import { useRecoilValue } from 'recoil' +import { dimmedStore } from '@/store/commonAtom' + +export default function Dimmed() { + const dimmedState = useRecoilValue(dimmedStore) + + const isDimmed = dimmedState ? 'fixed top-0 left-0 w-full h-full z-100 opacity-50 bg-black' : '' + return
+} diff --git a/src/store/commonAtom.js b/src/store/commonAtom.js new file mode 100644 index 00000000..495ecfb7 --- /dev/null +++ b/src/store/commonAtom.js @@ -0,0 +1,6 @@ +import { atom } from 'recoil' + +export const dimmedStore = atom({ + key: 'dimmedState', + default: false, +})