[!!!][FEATURE] Refactor and streamline click menu / context menu
[Packages/TYPO3.CMS.git] / Build / Resources / Public / Less / install.less
1 //
2 // Install Tool
3 // =========
4 // Contains all needed styles for the TYPO3 Intall Tool.
5 //
6
7
8 //
9 // Load minimal Setup including variables
10 //
11 @import "_minimal.less";
12 @import "@{path-bower}/bootstrap/less/navbar.less";
13
14 //
15 // Load global Variables
16 // Note: Needs to be loaded always at the end of the LESS file that gets compiled
17 //
18 @import "_variables.less";
19
20 //
21 // Include tagsort CSS file
22 //
23 @import (inline) "../../../node_modules/tagsort/tagsort.css";
24
25 @grid-float-breakpoint: @screen-md-min;
26
27 .content-area {
28         padding-bottom: 35px;
29
30         > h3 {
31                 margin-top: 0;
32         }
33
34         > *:last-child {
35                 margin-bottom: 0;
36         }
37 }
38
39 .logo-pageheader {
40         img {
41                 padding-bottom: 3px;
42         }
43 }
44
45 img.logo {
46         vertical-align: bottom;
47 }
48
49 .typo3-message > h4 {
50         margin-bottom: 0;
51 }
52
53 .typo3-message p {
54         margin-top: 9px;
55 }
56
57 .t3-install-displaytwinimageimages {
58         border: 1px solid #cccccc;
59         padding: 10px;
60 }
61 .t3-install-displaytwinimagetextarea {
62         pre {
63                 border-top: 0;
64         }
65 }
66 .bg-transparent-emulation {
67         padding: 10px;
68         text-align: center;
69         background: url("@{path-sysext}/install/Resources/Public/Images/bg_transparent_emulation.png");
70         img {
71                 max-width: 300px;
72         }
73 }
74
75 @alert-success-text: @gray-darker;
76 @alert-success-border: #79a548;
77 @alert-success-bg: lighten(#79a548, 20%);
78
79 @alert-info-text: @gray-darker;
80 @alert-info-border: #6daae0;
81 @alert-info-bg: lighten(#6daae0, 20%);
82
83 @alert-warning-text: @gray-darker;
84 @alert-warning-border: #e8a33d;
85 @alert-warning-bg: lighten(#e8a33d, 20%);
86
87 @alert-danger-text: @gray-darker;
88 @alert-danger-border: #c83c3c;
89 @alert-danger-bg: lighten(#c83c3c, 30%);
90
91 .alert-notice {
92         .alert-variant(@btn-default-bg; @btn-default-border; @btn-default-color);
93 }
94
95 .nav-pills > li > a {
96         border-radius: 0;
97 }
98
99 h1:first-child {
100         margin-top: 0;
101 }
102
103 .typo3-docheader {
104         &-functions,
105         &-buttons {
106                 min-height: 20px;
107         }
108 }
109
110 .item {
111         margin : 1em;
112         border: 1px solid @panel-default-heading-bg;
113 }
114
115 .item .item-heading {
116         padding: 1em;
117         background-color: @panel-default-heading-bg;
118 }
119
120 .item .item-body {
121         padding: 1em;
122 }
123
124 .list-group-item {
125         a {
126                 display: block;
127         }
128         &.active {
129                 a {
130                         color: #fff;
131                 }
132         }
133 }
134
135 .collapsed .caret {
136         transition: all 0.25s ease-in-out;
137         transform: rotate(-90deg);
138 }
139
140 a[data-toggle="collapse"] {
141         display: block;
142 }
143
144 @media (min-width: @screen-md-min) {
145         .affix-bottom {
146                 position: absolute;
147         }
148
149         body.standalone .affix-top {
150                 position: relative;
151         }
152
153         .affix {
154                 position: fixed;
155                 top: 35px;
156         }
157
158         body.backend .affix-top {
159                 position: fixed;
160                 top: 35px;
161         }
162
163         body.backend .leftNavigation {
164                 min-height: 425px;
165         }
166 }
167
168 hr {
169         border-top-color: @panel-default-heading-bg;
170 }
171
172 .copyright .panel-default:last-child {
173         margin-bottom: 0;
174 }
175
176 #fixed-footer-handler {
177         height: 32px;
178 }
179 .fixed {
180         position: fixed;
181         bottom: 0;
182         background-color: grey;
183         .footer-innerWrap {
184                 padding : 1.5em;
185         }
186 }
187
188 // override 'position: fixed' (set by bootstrap affix via JS) if viewport < MD
189 // menu is placed above the content
190 #menuWrapper {
191         @media (max-width: @screen-sm-max) {
192                 position: relative!important;
193                 margin-bottom: 30px;
194         }
195 }
196
197 #install-menu-button {
198         .navbar-toggle {
199                 .icon-bar {
200                         background-color: black;
201                 }
202         }
203 }
204
205 //
206 // Styles for the "clearable" jquery plugin.
207 //
208 .form-control-clearable {
209         position: relative;
210         .form-control {
211                 padding-right: 2.3em;
212         }
213         .close {
214                 position: absolute;
215                 z-index: 3;
216                 font-size: 1.2em;
217                 top: 50%;
218                 right: 0.5em;
219                 margin-top: -0.55em;
220                 &:before {
221                         line-height: 1.5em;
222                 }
223         }
224 }
225 .input-group {
226         .form-control-clearable {
227                 display: table-cell;
228                 .form-control {
229                         display: block;
230                 }
231         }
232 }