[BUGFIX] IE switching tabs with RTE ensure selectable fields
[Packages/TYPO3.CMS.git] / Build / Resources / Public / Less / TYPO3 / _element_tab.less
1 //
2 // Tab menu
3 //
4 .nav-tabs {
5         border-radius: @border-radius-base @border-radius-base 0 0;
6         background-color: darken(@nav-tabs-active-link-bg, 5%);
7         > li {
8                 + li {
9                         margin-left: 2px;
10                 }
11                 > a {
12                         margin-right: 0;
13                         .transition(all 0.25s ease-in-out);
14                         &:focus,
15                         &:hover {
16                                 border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color;
17                                 background: @nav-tabs-link-hover-bg;
18                         }
19                 }
20                 &[class*="has-"] > a {
21                         &:before {
22                                 font-family: FontAwesome;
23                                 margin-right: 2px;
24                                 margin-top: -2px;
25                                 vertical-align: middle;
26                                 font-size: 10px;
27                                 text-align: center;
28                                 background-color: rgba(255, 255, 255, 0.25);
29                                 border-radius: 50%;
30                                 width: 15px;
31                                 height: 15px;
32                                 display: inline-block;
33                                 .transition(all 0.25s ease-in-out);
34                         }
35                 }
36                 // Has error state
37                 &.has-validation-error {
38                         > a {
39                                 background-color: @brand-danger;
40                                 border-color: darken(@brand-danger, 10%);
41                                 color: #fff;
42                                 &:focus,
43                                 &:hover {
44                                         color: #fff;
45                                         background-color: lighten(@brand-danger, 5%);
46                                         border-color: darken(@brand-danger, 5%);
47                                 }
48                                 &:before {
49                                         content: @fa-var-exclamation;
50                                 }
51                         }
52                         &.active > a {
53                                 color: inherit;
54                                 background-color: @nav-tabs-active-link-bg;
55                                 &:before {
56                                         background-color: @brand-danger;
57                                         color: #ffffff;
58                                 }
59                         }
60                 }
61                 // Active state
62                 &.active {
63                         > a,
64                         > a:focus,
65                         > a:active,
66                         > a:hover {
67                                 border: 1px solid @nav-tabs-active-link-hover-border-color;
68                                 border-bottom-color: @nav-tabs-active-link-bg;
69                                 background-color: @nav-tabs-active-link-bg;
70                         }
71                 }
72
73         }
74 }
75
76
77 //
78 // Hotfix display tab-panes always to prevent RTE initialisation problems
79 //
80 .tab-content {
81         > .tab-pane {
82                 display: block;
83                 height: 0;
84                 width: 0;
85                 overflow: hidden;
86                 &.active {
87                         height: auto;
88                         width: auto;
89                         overflow: visible;
90                 }
91         }
92 }