diff --git a/brush/src/components/KloGbaSidebar/Community/index.js b/brush/src/components/KloGbaSidebar/Community/index.js index 4e85367..7667aa3 100644 --- a/brush/src/components/KloGbaSidebar/Community/index.js +++ b/brush/src/components/KloGbaSidebar/Community/index.js @@ -1,37 +1,44 @@ -import React from 'react' +import React, { useContext } from 'react' import discordIcon from '../../../../assets/discord-icon.png' import gitHubIcon from '../../../../assets/github-icon.png' import mediumIcon from '../../../../assets/medium-icon.png' import twitterIcon from '../../../../assets/twitter-icon.png' +import ROMContext from '../../../context/ROMContext' import CommunityIcon from './CommunityIcon' import style from './style.css' -const Community = () => ( -
- +const Community = () => { + const { romBufferStatus } = useContext(ROMContext) - + const isShowingInputModal = (romBufferStatus !== 'loaded') - + return ( +
+ - -
-) + + + + + +
+ ) +} export default Community diff --git a/brush/src/components/KloGbaSidebar/Community/style.css b/brush/src/components/KloGbaSidebar/Community/style.css index def3f9b..bbf5685 100644 --- a/brush/src/components/KloGbaSidebar/Community/style.css +++ b/brush/src/components/KloGbaSidebar/Community/style.css @@ -17,6 +17,10 @@ opacity: 0.4; } +.iconWhenModalIsPresent { + opacity: 0.8; +} + .icon:hover { opacity: 1; } diff --git a/brush/src/components/KloGbaSidebar/style.css b/brush/src/components/KloGbaSidebar/style.css index 4a8d151..69afcf0 100644 --- a/brush/src/components/KloGbaSidebar/style.css +++ b/brush/src/components/KloGbaSidebar/style.css @@ -1,6 +1,9 @@ +@import "former-kit-skin-pagarme/dist/styles/z-index.css"; + .communityContainer { position: absolute; width: inherit; min-width: inherit; bottom: 0; + z-index: calc(var(--modal-overlay-z-index) + 1); }