fix: tabs typo and add variant classname (#117)

* feat(tabs): status style use css instead of js * feat(pagination): add custom classname * feat: merge conflict * fix: fix tabs typo and add variant classname Co-authored-by: Angelia <angelia@Angelia-MBP.lan> Co-authored-by: Angelia <angelia@Angelia-MacBook-Pro.local>
Conflux-Chain · Oct 16, 2020 · ffe59d7 · ffe59d7
1 parent 38167e8
commit ffe59d7
Show file tree

Hide file tree

Showing 20 changed files with 88 additions and 88 deletions.
diff --git a/components/card/__tests__/__snapshots__/footer.test.tsx.snap b/components/card/__tests__/__snapshots__/footer.test.tsx.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Card Footer should render correctly 1`] = `
-"<div class=\\"card \\"><div class=\\"content \\"><p>card</p><style>
+"<div class=\\"card  solid\\"><div class=\\"content \\"><p>card</p><style>
         .content {
           width: 100%;
           padding: 1.1429rem 1.1429rem;

diff --git a/components/card/__tests__/__snapshots__/index.test.tsx.snap b/components/card/__tests__/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`Card should render correctly when nested 1`] = `
 initialize {
   "0": Object {
     "attribs": Object {
-      "class": "card ",
+      "class": "card  solid",
     },
     "children": Array [
       Object {
@@ -14,7 +14,7 @@ initialize {
         "children": Array [
           Object {
             "attribs": Object {
-              "class": "card ",
+              "class": "card  solid",
             },
             "children": Array [
               Object {
@@ -24,7 +24,7 @@ initialize {
                 "children": Array [
                   Object {
                     "attribs": Object {
-                      "class": "card ",
+                      "class": "card  solid",
                     },
                     "children": Array [
                       Object {
@@ -375,7 +375,7 @@ initialize {
                     "parent": [Circular],
                     "prev": Object {
                       "attribs": Object {
-                        "class": "card ",
+                        "class": "card  solid",
                       },
                       "children": Array [
                         Object {
@@ -763,7 +763,7 @@ initialize {
                   "children": Array [
                     Object {
                       "attribs": Object {
-                        "class": "card ",
+                        "class": "card  solid",
                       },
                       "children": Array [
                         Object {
@@ -1114,7 +1114,7 @@ initialize {
                       "parent": [Circular],
                       "prev": Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -1501,7 +1501,7 @@ initialize {
             "parent": [Circular],
             "prev": Object {
               "attribs": Object {
-                "class": "card ",
+                "class": "card  solid",
               },
               "children": Array [
                 Object {
@@ -1511,7 +1511,7 @@ initialize {
                   "children": Array [
                     Object {
                       "attribs": Object {
-                        "class": "card ",
+                        "class": "card  solid",
                       },
                       "children": Array [
                         Object {
@@ -1862,7 +1862,7 @@ initialize {
                       "parent": [Circular],
                       "prev": Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -2250,7 +2250,7 @@ initialize {
                     "children": Array [
                       Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -2601,7 +2601,7 @@ initialize {
                         "parent": [Circular],
                         "prev": Object {
                           "attribs": Object {
-                            "class": "card ",
+                            "class": "card  solid",
                           },
                           "children": Array [
                             Object {
@@ -3025,7 +3025,7 @@ initialize {
           "children": Array [
             Object {
               "attribs": Object {
-                "class": "card ",
+                "class": "card  solid",
               },
               "children": Array [
                 Object {
@@ -3035,7 +3035,7 @@ initialize {
                   "children": Array [
                     Object {
                       "attribs": Object {
-                        "class": "card ",
+                        "class": "card  solid",
                       },
                       "children": Array [
                         Object {
@@ -3386,7 +3386,7 @@ initialize {
                       "parent": [Circular],
                       "prev": Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -3774,7 +3774,7 @@ initialize {
                     "children": Array [
                       Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -4125,7 +4125,7 @@ initialize {
                         "parent": [Circular],
                         "prev": Object {
                           "attribs": Object {
-                            "class": "card ",
+                            "class": "card  solid",
                           },
                           "children": Array [
                             Object {
@@ -4512,7 +4512,7 @@ initialize {
               "parent": [Circular],
               "prev": Object {
                 "attribs": Object {
-                  "class": "card ",
+                  "class": "card  solid",
                 },
                 "children": Array [
                   Object {
@@ -4522,7 +4522,7 @@ initialize {
                     "children": Array [
                       Object {
                         "attribs": Object {
-                          "class": "card ",
+                          "class": "card  solid",
                         },
                         "children": Array [
                           Object {
@@ -4873,7 +4873,7 @@ initialize {
                         "parent": [Circular],
                         "prev": Object {
                           "attribs": Object {
-                            "class": "card ",
+                            "class": "card  solid",
                           },
                           "children": Array [
                             Object {
@@ -5261,7 +5261,7 @@ initialize {
                       "children": Array [
                         Object {
                           "attribs": Object {
-                            "class": "card ",
+                            "class": "card  solid",
                           },
                           "children": Array [
                             Object {
@@ -5612,7 +5612,7 @@ initialize {
                           "parent": [Circular],
                           "prev": Object {
                             "attribs": Object {
-                              "class": "card ",
+                              "class": "card  solid",
                             },
                             "children": Array [
                               Object {
@@ -6005,7 +6005,7 @@ initialize {
     "children": Array [
       Object {
         "attribs": Object {
-          "class": "card ",
+          "class": "card  solid",
         },
         "children": Array [
           Object {
@@ -6285,7 +6285,7 @@ initialize {
         "namespace": "http://www.w3.org/1999/xhtml",
         "next": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  line",
           },
           "children": Array [
             Object {
@@ -6565,7 +6565,7 @@ initialize {
           "namespace": "http://www.w3.org/1999/xhtml",
           "next": Object {
             "attribs": Object {
-              "class": "card ",
+              "class": "card  solid",
             },
             "children": Array [
               Object {
@@ -6845,7 +6845,7 @@ initialize {
             "namespace": "http://www.w3.org/1999/xhtml",
             "next": Object {
               "attribs": Object {
-                "class": "card ",
+                "class": "card  solid",
               },
               "children": Array [
                 Object {
@@ -7166,7 +7166,7 @@ initialize {
       },
       Object {
         "attribs": Object {
-          "class": "card ",
+          "class": "card  line",
         },
         "children": Array [
           Object {
@@ -7446,7 +7446,7 @@ initialize {
         "namespace": "http://www.w3.org/1999/xhtml",
         "next": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  solid",
           },
           "children": Array [
             Object {
@@ -7726,7 +7726,7 @@ initialize {
           "namespace": "http://www.w3.org/1999/xhtml",
           "next": Object {
             "attribs": Object {
-              "class": "card ",
+              "class": "card  solid",
             },
             "children": Array [
               Object {
@@ -8028,7 +8028,7 @@ initialize {
         "parent": [Circular],
         "prev": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  solid",
           },
           "children": Array [
             Object {
@@ -8327,7 +8327,7 @@ initialize {
       },
       Object {
         "attribs": Object {
-          "class": "card ",
+          "class": "card  solid",
         },
         "children": Array [
           Object {
@@ -8607,7 +8607,7 @@ initialize {
         "namespace": "http://www.w3.org/1999/xhtml",
         "next": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  solid",
           },
           "children": Array [
             Object {
@@ -8899,7 +8899,7 @@ initialize {
         "parent": [Circular],
         "prev": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  line",
           },
           "children": Array [
             Object {
@@ -9181,7 +9181,7 @@ initialize {
           "parent": [Circular],
           "prev": Object {
             "attribs": Object {
-              "class": "card ",
+              "class": "card  solid",
             },
             "children": Array [
               Object {
@@ -9488,7 +9488,7 @@ initialize {
       },
       Object {
         "attribs": Object {
-          "class": "card ",
+          "class": "card  solid",
         },
         "children": Array [
           Object {
@@ -9770,7 +9770,7 @@ initialize {
         "parent": [Circular],
         "prev": Object {
           "attribs": Object {
-            "class": "card ",
+            "class": "card  solid",
           },
           "children": Array [
             Object {
@@ -10052,7 +10052,7 @@ initialize {
           "parent": [Circular],
           "prev": Object {
             "attribs": Object {
-              "class": "card ",
+              "class": "card  line",
             },
             "children": Array [
               Object {
@@ -10334,7 +10334,7 @@ initialize {
             "parent": [Circular],
             "prev": Object {
               "attribs": Object {
-                "class": "card ",
+                "class": "card  solid",
               },
               "children": Array [
                 Object {

diff --git a/components/card/card.tsx b/components/card/card.tsx
@@ -56,7 +56,7 @@ const Card: React.FC<React.PropsWithChildren<CardProps>> = ({
   const hasContent = hasChild(withoutImageChildren, CardContent)
 
   return (
-    <div className={`card ${className}`} {...props}>
+    <div className={`card ${className} ${variant || 'solid'}`} {...props}>
       {imageChildren}
       {hasContent ? withoutImageChildren : <CardContent>{withoutImageChildren}</CardContent>}
       {footerChildren}

diff --git a/components/modal/__tests__/__snapshots__/index.test.tsx.snap b/components/modal/__tests__/__snapshots__/index.test.tsx.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Modal customization should be supported 1`] = `
-"<div class=\\"wrapper test-class  wrapper-enter\\"><h2 class=\\"\\">Modal</h2><style>
+"<div class=\\"wrapper modal test-class  wrapper-enter\\"><h2 class=\\"\\">Modal</h2><style>
         h2 {
           font-size: 1.2857rem;
           line-height: 1.7857rem;
@@ -61,7 +61,7 @@ exports[`Modal customization should be supported 1`] = `
 `;
 
 exports[`Modal should render correctly 1`] = `
-"<div class=\\"backdrop  transition-enter\\"><div class=\\"layer\\"></div><div class=\\"content\\"><div class=\\"wrapper   wrapper-enter\\"><h2 class=\\"\\">Modal</h2><style>
+"<div class=\\"backdrop  transition-enter\\"><div class=\\"layer\\"></div><div class=\\"content\\"><div class=\\"wrapper modal   wrapper-enter\\"><h2 class=\\"\\">Modal</h2><style>
         h2 {
           font-size: 1.2857rem;
           line-height: 1.7857rem;

diff --git a/components/modal/modal.tsx b/components/modal/modal.tsx
@@ -108,7 +108,7 @@ const Modal = forwardRef<ModalHandles, ModalProps>(
     return createPortal(
       <ModalContext.Provider value={modalConfig}>
         <Backdrop onClick={closeFromBackdrop} visible={visible}>
-          <ModalWrapper visible={visible} className={wrapClassName} width={wrapperWidth}>
+          <ModalWrapper visible={visible} className={`modal ${wrapClassName}`} width={wrapperWidth}>
             {closable && (
               <ModalIcon size={16} color={theme.palette.cNeutral5} onClick={closeModal} />
             )}