diff --git a/src/Components/UserPageComponents/Cover.js b/src/Components/UserPageComponents/Cover.js index 6fd3c539e020fc7e64bc674b3724f0ca746db932..d2ba43e93248e0c74cd19b0f94f49f87a68d5e3e 100644 --- a/src/Components/UserPageComponents/Cover.js +++ b/src/Components/UserPageComponents/Cover.js @@ -27,6 +27,8 @@ import ModalAlterarCover from '../ModalAlterarCover/ModalAlterarCover.js' export default function Cover (props) { const {state} = useContext(Store) + const WIDTH = window.innerWidth; + const [currentCover, setCoverImg] = useState(state.currentUser.cover_file_name) const [tempCover, setTempCover] = useState('') @@ -55,11 +57,21 @@ export default function Cover (props) { {currentCover && <img src={apiDomain + currentCover} alt = '' style= {{width:"100%", height:"100%", objectFit : "cover" }}/>} <input accept="image/*" style = {{display:"none"}} id="choose-cover-file" type="file" onChange={(e) => updateCover(e.target.files)}/> <label htmlFor="choose-cover-file"> + { + WIDTH >= 545 ? + <Tooltip title={<span style={{fontSize:"14px", overflow:"hidden", transition:"all .5s ease"}}>ALTERAR CAPA</span>} placement="left"> + <IconButton style={{position:"absolute",right:"0",bottom: "0",color:"#fff"}}color="primary" aria-label="upload picture" component="span"> + <PhotoCamera /> + </IconButton> + </Tooltip> + : <Tooltip title={<span style={{fontSize:"14px", overflow:"hidden", transition:"all .5s ease"}}>ALTERAR CAPA</span>} placement="left"> - <IconButton style={{position:"absolute",right:"0",top:"0",color:"#fff"}}color="primary" aria-label="upload picture" component="span"> + <IconButton style={{position:"absolute",left:"0",top: "0",color:"#fff"}}color="primary" aria-label="upload picture" component="span"> <PhotoCamera /> </IconButton> </Tooltip> + } + </label> </CoverContainer> </>