only avatar for fab

theHandsomestNerd · Dec 6, 2023 · 0d7a725 · 0d7a725
1 parent 6f147b6
commit 0d7a725
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 29 deletions.
diff --git a/src/components/BusinessCard.tsx b/src/components/BusinessCard.tsx
@@ -1,7 +1,18 @@
 import React, {FunctionComponent, useContext, useState} from 'react'
 import {Theme, ThemeProvider} from "@mui/material/styles";
 import makeStyles from '@mui/styles/makeStyles';
-import {Avatar, Button, Divider, Drawer, Grid, List, ListItem, Typography, useTheme,} from '@mui/material';
+import {
+    Avatar,
+    Button,
+    Divider,
+    Drawer,
+    Grid,
+    List,
+    ListItem,
+    Typography,
+    useMediaQuery,
+    useTheme,
+} from '@mui/material';
 import createStyles from '@mui/styles/createStyles';
 import {Close, FileCopy} from "@mui/icons-material";
 import SocialMediaBlock from "./templates/my-digital-resume/social-media-block/SocialMediaBlock";
@@ -94,7 +105,6 @@ const BusinessCard: FunctionComponent<MainMenuProps> = ({anchor, homePage}) => {
     // }, [qrCodeContext.qr_code_value])
 
     const list = (anchor: MainMenuAnchorType) => (
-        <ThemeProvider theme={theme}>
             <Grid xs={12} md={6} container item
                   role="presentation"
                 // onClick={toggleDrawer(anchor, false)}
@@ -307,27 +317,18 @@ const BusinessCard: FunctionComponent<MainMenuProps> = ({anchor, homePage}) => {
 
                 {/*})}*/}
             </Grid>
-        </ThemeProvider>
     );
 
+
     return (
-            <ThemeProvider theme={theme
-}><Grid item container>
+            <Grid item container>
                 <Grid item container justifyContent='flex-end' style={{padding: theme
-.spacing(2, 3)}}>
+.spacing(3, 3)}}>
 
                     <Button variant='contained' color='primary' onClick={toggleDrawer(anchor, true)}>
-                        <Grid container spacing={2} alignItems='center'>
-                            <Grid item>
-                                <Avatar style={{backgroundColor: "whitesmoke"}}
-                                        src={urlFor(homePage.headerContent.content[0].headerMenuRef.logoImageSrc ?? "").url() ?? ""}/>
-
-                            </Grid>
-                            <Grid item>
-                                <Typography color='textSecondary' variant='button'>Contact Info</Typography>
+                        <Avatar style={{backgroundColor: "whitesmoke"}}
+                                src={urlFor(homePage.headerContent.content[0].headerMenuRef.logoImageSrc ?? "").url() ?? ""}/>
 
-                            </Grid>
-                        </Grid>
                     </Button>
                 </Grid>
 
@@ -341,10 +342,8 @@ const BusinessCard: FunctionComponent<MainMenuProps> = ({anchor, homePage}) => {
 
                               position: "absolute",
                               zIndex: 1000,
-                              paddingLeft: theme
-.spacing(4),
-                              paddingRight: theme
-.spacing(6),
+                              paddingLeft: theme.spacing(4),
+                              paddingRight: theme.spacing(6),
                           }}>
 
                         {/*<Grid item xs={3}>*/}
@@ -358,7 +357,7 @@ const BusinessCard: FunctionComponent<MainMenuProps> = ({anchor, homePage}) => {
                         {list(anchor)}
                     </Grid>
                 </Drawer>
-            </Grid></ThemeProvider>
+            </Grid>
     );
 }
 

diff --git a/src/components/templates/my-digital-resume/ResumeContactUsSection.tsx b/src/components/templates/my-digital-resume/ResumeContactUsSection.tsx
@@ -11,7 +11,7 @@ import leadClient from "../transform-hw/pages/under-construction-page/leadClient
 import SnackbarContext from "../../modal-context/SnackbarContext";
 import {Theme} from "@mui/material/styles";
 import withStyles from "@mui/styles/withStyles";
-import {Grid, TextField, Typography, useTheme} from "@mui/material";
+import {Grid, TextField, Typography, useMediaQuery, useTheme} from "@mui/material";
 
 export const useStyles = makeStyles((theme: Theme) => ({
     root: {
@@ -172,14 +172,15 @@ const ResumeContactUsSection: FunctionComponent<ContactUsProps> = (props) => {
     }
 
     const theme = useTheme()
+    const smDown = useMediaQuery(theme.breakpoints.down('sm'))
+
 
     return (
         <Grid
             container
             item
-            style={{
-                padding: theme.spacing(4)
-            }}
+            style={{padding: theme.spacing(4,smDown?1:4)}}
+
             className={globalClasses.resumeSection}
         >
             <Grid container item spacing={3}>
@@ -272,16 +273,18 @@ const ResumeContactUsSection: FunctionComponent<ContactUsProps> = (props) => {
                                 }}
                             />
                         </Grid>
-                        <Grid container item justifyContent='flex-end' style={{marginTop: theme.spacing(1)}}>
+                    </Grid>
+                        <Grid container item justifyContent='flex-end' style={{paddingRight:"16px"}}>
                             <LoadingButton
                                 width={200}
                                 isLoading={isLoading || isRefetching}
                                 disabled={!!(data || isError || (email && (email.length > 0) && !isEmail(email)))}
                                 clickHandler={createLead}
-                                color="primary" variant="contained"><Typography>Send
-                                Message</Typography></LoadingButton>
+                                color="primary" variant="contained">
+                                <Typography>Send
+                                Message</Typography>
+                            </LoadingButton>
                         </Grid>
-                    </Grid>
 
 
                 </Grid>