f783dc3dca9787b065203630738dce3379902b14
[Packages/TYPO3.CMS.git] / Build / Resources / Public / Sass / component / _dropdown.scss
1 //
2 // Dropdowns
3 //
4 .dropdown-menu {
5     line-height: 1.45em;
6     border: 0;
7     margin: 0;
8     border-radius: 0;
9     color: $dropdown-color;
10
11     a {
12         color: inherit;
13         display: block;
14
15         &:focus,
16         &:hover {
17             color: inherit;
18             text-decoration: none;
19         }
20     }
21
22     hr {
23         border-top: 1px solid rgba(0, 0, 0, 0.35);
24         margin: 1.25em -15px;
25     }
26
27     > *:last-child {
28         margin-bottom: 0;
29     }
30
31     .form-group {
32         margin-bottom: 0.75em;
33     }
34
35     .form-control {
36         border-color: #aaa;
37         color: inherit;
38         border-radius: 0;
39         background-color: #333;
40
41         &:focus {
42             box-shadow: none;
43             border-color: #bbb;
44         }
45     }
46
47     .btn {
48         border: none;
49         border-radius: 0;
50         padding: 6px 10px;
51     }
52 }
53
54 .dropdown-headline {
55     font-size: 1.15em;
56     margin-top: 0;
57     margin-bottom: 0.5em;
58 }
59
60 .dropdown-text {
61     a {
62         display: inline-block;
63     }
64 }
65
66 div.dropdown-menu {
67     padding: 1.5em;
68 }
69
70 .dropdown-list {
71     @include list-unstyled();
72
73     > li {
74         @extend .clearfix;
75
76         position: relative;
77     }
78
79     > li + li {
80         margin-top: 0.5em;
81     }
82 }
83
84 .dropdown-list-link {
85     display: block;
86     text-decoration: none;
87
88     &:hover,
89     &:focus {
90         text-decoration: none;
91     }
92 }
93
94 //
95 // Dropdown Table
96 //
97 .dropdown-table {
98     display: table;
99     width: 100%;
100 }
101
102 .dropdown-table-row {
103     display: table-row;
104 }
105
106 .dropdown-table-column {
107     display: table-cell;
108     padding-top: 0.25em;
109     padding-bottom: 0.25em;
110     vertical-align: middle;
111 }
112
113 .dropdown-table-column-top {
114     vertical-align: top;
115 }
116
117 .dropdown-table-icon {
118     width: 16px;
119     padding-right: 0.5em;
120 }
121
122 .dropdown-table-title {
123     white-space: nowrap;
124     padding-right: 1.5em;
125 }
126
127 .dropdown-table-title-ellipsis {
128     max-width: 230px;
129     overflow: hidden;
130     display: block;
131     white-space: nowrap;
132     text-overflow: ellipsis;
133 }
134
135 .dropdown-table-actions {
136     white-space: nowrap;
137     text-align: right;
138 }
139
140 .dropdown-table-actions-btn {
141     text-align: center;
142     display: inline-block !important;
143     margin-top: -4px;
144     margin-bottom: -4px;
145     padding: 4px;
146     vertical-align: middle;
147 }
148
149 .dropdown-table-actions-btn-close:hover,
150 .dropdown-table-actions-btn-edit:hover {
151     background-color: $brand-notice;
152 }
153
154 .dropdown-table-actions-btn-delete:hover {
155     background-color: $brand-danger;
156 }