weekly release 3.4dev
[moodle.git] / theme / boost / scss / moodle / user.scss
CommitLineData
536f0460
DW
1/* user.less */
2.userprofile .fullprofilelink {
3 text-align: center;
4 margin: 10px;
5}
f4143537 6
536f0460
DW
7.userprofile .page-context-header {
8 margin-bottom: 10px;
9}
f4143537 10
536f0460
DW
11.userprofile .description {
12 margin-top: 10px;
13 margin-bottom: 30px;
14}
f4143537 15
536f0460
DW
16.userprofile .profile_tree {
17 column-count: 2;
f4143537 18
e9a009dc
FM
19 section {
20 @extend .card;
21 @extend .card-block;
22 display: inline-block;
23 width: 100%;
f4143537 24
e9a009dc
FM
25 h3 {
26 @extend .lead;
27 }
28 }
536f0460 29}
f4143537 30
76c493b3
DW
31// This rule overrides the automatic no-overflow on the participants table. It kills the auto-complete.
32#participantsform .no-overflow {
33 overflow: visible;
34}
35
536f0460 36.userprofile dl.list {
da92b738
FM
37 // Copied from dl.row.
38 > dd + dt {
9cb41231 39 clear: left;
da92b738 40 }
536f0460 41}
f4143537 42
536f0460
DW
43.user-box {
44 margin: 8px;
45 width: 115px;
46 height: 160px;
47 text-align: center;
48 float: left;
49 clear: none;
50}
f4143537 51
536f0460
DW
52#page-user-profile .node_category,
53.path-user .node_category {
54 ul {
137c289a 55 margin: 0;
536f0460 56 list-style: none;
137c289a 57 padding-left: 0;
536f0460 58 }
f4143537 59
536f0460
DW
60 li {
61 margin-top: 5px;
62 }
f4143537 63
536f0460
DW
64 .editprofile,
65 .viewmore {
66 text-align: right;
67 }
68}
69
fd8eab57
RW
70.ajax-contact-button {
71 box-sizing: border-box;
72 position: relative;
73
74 &.loading {
75 .loading-icon {
76 display: block;
77 }
78 }
79
80 .loading-icon {
81 display: none;
82 position: absolute;
83 top: 0;
84 left: 0;
85 width: 100%;
86 height: 100%;
87 background-color: rgba(255, 255, 255, 0.7);
88
89 .icon {
90 position: absolute;
91 left: 50%;
92 top: 50%;
93 transform: translate(-50%, -50%);
94 }
95 }
96}
97
536f0460
DW
98@media (max-width: 480px) {
99 .userprofile .profile_tree {
100 /** Display the profile on one column on phones@mixin */
101 column-count: 1;
102 }
103}
104
536f0460
DW
105.userlist #showall {
106 margin: 10px 0;
107}
f4143537 108
536f0460
DW
109.userlist .buttons {
110 text-align: center;
111}
f4143537 112
536f0460
DW
113.userlist .buttons label {
114 padding: 0 3px;
115}
f4143537 116
536f0460
DW
117.userlist table#participants {
118 text-align: center;
119}
f4143537 120
536f0460
DW
121.userlist table#participants td,
122.userlist table#participants th {
123 vertical-align: middle;
124 text-align: left;
125 padding: 4px;
126}
f4143537 127
536f0460
DW
128.userlist {
129 table.controls {
130 width: 100%;
f4143537 131
536f0460
DW
132 tr {
133 vertical-align: top;
134 }
f4143537 135
536f0460
DW
136 .right {
137 text-align: right;
138 }
f4143537 139
536f0460
DW
140 .groupselector {
141 margin-bottom: 0;
142 margin-top: 0;
f4143537 143
536f0460
DW
144 label {
145 display: block;
146 }
147 }
148 }
149}
f4143537 150
536f0460
DW
151.userinfobox {
152 width: 100%;
153 border: 1px solid;
154 border-collapse: separate;
155 padding: 10px;
156}
f4143537 157
536f0460
DW
158.userinfobox .left,
159.userinfobox .side {
160 width: 100px;
161 vertical-align: top;
162}
f4143537 163
536f0460
DW
164.userinfobox .userpicture {
165 width: 100px;
166 height: 100px;
167}
f4143537 168
536f0460
DW
169.userinfobox .content {
170 vertical-align: top;
171}
f4143537 172
536f0460
DW
173.userinfobox .links {
174 width: 100px;
175 padding: 5px;
176 vertical-align: bottom;
177}
f4143537 178
536f0460
DW
179.userinfobox .links a {
180 display: block;
181}
f4143537 182
536f0460
DW
183.userinfobox .list td {
184 padding: 3px;
185}
f4143537 186
536f0460
DW
187.userinfobox .username {
188 padding-bottom: 20px;
189 font-weight: bold;
190}
f4143537 191
536f0460
DW
192.userinfobox td.label {
193 text-align: right;
194 white-space: nowrap;
195 vertical-align: top;
196 font-weight: bold;
197}
f4143537 198
536f0460
DW
199.groupinfobox {
200 @extend .card;
201}
f4143537 202
536f0460
DW
203.groupinfobox .left {
204 padding: 10px;
205 width: 100px;
206 vertical-align: top;
207}
f4143537 208
536f0460
DW
209.course-participation #showall {
210 text-align: center;
211 margin: 10px 0;
212}
f4143537 213
536f0460
DW
214#user-policy .noticebox {
215 text-align: center;
216 margin-left: auto;
217 margin-right: auto;
218 margin-bottom: 10px;
219 width: 80%;
220 height: 250px;
221}
f4143537 222
536f0460
DW
223#user-policy #policyframe {
224 width: 100%;
225 height: 100%;
226}
f4143537 227
536f0460
DW
228.iplookup #map {
229 margin: auto;
230}
f4143537 231
536f0460
DW
232.userselector select {
233 width: 100%;
234}
f4143537 235
536f0460
DW
236.userselector div {
237 margin-top: 0.2em;
238}
f4143537 239
536f0460
DW
240.userselector div label {
241 margin-right: 0.3em;
242}
243/* Next style does not work in all browsers but looks nicer when it does */
244.userselector .userselector-infobelow {
245 font-size: 0.8em;
246}
f4143537 247
536f0460
DW
248#userselector_options .collapsibleregioncaption {
249 font-weight: bold;
250}
f4143537 251
536f0460
DW
252#userselector_options p {
253 margin: 0.2em 0;
254 text-align: left;
255}
256/** user full profile */
257#page-user-profile .messagebox {
258 text-align: center;
259 margin-left: auto;
260 margin-right: auto;
261}
262/** user course profile */
263#page-course-view-weeks .messagebox {
264 text-align: center;
265 margin-left: auto;
266 margin-right: auto;
267}
268
269.profileeditor {
270 > .singleselect {
271 margin: 0 0.5em 0 0;
272 }
f4143537 273
536f0460
DW
274 > .singlebutton {
275 display: inline-block;
276 margin: 0 0 0 0.5em;
f4143537
DP
277
278 div,
279 input {
536f0460
DW
280 margin: 0;
281 }
282 }
283}
284
a7bebd06
DW
285// Remove the little cog from participants page because we are putting a cog menu there.
286.userlist h3 .action-icon {
287 display: none;
288}
ae9bbd98
DW
289
290#page-enrol-users .popover {
291 max-width: none;
292}
d9a1d683
DW
293
294.user-enroller-panel {
295 width: 600px;
296}