Merge pull request #6 from trendmicro-frontend/fix/css-inactive

Add inactive class name
trendmicro-frontend · Aug 21, 2018 · 7f08ade · 7f08ade
2 parents 93a1e6e + a340c57
commit 7f08ade
Show file tree

Hide file tree

Showing 8 changed files with 34 additions and 25 deletions.
diff --git a/dist/react-navs.css b/dist/react-navs.css
diff --git a/dist/react-navs.min.css b/dist/react-navs.min.css
diff --git a/docs/bundle.js b/docs/bundle.js
diff --git a/docs/bundle.js.map b/docs/bundle.js.map
diff --git a/docs/index.html b/docs/index.html
@@ -11,5 +11,5 @@
 </head>
 <body>
 <div id="container"></div>
-<script type="text/javascript" src="bundle.js?5363679f0ad15f7adad7"></script></body>
+<script type="text/javascript" src="bundle.js?79b91fb4ea71e61eb240"></script></body>
 </html>
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@trendmicro/react-navs",
-  "version": "0.11.5",
+  "version": "0.11.6",
   "description": "Trend Micro Components: React Navs",
   "main": "lib/index.js",
   "files": [

diff --git a/src/TabPane.jsx b/src/TabPane.jsx
@@ -11,7 +11,8 @@ const TabPane = ({ active, lazy, eventKey, className, ...props }) => {
         <div
             {...props}
             className={cx(className, styles.tabPane, {
-                [styles.active]: active
+                [styles.active]: active,
+                [styles.inactive]: !active
             })}
         />
     );

diff --git a/src/tab.styl b/src/tab.styl
@@ -1,15 +1,19 @@
 .tab-content > .tab-pane {
-	display: block;
-    opacity: 0;
-    height: 0;
-    padding: 0;
-    margin: 0;
-    pointer-events: none;
-    overflow: hidden;
+	display: none;
 }
 
 .tab-content > .active {
     display: block;
     opacity: 1;
     height: inherit;
-}
+}
+
+.tab-content > .inactive {
+	display: block
+    opacity: 0
+    height: 0
+    padding: 0
+    margin: 0
+    pointer-events: none
+    overflow: hidden
+}