Remove Add and use AddIcon from MUI

This commit is contained in:
Nicola Benaglia
2025-04-20 17:57:19 +02:00
parent 2f3252a2e3
commit fda3208072
5 changed files with 23 additions and 35 deletions

View File

@@ -1,4 +1,3 @@
import React, { useEffect, useMemo, useState } from 'react';
import {
AppCircle,
AppCircleContainer,

View File

@@ -2,12 +2,12 @@ import { Typography, Box, ButtonBase } from '@mui/material';
import { styled } from '@mui/system';
export const AppsParent = styled(Box)(({ theme }) => ({
alignItems: 'center',
display: 'flex',
width: '100%',
flexDirection: 'column',
height: '100%',
alignItems: 'center',
overflow: 'auto',
width: '100%',
// For WebKit-based browsers (Chrome, Safari, etc.)
'::-webkit-scrollbar': {
width: '0px', // Set the width to 0 to hide the scrollbar
@@ -25,34 +25,34 @@ export const AppsParent = styled(Box)(({ theme }) => ({
}));
export const AppsContainer = styled(Box)(({ theme }) => ({
display: 'flex',
width: '90%',
justifyContent: 'space-evenly',
gap: '24px',
flexWrap: 'wrap',
alignItems: 'flex-start',
alignSelf: 'center',
backgroundColor: theme.palette.background.default,
color: theme.palette.text.primary,
display: 'flex',
flexWrap: 'wrap',
gap: '24px',
justifyContent: 'space-evenly',
width: '90%',
}));
export const AppsLibraryContainer = styled(Box)(({ theme }) => ({
display: 'flex',
width: '100%',
flexDirection: 'column',
justifyContent: 'flex-start',
alignItems: 'center',
backgroundColor: theme.palette.background.paper,
display: 'flex',
flexDirection: 'column',
justifyContent: 'flex-start',
width: '100%',
}));
export const AppsWidthLimiter = styled(Box)(({ theme }) => ({
display: 'flex',
width: '90%',
flexDirection: 'column',
justifyContent: 'flex-start',
alignItems: 'flex-start',
backgroundColor: theme.palette.background.default,
color: theme.palette.text.primary,
display: 'flex',
flexDirection: 'column',
justifyContent: 'flex-start',
width: '90%',
}));
export const AppsSearchContainer = styled(Box)(({ theme }) => ({
@@ -99,15 +99,6 @@ export const AppCircleContainer = styled(Box)(({ theme }) => ({
width: '100%',
}));
export const Add = styled(Typography)(({ theme }) => ({
backgroundColor: theme.palette.background.default,
color: theme.palette.text.primary,
fontSize: '36px',
fontWeight: 500,
lineHeight: '43.57px',
textAlign: 'left',
}));
export const AppCircleLabel = styled(Typography)(({ theme }) => ({
backgroundColor: theme.palette.background.default,
color: theme.palette.text.primary,

View File

@@ -7,7 +7,7 @@ import {
AppsContainer,
} from './Apps-styles';
import { Box, ButtonBase, Input, useTheme } from '@mui/material';
import { Add } from '@mui/icons-material';
import AddIcon from '@mui/icons-material/Add';
import { executeEvent } from '../../utils/events';
import { Spacer } from '../../common/Spacer';
import { SortablePinnedApps } from './SortablePinnedApps';
@@ -140,7 +140,7 @@ export const AppsHomeDesktop = ({
}}
>
<AppCircle>
<Add>+</Add>
<AddIcon />
</AppCircle>
<AppCircleLabel>Library</AppCircleLabel>

View File

@@ -23,13 +23,13 @@ import {
import { Label } from '../Group/AddGroup';
import { Spacer } from '../../common/Spacer';
import {
Add,
AppCircle,
AppCircleContainer,
AppCircleLabel,
PublishQAppChoseFile,
PublishQAppInfo,
} from './Apps-styles';
import AddIcon from '@mui/icons-material/Add';
import ImageUploader from '../../common/ImageUploader';
import { MyContext } from '../../App';
import { fileToBase64 } from '../../utils/fileReading';
@@ -234,7 +234,7 @@ export const AppsPrivate = ({ myName }) => {
}}
>
<AppCircle>
<Add>+</Add>
<AddIcon />
</AppCircle>
<AppCircleLabel>Private</AppCircleLabel>