wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-04 06:11:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

Styling fixes

Browse Source
This commit is contained in:
Chi Vinh Le
2018-07-20 12:24:03 -03:00
parent e33ea6d0aa
commit b2e2e3e75d
7 changed files with 37 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/stream/components/Comment/__snapshots__/TopBar.spec.tsx.snap
+1 -1
View File
@@ -2,7 +2,7 @@
exports[`renders correctly on big screens 1`] = `
<div
className="Flex-root TopBar-root Flex-itemGutter Flex-alignBaseline Flex-directionRow"
className="Flex-root TopBar-root Flex-itemGutter Flex-alignCenter Flex-directionRow"
>
<div>
Hello World
src/core/client/stream/components/PostCommentForm.tsx
+1 -1
View File
@@ -41,7 +41,7 @@ const PostCommentForm: StatelessComponent<PostCommentFormProps> = props => (
</Field>
<div className={styles.postButtonContainer}>
<Localized id="comments-postCommentForm-post">
<Button color="primary" disabled={submitting}>
<Button color="primary" variant="filled" disabled={submitting}>
Post
</Button>
</Localized>
src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap
+9 -9
View File
@@ -28,7 +28,7 @@ exports[`loads more comments 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -43,12 +43,12 @@ exports[`loads more comments 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`loads more comments 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -106,7 +106,7 @@ exports[`loads more comments 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -167,7 +167,7 @@ exports[`renders comment stream 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -182,12 +182,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -216,7 +216,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap
+5 -5
View File
@@ -28,7 +28,7 @@ exports[`renders comment stream 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -108,7 +108,7 @@ exports[`renders comment stream 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-replyList-log--comment-with-replies"
role="log"
>
src/core/client/stream/test/__snapshots__/renderStream.spec.tsx.snap
+4 -4
View File
@@ -28,7 +28,7 @@ exports[`renders comment stream 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap
+8 -8
View File
@@ -28,7 +28,7 @@ exports[`renders comment stream 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -79,7 +79,7 @@ exports[`renders comment stream 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-replyList-log--comment-0"
role="log"
>
@@ -159,7 +159,7 @@ exports[`show all replies 1`] = `
className="PostCommentForm-postButtonContainer"
>
<button
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantRegular"
className="BaseButton-root Button-root Button-sizeRegular Button-colorPrimary Button-variantFilled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -174,12 +174,12 @@ exports[`show all replies 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
>
<div
role="article"
@@ -210,7 +210,7 @@ exports[`show all replies 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-alignCenter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-directionColumn"
id="talk-comments-replyList-log--comment-0"
role="log"
>
src/core/client/ui/components/Flex/Flex.tsx
+9 -6
View File
@@ -46,6 +46,11 @@ const Flex: StatelessComponent<InnerProps> = props => {
...rest
} = props;
let alignItemsWithDefault = alignItems;
if (!direction || !direction.startsWith("column")) {
alignItemsWithDefault = "center";
}
const classObject: Record<string, boolean> = {
[classes.itemGutter]: itemGutter === true,
[classes.halfItemGutter]: itemGutter === "half",
@@ -59,8 +64,10 @@ const Flex: StatelessComponent<InnerProps> = props => {
] = true;
}
if (alignItems) {
classObject[(classes as any)[`align${pascalCase(alignItems)}`]] = true;
if (alignItemsWithDefault) {
classObject[
(classes as any)[`align${pascalCase(alignItemsWithDefault)}`]
] = true;
}
if (direction) {
@@ -72,10 +79,6 @@ const Flex: StatelessComponent<InnerProps> = props => {
return <div ref={forwardRef} className={classNames} {...rest} />;
};
Flex.defaultProps = {
alignItems: "center",
};
const enhanced = withForwardRef(withStyles(styles)(Flex));
export default enhanced;
export type FlexProps = PropTypesOf<typeof enhanced>;