Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 207 | espaco | 1 | body { |
| 2 | .ui-tabmenu { |
||
| 3 | padding: 0; |
||
| 4 | position: static; |
||
| 5 | |||
| 6 | .ui-tabmenu-nav { |
||
| 7 | margin: 0; |
||
| 8 | padding: 0; |
||
| 9 | background: $tabsNavBg; |
||
| 10 | @include flex(); |
||
| 11 | @include flex-wrap(wrap); |
||
| 12 | position: relative; |
||
| 13 | |||
| 14 | &:before { |
||
| 15 | position: absolute; |
||
| 16 | border-bottom: $tabsNavBorder; |
||
| 17 | left: 0; |
||
| 18 | bottom: 0; |
||
| 19 | width: 100%; |
||
| 20 | } |
||
| 21 | |||
| 22 | .ui-tabmenuitem { |
||
| 23 | list-style: none; |
||
| 24 | padding: 0; |
||
| 25 | white-space: nowrap; |
||
| 26 | display: inline-block; |
||
| 27 | vertical-align: top; |
||
| 28 | float: none; |
||
| 29 | background: $tabsHeaderBg; |
||
| 30 | color: $tabsHeaderTextColor; |
||
| 31 | top: 0; |
||
| 32 | margin: 0; |
||
| 33 | border-bottom: $tabsNavBorder; |
||
| 34 | cursor: pointer; |
||
| 35 | @include flex(); |
||
| 36 | @include flex-align-center(); |
||
| 37 | transition: $transition; |
||
| 38 | |||
| 39 | a { |
||
| 40 | color: $tabsHeaderTextColor; |
||
| 41 | padding: $tabsHeaderPadding; |
||
| 42 | font-weight: $tabsHeaderFontWeight; |
||
| 43 | display: block; |
||
| 44 | line-height: 1; |
||
| 45 | outline: 0 none; |
||
| 46 | |||
| 47 | .ui-icon { |
||
| 48 | margin-right: $inlineSpacing; |
||
| 49 | } |
||
| 50 | } |
||
| 51 | |||
| 52 | &.ui-state-hover { |
||
| 53 | background: $tabsHeaderHoverBg; |
||
| 54 | border-color: $tabsHeaderHoverBorderColor; |
||
| 55 | |||
| 56 | a { |
||
| 57 | color: $tabsHeaderTextHoverColor; |
||
| 58 | |||
| 59 | .ui-icon { |
||
| 60 | color: $tabsHeaderTextHoverColor; |
||
| 61 | } |
||
| 62 | } |
||
| 63 | } |
||
| 64 | |||
| 65 | &.ui-state-active { |
||
| 66 | background: $tabsHeaderActiveBg; |
||
| 67 | border-color: $tabsHeaderActiveBorderColor; |
||
| 68 | |||
| 69 | a { |
||
| 70 | color: $tabsHeaderTextActiveColor; |
||
| 71 | |||
| 72 | .ui-icon { |
||
| 73 | color: $tabsHeaderTextActiveColor; |
||
| 74 | } |
||
| 75 | } |
||
| 76 | } |
||
| 77 | |||
| 78 | &.ui-menuitem-outline { |
||
| 79 | @include focused(); |
||
| 80 | } |
||
| 81 | } |
||
| 82 | } |
||
| 83 | } |
||
| 84 | |||
| 85 | @media screen and (max-width: $phoneBreakpoint) { |
||
| 86 | .ui-tabmenu { |
||
| 87 | .ui-tabmenu-nav { |
||
| 88 | .ui-tabmenuitem a { |
||
| 89 | .ui-menuitem-icon { |
||
| 90 | margin-right: 0; |
||
| 91 | } |
||
| 92 | |||
| 93 | .ui-menuitem-text { |
||
| 94 | display: none; |
||
| 95 | } |
||
| 96 | } |
||
| 97 | } |
||
| 98 | } |
||
| 99 | } |
||
| 100 | } |