Add floating action button to App component
Updated the `App` component in `app.tsx` to include a new floating action button (Fab) linking to Digital Data. The button now features a transparent background and no box shadow, along with an image for improved visual representation. The `useScrollToTop` function remains unchanged but has a more streamlined implementation.
This commit is contained in:
parent
8771e025bc
commit
325b27262e
@ -22,8 +22,9 @@ export default function App({ children }: AppProps) {
|
|||||||
const ddButton = () => (
|
const ddButton = () => (
|
||||||
<Fab
|
<Fab
|
||||||
size="medium"
|
size="medium"
|
||||||
aria-label="Github"
|
aria-label="Digital Data"
|
||||||
href="https://github.com/minimal-ui-kit/material-kit-react"
|
href="https://digitaldata.works/"
|
||||||
|
target="_blank"
|
||||||
sx={{
|
sx={{
|
||||||
zIndex: 9,
|
zIndex: 9,
|
||||||
right: 20,
|
right: 20,
|
||||||
@ -31,10 +32,14 @@ export default function App({ children }: AppProps) {
|
|||||||
width: 48,
|
width: 48,
|
||||||
height: 48,
|
height: 48,
|
||||||
position: 'fixed',
|
position: 'fixed',
|
||||||
bgcolor: 'grey.800',
|
bgcolor: 'transparent',
|
||||||
|
boxShadow: 'none'
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Iconify width={24} icon="socials:github" sx={{ '--color': 'white' }} />
|
<img
|
||||||
|
src="/assets/images/product/product-default.webp"
|
||||||
|
alt="Digital Data"
|
||||||
|
/>
|
||||||
</Fab>
|
</Fab>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user