diff --git a/components/tab/css/tab.css b/components/tab/css/tab.css index 29d068f..0398884 100644 --- a/components/tab/css/tab.css +++ b/components/tab/css/tab.css @@ -10,8 +10,8 @@ .pmd-tabs-scroll-container {display: block; width: 100%; height: 48px; position: relative; overflow: hidden;} .pmd-tabs-scroll-right {float: right; right:0; top:0;} .pmd-tabs-scroll-left {float: left; left:0;} -.pmd-tabs-scroll-right, .pmd-tabs-scroll-left{ position:absolute; z-index:99; text-align: center; cursor: pointer; display: none; white-space: no-wrap; vertical-align: middle; padding:12px 24px 8px 24px; background-color:#4285f4; color:#fff;} -.pmd-tabs .pmd-tab-active-bar { position: absolute; bottom: 0; width: 25%; height: 3px; background: #CC0; ransition: all .3s ease-in-out;} +.pmd-tabs-scroll-right, .pmd-tabs-scroll-left{ position:absolute; z-index:99; text-align: center; cursor: pointer; display: none; white-space: no-wrap; vertical-align: middle; padding:12px 24px 8px 24px; background-color:#4285f4; color:#fff;} +.pmd-tabs .pmd-tab-active-bar { position: absolute; bottom: 0; width: 25%; height: 3px; background: #CC0;} .pmd-tabs .nav-tabs.nav-justified > li > a { border:none; border-radius:0;} .pmd-tabs .nav-tabs.nav-justified > .active > a, .pmd-tabs .nav-tabs.nav-justified > .active > a:hover, @@ -30,7 +30,6 @@ .pmd-tabs .nav > li > a:hover, .pmd-tabs .nav > li > a:focus { background-color: transparent; border-color: transparent;} .pmd-tabs .nav > li > a { padding: 18px 24px 17px; font-size:14px;} -.pmd-tabs .nav > li > a:hover, .pmd-tabs .nav > li > a:focus{} .nav-tabs > li > a { opacity:0.54; color:#000; font-weight:500;} .pmd-tabs-bg{ background-color:#4285f4; color:#fff;} .pmd-tabs-bg li .dropdown-menu a {color:#333;} @@ -39,5 +38,4 @@ .pmd-tabs-bg .pmd-tabs-scroll-container{background-color:#4285f4; color:#fff;} @media (max-width: 767px) { .pmd-tabs{ overflow-x: auto; overflow-y: hidden;} -.pmd-tabs .nav-tabs.nav-justified{ width: auto !important;} } \ No newline at end of file diff --git a/components/tab/js/tab-scrollable.js b/components/tab/js/tab-scrollable.js index 48b1595..0bf62ca 100644 --- a/components/tab/js/tab-scrollable.js +++ b/components/tab/js/tab-scrollable.js @@ -21,9 +21,12 @@ }); return itemsWidth; }; - var appendulwidth = function(){ - $this.find('ul.nav-tabs').width(widthOfList()) + if($this.find('ul.nav-tabs').hasClass("nav-justified")){ + $this.find('ul.nav-tabs').width("100%") + }else { + $this.find('ul.nav-tabs').width(widthOfList()) + } }; var getLeftPosi = function(){