73ea2a5861e1fdca470828da4d8382957c2373f4
[Packages/TYPO3.CMS.git] / Build / Resources / Public / Less / TYPO3 / _module_extensionmanager.less
1 //
2 // Extensionmanager
3 //
4
5 // Extension list
6 .typo3-extensionmanager-headerRowLeft {
7 float: left;
8 }
9 .typo3-extensionmanager-headerRowRight {
10 float: right;
11 }
12 .ui-toolbar {
13 margin-bottom: 5px;
14 .dataTables_filter {
15 float: left;
16 }
17 }
18
19 // Paginator
20 .dataTables_info {
21 display: none;
22 }
23 .dataTables_paginate {
24 float: left;
25 margin: 10px 0 0;
26 }
27
28 // Upload form
29 .uploadForm {
30 background-color: #ededed;
31 border-top: 1px solid #cdcdcd;
32 border-bottom: 1px solid #cdcdcd;
33 padding: 12px;
34 margin-bottom: 24px;
35 form {
36 .control-group {
37 clear: both;
38 margin-bottom: 5px;
39 }
40 label {
41 float: left;
42 height: 20px;
43 padding: 4px 0;
44 line-height: 20px;
45 width: 90px;
46 }
47 .control {
48 min-height: 20px;
49 padding: 4px 0;
50 margin-left: 110px;
51 }
52 }
53 }
54
55 // Distributions list
56 .distribution {
57 border: 1px solid darken(@gray-lighter,15%);
58 background-color: @gray-lighter;
59 margin-bottom: 20px;
60 margin-left: 20px;
61 width: 300px;
62 float: left;
63 &:hover {
64 background-color: darken(@gray-lighter,3%);
65 .distribution-hover {
66 top: 0px;
67 opacity: 1;
68 }
69 .distribution-more {
70 text-decoration: underline;
71 }
72 }
73 .typo3-dependency-version {
74 position: absolute;
75 right: 0px;
76 }
77 }
78 .distribution-holder {
79 &:extend(.clearfix all);
80 margin-top: 1em;
81 bottom: 0px;
82 margin-left: -20px;
83 }
84 .distribution-image {
85 position: relative;
86 width: 300px;
87 height: 225px;
88 overflow: hidden;
89 img {
90 display: block;
91 height: 100%;
92 width: 100%;
93 }
94 }
95 .distribution-hover {
96 background-color: @gray-lighter;
97 position: absolute;
98 top: 100%;
99 left: 0px;
100 width: 300px;
101 height: 225px;
102 overflow: hidden;
103 opacity: 0;
104 .transition(all 0.2s ease-in-out);
105 }
106 .distribution-hover-inner {
107 padding: 15px;
108 }
109 .distribution-meta {
110 border-top: 1px solid darken(@gray-lighter,10%);
111 padding: 15px;
112 .distribution-title {
113 margin: 0;
114 overflow: hidden;
115 white-space: nowrap;
116 text-overflow: ellipsis;
117 font-size: 14px;
118 }
119 .distribution-install {
120 margin-top: 0.5em;
121 }
122 }
123
124 .distribution-detail {
125 &:extend(.clearfix all);
126 min-width: 750px;
127 }
128 .distribution-detail-previewpane {
129 float: left;
130 margin-right: 30px;
131 }
132 .distribution-detail-preview {
133 display: block;
134 border: 1px solid darken(@gray-lighter,15%);
135 }
136 .distribution-detail-body {
137 overflow: hidden;
138 zoom: 1;
139 }
140 .distribution-detail-header {
141 h1 {
142 margin-bottom: 0.5em;
143 }
144 p {
145 padding: 0px;
146 max-width: 500px;
147 margin-bottom: 1.25em;
148 }
149 margin-bottom: 2.5em;
150 }
151 .distribution-detail-summary {
152 margin-top: 2.5em;
153 margin-bottom: 2.5em;
154 }
155 .distribution-installed {
156 hr {
157 margin: 2.5em 0;
158 border: 0;
159 border-top: 1px solid darken(@gray-lighter,15%);
160 }
161 }
162
163 // Misc
164 .ui-widget-header {
165 background: none;
166 border: none;
167 font-weight: normal;
168 }
169 .dataTables_info {
170 font-size: 10px;
171 color: #444;
172 float: left;
173 }
174 .paging_two_button .ui-button {
175 float: left;
176 cursor: pointer;
177 }
178 .paging_full_numbers {
179 float: right;
180 .ui-button {
181 padding: 2px 6px;
182 margin: 0;
183 cursor: pointer;
184 color: #333 !important;
185 }
186 }
187 .dataTables_paginate {
188 width: auto;
189 .ui-button {
190 margin-right: -0.1em !important;
191 }
192 }
193 .typo3-extension-list {
194
195 .ext-icon {
196 max-height: 16px;
197 width: auto;
198 }
199
200 tr.installed td {
201 background-color: #c8ffaa;
202 }
203
204 tr.available td {
205 background-color: #E1E1aa;
206 }
207
208 .inactive {
209 color: rgb(170, 170, 170);
210 }
211
212 // Hide author for now
213 .author {
214 display: none;
215 }
216 }
217
218
219 .typo3-extension-manager {
220 .insecure {
221 color: #ff2262;
222 }
223 .outdated {
224 color: #0c08ff;
225 }
226 form#extensionUploadForm {
227 margin-bottom: 0;
228 div.control-group:last-child {
229 margin-bottom: 0;
230 }
231 }
232 }
233
234 .headerTooltip {
235 .box-shadow(2px 2px 11px #666);
236 display: none;
237 width: 150px;
238 background-color: #ffa;
239 border: 1px solid #cc9;
240 padding: 3px;
241 font-size: 13px;
242 z-index: 1000;
243 }
244
245 // Loader
246 #terTableWrapper {
247 position: relative;
248 margin-top: 1em;
249 .splash-receivedata {
250 display: none;
251 position: absolute;
252 top: 50px;
253 left: 50%;
254 margin: 0 0 0 -150px;
255 a {
256 display: inline-block;
257 width: 200px;
258 vertical-align: top;
259 padding: 3px 20px;
260 }
261 &.is-shown {
262 display: block;
263 }
264 }
265 .spinner {
266 display: inline-block;
267 }
268 .ui-icon {
269 width: 16px;
270 height: 16px;
271 }
272 }
273 .time-since-last-update {
274 font-weight: bold;
275 padding-right: 0.4em;
276 cursor: help;
277 }
278 .is-loading {
279 opacity: 0;
280 }
281
282 // If something is hidden
283 .is-hidden {
284 display: none;
285 }
286
287 // Show all versions
288 .versions-all {
289 display: inline-block;
290 width: 20px;
291 text-indent: -200px;
292 overflow: hidden;
293 }
294 .currentVersionInfo {
295 padding: 0 0 20px 0;
296
297 td { padding: 4px 0; }
298 th { font-weight: normal; color: #8c8c8c; padding: 4px 20px 4px 0; }
299 }
300 span.ter-ext-state {
301 padding: 0 0 0 5px;
302 font-weight: bold;
303 text-transform: capitalize;
304 }
305 #typo3-docbody form.download {
306 margin-bottom: 0;
307 }
308 .typo3-extensionmanager-headerRowLeft {
309 display: inline-block;
310 .typo3-extensionmanager-searchTerFieldWrapper {
311 display: inline-block;
312 position: relative;
313 input {
314 height: 15px;
315 }
316 .t3-icon-input-clear {
317 position: absolute;
318 right: 3px;
319 top: 4px;
320 }
321 }
322 }