mirror of
https://github.com/Qortal/Qortal-Hub.git
synced 2025-06-15 04:21:21 +00:00
Refactor style for background
This commit is contained in:
parent
89cc4981f8
commit
1abda4a278
@ -217,7 +217,6 @@ export const ChatList = ({
|
|||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
ref={parentRef}
|
ref={parentRef}
|
||||||
className="List"
|
|
||||||
style={{
|
style={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexGrow: 1,
|
flexGrow: 1,
|
||||||
@ -227,13 +226,13 @@ export const ChatList = ({
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
style={{
|
sx={{
|
||||||
height: rowVirtualizer.getTotalSize(),
|
height: rowVirtualizer.getTotalSize(),
|
||||||
width: '100%',
|
width: '100%',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
style={{
|
sx={{
|
||||||
left: 0,
|
left: 0,
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
top: 0,
|
top: 0,
|
||||||
@ -327,7 +326,7 @@ export const ChatList = ({
|
|||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
key={virtualRow.index}
|
key={virtualRow.index}
|
||||||
style={{
|
sx={{
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
@ -354,7 +353,7 @@ export const ChatList = ({
|
|||||||
data-index={virtualRow.index} //needed for dynamic row height measurement
|
data-index={virtualRow.index} //needed for dynamic row height measurement
|
||||||
ref={rowVirtualizer.measureElement} //measure dynamic row height
|
ref={rowVirtualizer.measureElement} //measure dynamic row height
|
||||||
key={message.signature}
|
key={message.signature}
|
||||||
style={{
|
sx={{
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
@ -405,7 +404,7 @@ export const ChatList = ({
|
|||||||
{showScrollButton && (
|
{showScrollButton && (
|
||||||
<Button
|
<Button
|
||||||
onClick={() => scrollToBottom()}
|
onClick={() => scrollToBottom()}
|
||||||
style={{
|
sx={{
|
||||||
backgroundColor: theme.palette.other.unread,
|
backgroundColor: theme.palette.other.unread,
|
||||||
border: 'none',
|
border: 'none',
|
||||||
borderRadius: '20px',
|
borderRadius: '20px',
|
||||||
@ -428,15 +427,15 @@ export const ChatList = ({
|
|||||||
{showScrollDownButton && !showScrollButton && (
|
{showScrollDownButton && !showScrollButton && (
|
||||||
<Button
|
<Button
|
||||||
onClick={() => scrollToBottom()}
|
onClick={() => scrollToBottom()}
|
||||||
style={{
|
sx={{
|
||||||
backgroundColor: theme.palette.background.paper,
|
backgroundColor: theme.palette.background.paper,
|
||||||
outline: `1px solid ${theme.palette.primary.light}`,
|
|
||||||
border: 'none',
|
border: 'none',
|
||||||
borderRadius: '20px',
|
borderRadius: '20px',
|
||||||
bottom: 20,
|
bottom: 20,
|
||||||
color: theme.palette.text.primary,
|
color: theme.palette.text.primary,
|
||||||
cursor: 'pointer',
|
cursor: 'pointer',
|
||||||
fontSize: '16px',
|
fontSize: '16px',
|
||||||
|
outline: `1px solid ${theme.palette.primary.light}`,
|
||||||
padding: '10px 20px',
|
padding: '10px 20px',
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
right: 20,
|
right: 20,
|
||||||
|
@ -786,6 +786,7 @@ const ShowMessage = ({ message, goToMessage, messages }) => {
|
|||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
|
background: theme.palette.background.surface,
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
justifyContent: 'space-between',
|
justifyContent: 'space-between',
|
||||||
width: '100%',
|
width: '100%',
|
||||||
|
@ -228,8 +228,8 @@ export const MessageItemComponent = ({
|
|||||||
isLast={isLast}
|
isLast={isLast}
|
||||||
onSeen={onSeenFunc}
|
onSeen={onSeenFunc}
|
||||||
>
|
>
|
||||||
<div
|
<Box
|
||||||
style={{
|
sx={{
|
||||||
backgroundColor: theme.palette.background.paper,
|
backgroundColor: theme.palette.background.paper,
|
||||||
borderRadius: '7px',
|
borderRadius: '7px',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
@ -664,7 +664,7 @@ export const MessageItemComponent = ({
|
|||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
</div>
|
</Box>
|
||||||
</MessageWragger>
|
</MessageWragger>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
@ -1635,7 +1635,7 @@ export const Group = ({
|
|||||||
<Box
|
<Box
|
||||||
style={{
|
style={{
|
||||||
alignItems: 'flex-start',
|
alignItems: 'flex-start',
|
||||||
background: theme.palette.background.paper,
|
background: theme.palette.background.surface,
|
||||||
borderRadius: '0px 15px 15px 0px',
|
borderRadius: '0px 15px 15px 0px',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
@ -1763,7 +1763,7 @@ export const Group = ({
|
|||||||
sx={{
|
sx={{
|
||||||
background:
|
background:
|
||||||
direct?.address === selectedDirect?.address &&
|
direct?.address === selectedDirect?.address &&
|
||||||
theme.palette.background.paper,
|
theme.palette.background.surface,
|
||||||
borderRadius: '2px',
|
borderRadius: '2px',
|
||||||
cursor: 'pointer',
|
cursor: 'pointer',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
@ -1782,7 +1782,7 @@ export const Group = ({
|
|||||||
<ListItemAvatar>
|
<ListItemAvatar>
|
||||||
<Avatar
|
<Avatar
|
||||||
sx={{
|
sx={{
|
||||||
background: theme.palette.background.paper,
|
background: theme.palette.background.surface,
|
||||||
color: theme.palette.text.primary,
|
color: theme.palette.text.primary,
|
||||||
}}
|
}}
|
||||||
alt={direct?.name || direct?.address}
|
alt={direct?.name || direct?.address}
|
||||||
@ -2008,7 +2008,7 @@ export const Group = ({
|
|||||||
<>
|
<>
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
background: theme.palette.background.paper,
|
background: theme.palette.background.surface,
|
||||||
bottom: !(desktopViewMode === 'chat') ? 'unset' : '0px',
|
bottom: !(desktopViewMode === 'chat') ? 'unset' : '0px',
|
||||||
left: !(desktopViewMode === 'chat') ? '-100000px' : '0px',
|
left: !(desktopViewMode === 'chat') ? '-100000px' : '0px',
|
||||||
opacity: !(desktopViewMode === 'chat') ? 0 : 1,
|
opacity: !(desktopViewMode === 'chat') ? 0 : 1,
|
||||||
|
@ -60,7 +60,7 @@ export const GroupList = ({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
style={{
|
sx={{
|
||||||
alignItems: 'flex-start',
|
alignItems: 'flex-start',
|
||||||
background: theme.palette.background.surface,
|
background: theme.palette.background.surface,
|
||||||
borderRadius: '0px 15px 15px 0px',
|
borderRadius: '0px 15px 15px 0px',
|
||||||
@ -146,7 +146,7 @@ export const GroupList = ({
|
|||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<Box
|
<Box
|
||||||
style={{
|
sx={{
|
||||||
alignItems: 'flex-start',
|
alignItems: 'flex-start',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
|
Loading…
x
Reference in New Issue
Block a user