less/patternfly/tabs.less

   1 //
   2 // Tabs
   3 // --------------------------------------------------
   4
   5 .nav-tabs {
   6   font-size: @font-size-large;
   7   > li {
   8     > a {
   9       color: @nav-tabs-color;
  10       margin-right: -1px;
  11       padding-bottom: 5px;
  12       padding-top: 5px;
  13       &:active,
  14       &:focus,
  15       &:hover {
  16         background: transparent;
  17         border-color: @nav-tabs-border-color;
  18         color: @gray-darker;
  19       }
  20     }
  21     > .dropdown-menu {
  22       border-top: 0;
  23       border-color: @nav-tabs-border-color;
  24       &.pull-right {
  25         right: -1px;
  26       }
  27     }
  28   }
  29   + .nav-tabs-pf {
  30     font-size: @font-size-base;
  31     > li:first-child > a {
  32       padding-left: 15px;
  33       &:before {
  34         left: 15px !important;
  35       }
  36     }
  37   }
  38   .open > a {
  39     &,
  40     &:hover,
  41     &:focus {
  42       background-color: transparent;
  43       border-color: @nav-tabs-border-color;
  44     }
  45   }
  46 }
  47
  48 .nav-tabs-pf {
  49   &.nav-justified {
  50     @media (min-width: @grid-float-breakpoint) {
  51       border-bottom: 1px solid @nav-tabs-justified-link-border-color;
  52     }
  53     > li {
  54       &:first-child > a {
  55         padding-left: 15px;
  56       }
  57       > a {
  58         border-bottom: 0;
  59         &:before {
  60           left: 0 !important;
  61           right: 0 !important;
  62         }
  63       }
  64     }
  65   }
  66   > li {
  67     margin-bottom: 0;
  68     &.active > a {
  69       .tab-indicator(@background: @nav-tabs-active-link-hover-color);
  70       &,
  71       &:active,
  72       &:focus,
  73       &:hover {
  74         background-color: transparent;
  75         border: 0 !important;
  76         color: @link-color;
  77         &:before {
  78           background: @nav-tabs-active-link-hover-color;
  79         }
  80       }
  81     }
  82     &:first-child {
  83       > a {
  84         padding-left: 0;
  85         &:before {
  86           left: 0 !important;
  87         }
  88       }
  89     }
  90     > a {
  91       border: 0;
  92       line-height: 1;
  93       margin-right: 0;
  94       padding-bottom: 10px;
  95       padding-top: 10px;
  96       &:active,
  97       &:focus,
  98       &:hover {
  99         .tab-indicator()
 100       }
 101     }
 102     > .dropdown-menu {
 103       left: 15px;
 104       margin-top: 1px;
 105       &.pull-right {
 106         left: auto;
 107         right: 15px;
 108       }
 109     }
 110   }
 111   .open > a {
 112     &,
 113     &:hover,
 114     &:focus {
 115       background-color: transparent;
 116     }
 117   }
 118 }