[BUGFIX] Re-add .panel-collapsed for caret handling
[Packages/TYPO3.CMS.git] / Build / Resources / Public / Sass / typo3 / _element_panel.scss
1 //
2 // Variables
3 //
4 $panel-lg-padding: 35px;
5
6 //
7 // Panel
8 //
9 .panel {
10 @include box-shadow(0 2px 0 rgba(0, 0, 0, 0.1));
11
12 &.ui-sortable-helper {
13 border-style: dashed;
14 }
15
16 .panel-heading {
17 font-weight: bold;
18 }
19 }
20
21 //
22 // Panel carousel
23 //
24 .panel-carousel {
25 padding: $panel-body-padding;
26 }
27
28 //
29 // Panel heading
30 //
31 .panel-heading {
32 position: relative;
33
34 &[data-toggle="formengine-flex"],
35 &[data-toggle="formengine-inline"] {
36 cursor: pointer;
37 }
38 }
39
40 //
41 // Panel condensed
42 //
43 .panel-condensed {
44 .panel-heading {
45 padding: 5px;
46 }
47 }
48
49 //
50 // Panel collapse
51 //
52 .panel-heading-collapse-indicator {
53 position: absolute;
54 left: 2px;
55 margin-top: -2px;
56 top: 50%;
57 }
58
59 .panel-collapsed {
60 .panel-collapse {
61 display: none;
62 visibility: hidden;
63 }
64 }
65
66 .panel-collapsed {
67 .caret {
68 @include transition(all 0.25s ease-in-out);
69 @include rotate(-90deg);
70 }
71 }
72
73 .panel,
74 .panel-collapse {
75 .panel-heading {
76 .caret {
77 @include transition(all 0.25s ease-in-out);
78 }
79
80 .collapsed {
81 .caret {
82 @include rotate(-90deg);
83 }
84 }
85 }
86
87 > .alert {
88 border: none;
89 border-top: 1px solid $panel-default-border;
90 margin: 0;
91 padding: 9px 12px;
92 }
93
94 > .form-section,
95 > .tab-content > .form-section,
96 > .tab-content > .tab-pane > .form-section {
97 border-left: 0;
98 border-right: 0;
99 border-bottom: 0;
100 }
101
102 > .nav-tabs {
103 border-top: 1px solid $panel-default-border;
104 padding-top: 8px;
105
106 > li {
107 margin-left: -1px;
108 }
109 }
110
111 > .table,
112 > .table-fit {
113 border: 0;
114 margin: 0;
115 }
116 }
117
118 .recordlist {
119 .table-fit {
120 margin-bottom: 0;
121 }
122 }
123
124 //
125 // Panel hover
126 //
127 .panel-hover {
128 .panel-default:hover > .panel-heading {
129 background-color: lighten($panel-default-heading-bg, 3%);
130 }
131 }
132
133 //
134 // Panel space
135 //
136 .panel-space {
137 margin: 3em 0;
138 }
139
140 //
141 // Panel Tab
142 //
143 .panel-tab {
144 border-radius: 0;
145 border: 1px solid $nav-tabs-active-link-hover-border-color;
146 background-color: $nav-tabs-active-link-bg;
147 }
148
149 .panel-tab + .panel-tab,
150 .panel-tab + .form-section {
151 margin-top: -($line-height-computed+1);
152 }
153
154 .tab-pane {
155 > .panel-tab:first-child {
156 border-top: none;
157 }
158 }
159
160 //
161 // Panel large
162 //
163 .panel-lg {
164 .panel-body {
165 padding: $panel-lg-padding;
166 }
167
168 .panel-heading,
169 .panel-footer {
170 padding: ceil($panel-lg-padding * 0.5) $panel-lg-padding;
171 }
172
173 .panel-carousel {
174 padding: $panel-lg-padding;
175 }
176 }