Commit | Line | Data |
---|---|---|
a5c5a349 CW |
1 | /** |
2 | * @file | |
3 | * CSS for the jQuery.dashboard() plugin. | |
4 | * | |
5 | * Released under the GNU General Public License. See LICENSE.txt. | |
6 | */ | |
7 | ||
8 | #crm-container .column { | |
9 | float: left; | |
10 | margin: 0; | |
11 | /* padding-bottom and min-height make sure that there is always a sizable drop zone. */ | |
12 | min-height: 400px; | |
13 | height: 400px; | |
14 | height: auto !important; | |
15 | padding: 0 0 250px; | |
16 | list-style-type: none; | |
17 | } | |
18 | ||
19 | #crm-container .column-0 { | |
20 | width: 40%; | |
21 | } | |
22 | ||
23 | #crm-container .column-1 { | |
24 | width: 60%; | |
25 | } | |
26 | ||
27 | /* The placeholder that indicates where a dragged widget will land if dropped now. */ | |
28 | #crm-container .placeholder { | |
29 | margin: 5px; | |
30 | border: 3px dashed pink; | |
31 | } | |
32 | ||
33 | /* Spacing between widgets. */ | |
34 | #crm-container li.widget, #crm-container li.empty-placeholder { margin: 6px 3px; } | |
35 | #crm-container li.widget { | |
36 | padding: 0px; | |
37 | } | |
38 | ||
39 | /* Spacing inside widgets. */ | |
40 | #crm-container .widget-wrapper { | |
41 | padding: 0px; | |
42 | overflow-x:auto; | |
43 | margin-right: .25em | |
44 | } | |
45 | ||
46 | /* wodget header / title */ | |
47 | #crm-container .widget-header { | |
48 | background:#CDE8FE none repeat scroll 0 0; | |
49 | color:#000; | |
50 | cursor:move; | |
51 | display:inline; | |
52 | font-size:1.2em; | |
53 | margin:0; | |
54 | } | |
55 | ||
56 | /* widget content / body*/ | |
57 | #crm-container .widget-content { | |
58 | background-color: #ffffff; | |
59 | padding:0.5em; | |
60 | } | |
61 | ||
62 | /* Standards-browsers do this anyway because all inner block elements are floated. IE doesn't because it's crap. */ | |
63 | #crm-container .widget-controls { | |
64 | background-color:#CDE8FE; | |
65 | display:block; | |
66 | padding:5px 0px; | |
67 | } | |
68 | ||
69 | #crm-container .widget-icon, #crm-container .full-screen-close-icon img { | |
70 | display: block; | |
71 | float: right; | |
72 | margin-left: 2px; | |
73 | margin-top: 2px; | |
74 | cursor: pointer; | |
75 | } | |
76 | ||
77 | #full-screen-header { | |
78 | display: block; | |
79 | padding: .2em .4em; | |
80 | background: #F0F0E8; | |
81 | /* Although this is an <a> link, it doesn't have an href="" attribute. */ | |
82 | cursor: pointer; | |
83 | } | |
84 | ||
85 | /* Make the throbber in-yer-face. */ | |
86 | #crm-container .throbber { | |
87 | text-align: right; | |
88 | background:url("../packages/jquery/css/images/throbber.gif") no-repeat scroll 0 0 transparent; | |
89 | height:20px; | |
90 | width:20px; | |
91 | } | |
92 | ||
93 | #crm-container p.loadtext { | |
94 | margin:1.6em 0 0 26px; | |
95 | } | |
96 | ||
97 | #crm-container .widget-icon { | |
f2f191fe | 98 | background-image:url('../packages/jquery/jquery-ui/images/ui-icons_222222_256x240.png'); |
a5c5a349 CW |
99 | height:16px; |
100 | width:16px; | |
101 | padding-right:2px; | |
102 | float: left; | |
103 | border-radius: 2px; | |
104 | } | |
105 | #crm-container .widget-icon.minimize-icon { | |
106 | background-position:-63px -17px; | |
107 | } | |
108 | ||
109 | #crm-container .widget-icon.maximize-icon { | |
110 | background-position:-31px -18px; | |
111 | } | |
112 | ||
113 | #crm-container .widget-icon.fullscreen-icon { | |
114 | background-position:-48px -80px; | |
115 | float:right; | |
116 | } | |
117 | #crm-container .widget-icon.close-icon { | |
e1508ef7 | 118 | background-position: -80px -128px; |
a5c5a349 CW |
119 | float:right; |
120 | } | |
121 | #crm-container .widget-icon:hover { | |
122 | background-color: rgba(255, 255, 255, 0.8); | |
123 | } | |
124 | ||
125 | /* CSS for Dashlets */ | |
126 | ||
127 | #crm-container #available-dashlets { | |
128 | width: 98%; | |
129 | border: 2px dashed pink; | |
130 | background-color: #999999; | |
131 | min-height:40px; | |
132 | } | |
133 | ||
134 | #crm-container .dash-column { | |
135 | border: 2px solid #696969; | |
136 | min-height: 100px; | |
137 | background-color: #EEEEEE | |
138 | } | |
139 | ||
140 | #crm-container .dashlets-header { | |
141 | font-weight: bold; | |
142 | } | |
143 | ||
144 | #crm-container #dashlets-header-col-0 { | |
145 | float: left; | |
146 | width: 40%; | |
147 | } | |
148 | ||
149 | #crm-container #dashlets-header-col-1 { | |
150 | margin-left: 42%; | |
151 | width: 56%; | |
152 | } | |
153 | ||
154 | #crm-container #existing-dashlets-col-0 { | |
155 | float: left; | |
156 | width: 40%; | |
157 | } | |
158 | ||
159 | #crm-container #existing-dashlets-col-1 { | |
160 | margin-left: 42%; | |
161 | width: 56%; | |
162 | } | |
163 | ||
164 | #crm-container .portlet { | |
165 | margin: .5em; | |
166 | width: 75%; | |
167 | display: inline-block; | |
168 | } | |
169 | ||
170 | #crm-container .portlet-header { | |
171 | margin: 0.3em; | |
172 | padding: 0.5em; | |
173 | cursor: pointer; | |
174 | } | |
175 | ||
176 | #crm-container #available-dashlets .portlet { | |
177 | width: auto; | |
178 | } | |
179 | ||
180 | #crm-container .portlet-header .ui-icon { | |
181 | float: right; | |
182 | } | |
183 | ||
184 | #crm-container .portlet-content { | |
185 | padding: 0.4em; | |
186 | } | |
187 | ||
188 | #crm-container .ui-sortable-placeholder { | |
189 | border: 1px dotted black; | |
190 | visibility: visible !important; | |
191 | height: 50px !important; | |
192 | } | |
193 | ||
194 | #crm-container .ui-sortable-placeholder * { | |
195 | visibility: hidden; | |
196 | } |