@selfcommunity/react-theme-default 0.1.0-alpha.30 → 0.1.0-alpha.301

package/lib/cjs/components/SCCommentObject.js

@@ -4,51 +4,147 @@ const system_1 = require("@mui/system");
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
+            overflow: 'visible',
+            width: '100%',
+            '& .SCCommentObject-comment': {
+                paddingBottom: 0,
+                overflow: 'visible',
+                '& > div': {
+                    alignItems: 'flex-start'
+                },
+                '& .SCBaseItem-image .MuiBadge-badge': {
+                    top: theme.spacing(1.5)
+                },
+                '& .SCBaseItem-text': {
+                    marginBottom: 0,
+                    marginTop: theme.spacing(0.2)
+                }
+            },
+            '& .SCCommentObject-nested-comments': {
+                paddingTop: 0,
+                paddingBottom: 0,
+                paddingLeft: theme.spacing(2),
+                '& ul.MuiList-root': {
+                    paddingTop: 0,
+                    paddingBottom: 0,
+                    width: '100%',
+                    '& li.MuiListItem-root': {
+                        paddingTop: 5
+                    }
+                },
+                '& .SCCommentObjectReply-root .SCEditor-root': {
+                    padding: '6px'
+                },
+                [theme.breakpoints.up('sm')]: {
+                    paddingLeft: theme.spacing(6)
+                }
+            },
             '& .SCCommentObject-content': {
-                padding: theme.spacing(),
+                overflowWrap: 'anywhere',
+                position: 'relative',
+                display: 'flex',
+                padding: `6px`,
                 borderRadius: theme.shape.borderRadius * 0.5,
                 borderColor: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity),
+                '& .MuiCardContent-root': {
+                    flexGrow: 1,
+                    padding: 0,
+                    '& > p:first-of-type': {
+                        paddingTop: 4
+                    }
+                },
                 '& .SCCommentObject-text-content': {
                     margin: 0,
+                    '& a': {
+                        color: theme.palette.text.secondary,
+                        textDecoration: 'underlined',
+                        '&:hover': {
+                            textDecoration: 'none'
+                        }
+                    },
                     '& p': {
-                        margin: 0
+                        margin: 0,
+                        marginBlockStart: '0.3em',
+                        marginBlockEnd: '0.3em'
+                    },
+                    '& img': {
+                        maxWidth: '100%'
                     }
                 }
             },
-            '& .SCCommentObject-comment-sub-section': {
+            '& .SCCommentObject-show-more-content': {
                 color: theme.palette.text.secondary,
-                marginTop: theme.spacing(1),
+                textDecoration: 'underlined',
+                '&:hover': {
+                    textDecoration: 'none'
+                }
+            },
+            '& .SCCommentObject-avatar, & .SCCommentObjectReply-avatar': {
+                top: theme.spacing(),
+                width: theme.selfcommunity.user.avatar.sizeMedium,
+                height: theme.selfcommunity.user.avatar.sizeMedium
+            },
+            '& .SCCommentObject-author': {
+                textDecoration: 'none',
+                color: theme.palette.text.primary,
+                '& span': {
+                    fontWeight: '600'
+                }
+            },
+            '& .SCCommentObject-comment-actions-menu': {
+                alignItems: 'flexStart'
+            },
+            '& .SCCommentObject-deleted': {
+                opacity: 0.3
+            },
+            '& .SCCommentObject-content-sub-section': {
+                display: 'flex',
+                justifyContent: 'flex-start',
+                alignItems: 'center',
+                color: theme.palette.text.secondary
+            },
+            '& .SCCommentObject-comment-sub-section': {
+                display: 'flex',
+                flexWrap: 'wrap',
+                alignItems: 'center',
+                color: theme.palette.primary.main,
+                marginTop: 0,
+                position: 'relative',
+                '& > *': {
+                    marginRight: theme.spacing(1)
+                },
                 '& .SCCommentObject-activity-at': {
+                    color: 'inherit',
+                    textDecoration: 'none',
                     '&:hover': {
-                        color: 'inherit',
                         textDecoration: 'underline'
                     }
                 },
-                '& .SCCommentObject-vote': {
-                    padding: theme.spacing(1),
-                    fontSize: '1.571rem'
-                },
-                '& .SCCommentObject-add-reaction': {
-                    '& > span': {
-                        '& img': {
-                            width: '1rem',
-                            height: '1rem'
-                        }
-                    }
-                },
                 '& .SCCommentObject-reply': {
+                    color: 'inherit',
                     textDecorationStyle: 'solid',
                     fontSize: '0.857rem',
-                    padding: theme.spacing(1)
-                },
-                '& .SCCommentObjectVotes-root .SCCommentObjectVotes-btnViewVotes': {
                     padding: theme.spacing(1),
-                    marginTop: theme.spacing(-2.5),
-                    fontSize: '1.571rem'
+                    textTransform: 'capitalize'
+                },
+                '& .SCBullet-root': {
+                    display: 'none'
+                },
+                [theme.breakpoints.up('sm')]: {
+                    '& > *': {
+                        marginRight: 0
+                    },
+                    '& .SCCommentObject-vote-audience': {
+                        position: 'absolute',
+                        right: 0,
+                        top: 0
+                    },
+                    '& .SCBullet-root': {
+                        display: 'inline'
+                    }
                 }
             }
         })
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCCommentObject.js.map

package/lib/cjs/components/SCCommentObjectReply.d.ts

@@ -0,0 +1,38 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            border: string;
+            marginBottom: any;
+            overflow: string;
+            '& .SCBaseItem-content': {
+                alignItems: string;
+                '& .SCBaseItem-text': {
+                    marginTop: number;
+                    marginBottom: number;
+                    '& .SCBaseItem-secondary': {
+                        overflow: string;
+                    };
+                };
+                '& .SCBaseItem-image': {
+                    marginTop: any;
+                    '& .MuiBadge-badge': {
+                        top: any;
+                    };
+                    '& .SCCommentObjectReply-avatar': {
+                        width: any;
+                        height: any;
+                    };
+                };
+            };
+            '& .SCCommentObjectReply-comment': {
+                overflow: string;
+                borderRadius: number;
+            };
+            '& .SCCommentObjectReply-actions': {
+                marginLeft: any;
+                paddingBottom: any;
+            };
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCCommentObjectReply.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            border: '0 none',
+            marginBottom: theme.spacing(1),
+            overflow: 'visible',
+            '& .SCBaseItem-content': {
+                alignItems: 'flex-start',
+                '& .SCBaseItem-text': {
+                    marginTop: 0,
+                    marginBottom: 0,
+                    '& .SCBaseItem-secondary': {
+                        overflow: 'visible'
+                    }
+                },
+                '& .SCBaseItem-image': {
+                    marginTop: theme.spacing(0.2),
+                    '& .MuiBadge-badge': {
+                        top: theme.spacing(1.25)
+                    },
+                    '& .SCCommentObjectReply-avatar': {
+                        width: theme.selfcommunity.user.avatar.sizeMedium,
+                        height: theme.selfcommunity.user.avatar.sizeMedium
+                    }
+                }
+            },
+            '& .SCCommentObjectReply-comment': {
+                overflow: 'visible',
+                borderRadius: theme.shape.borderRadius * 0.5
+            },
+            '& .SCCommentObjectReply-actions': {
+                marginLeft: theme.spacing(),
+                paddingBottom: theme.spacing()
+            }
+        })
+    }
+};
+exports.default = Component;

package/lib/cjs/components/SCCommentObjectSkeleton.d.ts

@@ -1,15 +1,19 @@
 declare const Component: {
     styleOverrides: {
         root: ({ theme }: any) => {
-            '& .SCWidget-root': {
-                borderRadius: number;
-                borderColor: string;
-                '& .MuiCardContent-root': {
-                    padding: any;
+            '&.SCWidget-root': {
+                '& .SCBaseItem-text': {
+                    marginBottom: number;
+                    '& > .SCWidget-root': {
+                        borderRadius: number;
+                        borderColor: string;
+                    };
+                    '& .MuiCardContent-root': {
+                        padding: any;
+                    };
                 };
             };
         };
     };
 };
 export default Component;
-//# sourceMappingURL=SCCommentObjectSkeleton.d.ts.map

package/lib/cjs/components/SCCommentObjectSkeleton.js

@@ -4,15 +4,19 @@ const system_1 = require("@mui/system");
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
-            '& .SCWidget-root': {
-                borderRadius: theme.shape.borderRadius * 0.5,
-                borderColor: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity),
-                '& .MuiCardContent-root': {
-                    padding: theme.spacing(2)
+            '&.SCWidget-root': {
+                '& .SCBaseItem-text': {
+                    marginBottom: 0,
+                    '& > .SCWidget-root': {
+                        borderRadius: theme.shape.borderRadius * 0.5,
+                        borderColor: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)
+                    },
+                    '& .MuiCardContent-root': {
+                        padding: theme.spacing(1)
+                    }
                 }
             }
         })
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCCommentObjectSkeleton.js.map

package/lib/cjs/components/SCCommentObjectVotes.d.ts

@@ -0,0 +1,16 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            flexGrow: number;
+            display: string;
+            flexDirection: string;
+            '& .SCCommentObjectVotes-btnViewVotes': {
+                minWidth: number;
+                '& .MuiIcon-root': {
+                    fontSize: string;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCCommentObjectVotes.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            flexGrow: 1,
+            display: 'flex',
+            flexDirection: 'row-reverse',
+            '& .SCCommentObjectVotes-btnViewVotes': {
+                minWidth: 0,
+                '& .MuiIcon-root': {
+                    fontSize: '1.57rem'
+                }
+            }
+        })
+    }
+};
+exports.default = Component;

package/lib/cjs/components/SCCommentsFeedObject.d.ts

@@ -1,6 +1,14 @@
 declare const Component: {
     styleOverrides: {
         root: ({ theme }: any) => {
+            width: string;
+            '& .SCCommentsFeedObject-no-comments': {
+                padding: any;
+                paddingLeft: number;
+            };
+            '& .SCCommentsFeedObject-comment-not-found': {
+                padding: any;
+            };
             '& .SCCommentObject-root': {
                 '& > div': {
                     background: string;
@@ -22,8 +30,9 @@ declare const Component: {
             '& .SCCommentsObjectSkeleton-root': {
                 marginBottom: any;
             };
-            '& .SCReplyCommentObject-root': {
-                '& .SCReplyCommentObject-comment': {
+            '& .SCCommentObjectReply-root': {
+                background: string;
+                '& .SCCommentObjectReply-comment': {
                     marginBottom: any;
                 };
             };
@@ -31,4 +40,3 @@ declare const Component: {
     };
 };
 export default Component;
-//# sourceMappingURL=SCCommentsFeedObject.d.ts.map

package/lib/cjs/components/SCCommentsFeedObject.js

@@ -3,6 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
+            width: '100%',
+            '& .SCCommentsFeedObject-no-comments': {
+                padding: theme.spacing(),
+                paddingLeft: 0
+            },
+            '& .SCCommentsFeedObject-comment-not-found': {
+                padding: theme.spacing()
+            },
             '& .SCCommentObject-root': {
                 '& > div': {
                     background: 'transparent'
@@ -24,8 +32,9 @@ const Component = {
             '& .SCCommentsObjectSkeleton-root': {
                 marginBottom: theme.spacing(0.5)
             },
-            '& .SCReplyCommentObject-root': {
-                '& .SCReplyCommentObject-comment': {
+            '& .SCCommentObjectReply-root': {
+                background: 'transparent',
+                '& .SCCommentObjectReply-comment': {
                     marginBottom: theme.spacing(4)
                 }
             }
@@ -33,4 +42,3 @@ const Component = {
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCCommentsFeedObject.js.map

package/lib/cjs/components/SCCommentsObject.d.ts

@@ -1,8 +1,28 @@
 declare const Component: {
     styleOverrides: {
         root: ({ theme }: any) => {
+            boxShadow: string;
+            position: string;
+            display: string;
+            flexWrap: string;
+            width: string;
+            paddingBottom: any;
+            '& .SCCommentsObject-load-more-comments-button': {
+                textTransform: string;
+                padding: any;
+            };
+            '& .SCCommentsObject-load-previous-comments-button': {
+                textTransform: string;
+                padding: any;
+            };
+            '& .SCCommentsObject-comments-counter': {
+                paddingRight: any;
+            };
+            '& .SCCommentsObject-pagination-link': {
+                display: string;
+            };
             '& .SCCommentsObject-pagination': {
-                paddingBottom: any;
+                width: string;
                 '& button': {
                     fontWeight: any;
                     textDecoration: string;
@@ -17,4 +37,3 @@ declare const Component: {
     };
 };
 export default Component;
-//# sourceMappingURL=SCCommentsObject.d.ts.map

package/lib/cjs/components/SCCommentsObject.js

@@ -3,8 +3,28 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
+            boxShadow: 'none',
+            position: 'relative',
+            display: 'flex',
+            flexWrap: 'wrap',
+            width: '100%',
+            paddingBottom: theme.spacing(),
+            '& .SCCommentsObject-load-more-comments-button': {
+                textTransform: 'initial',
+                padding: theme.spacing()
+            },
+            '& .SCCommentsObject-load-previous-comments-button': {
+                textTransform: 'initial',
+                padding: theme.spacing()
+            },
+            '& .SCCommentsObject-comments-counter': {
+                paddingRight: theme.spacing()
+            },
+            '& .SCCommentsObject-pagination-link': {
+                display: 'none'
+            },
             '& .SCCommentsObject-pagination': {
-                paddingBottom: theme.spacing(1),
+                width: '100%',
                 '& button': {
                     fontWeight: theme.typography.fontWeightLight,
                     textDecoration: 'underline',
@@ -19,4 +39,3 @@ const Component = {
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCCommentsObject.js.map