| 336 |
336 |
}
|
| 337 |
337 |
}
|
| 338 |
338 |
|
| 339 |
|
ul.messages li,
|
| 340 |
|
div.infonotice,
|
| 341 |
|
div.successnotice,
|
| 342 |
|
div.warningnotice,
|
| 343 |
|
div.errornotice {
|
|
339 |
@mixin notification-message-base($symbol, $border-color, $left-color-top, $left-color-bottom) {
|
| 344 |
340 |
position: relative;
|
| 345 |
341 |
font-size: 110%;
|
| 346 |
342 |
background: white;
|
| 347 |
343 |
color: #3c3c33;
|
| 348 |
344 |
font-weight: normal;
|
| 349 |
345 |
border-radius: 3px;
|
| 350 |
|
margin: 1rem 0;
|
| 351 |
346 |
padding: 0.5rem;
|
| 352 |
347 |
border: 1px solid transparent;
|
| 353 |
348 |
border-left-width: 25px;
|
| ... | ... | |
| 360 |
355 |
text-align: center;
|
| 361 |
356 |
font-family: FontAwesome;
|
| 362 |
357 |
color: white;
|
|
358 |
content: $symbol;
|
| 363 |
359 |
}
|
| 364 |
|
&.success,
|
| 365 |
|
&.successnotice {
|
| 366 |
|
&:before { content: "\f058"; } // check-circle
|
| 367 |
|
border-color: #00b000;
|
| 368 |
|
border-image: linear-gradient(#27eb00, lighten(#27eb00, 10%)) 2;
|
| 369 |
|
}
|
| 370 |
|
&.info,
|
| 371 |
|
&.infonotice {
|
| 372 |
|
&:before { content: "\f05a"; } // info-circle
|
| 373 |
|
border-color: #0000b0;
|
| 374 |
|
border-image: linear-gradient(#4474f6, lighten(#4474f6, 10%)) 2;
|
| 375 |
|
}
|
| 376 |
|
&.warning,
|
| 377 |
|
&.warningnotice {
|
| 378 |
|
&:before { content: "\f06a"; } //exclamation-circle
|
| 379 |
|
border-color: #ffb000;
|
| 380 |
|
border-image: linear-gradient(#f47f13, lighten(#f47f13, 15%)) 2;
|
| 381 |
|
}
|
| 382 |
|
&.error,
|
| 383 |
|
&.errornotice {
|
| 384 |
|
&:before { content: "\f071"; } // exclamation-triangle
|
| 385 |
|
border-color: #f64474;
|
| 386 |
|
border-image: linear-gradient(#f64474, lighten(#f64474, 5%)) 2;
|
|
360 |
border-color: $border-color;
|
|
361 |
border-image: linear-gradient(#{$left-color-top}, #{$left-color-bottom}) 2;
|
|
362 |
|
|
363 |
p {
|
|
364 |
margin: 0 0 0.6rem 0;
|
|
365 |
&:last-child {
|
|
366 |
margin-bottom: 0;
|
|
367 |
}
|
|
368 |
}
|
|
369 |
}
|
|
370 |
|
|
371 |
@mixin extended-notification-message {
|
|
372 |
&[class*=grid-].comment-field {
|
|
373 |
// adapt when used as comment field in grid system.
|
|
374 |
box-sizing: border-box;
|
|
375 |
margin-right: 1rem;
|
|
376 |
}
|
|
377 |
&:not([class*=grid-]).comment-field {
|
|
378 |
// clear everything if not in a grid.
|
|
379 |
clear: both;
|
|
380 |
}
|
|
381 |
|
|
382 |
&.cell {
|
|
383 |
padding-bottom: 0.5em !important;
|
| 387 |
384 |
}
|
|
385 |
|
| 388 |
386 |
.action {
|
| 389 |
387 |
margin: 0;
|
| 390 |
388 |
display: flex;
|
| ... | ... | |
| 409 |
407 |
}
|
| 410 |
408 |
}
|
| 411 |
409 |
|
|
410 |
.messages li.error, .errornotice, .pk-error {
|
|
411 |
@include notification-message-base("\f071", #f64474, #f64474, lighten(#f64474, 5%));
|
|
412 |
}
|
|
413 |
|
|
414 |
.messages li.warning, .warningnotice, .pk-attention {
|
|
415 |
@include notification-message-base("\f06a", #ffb000, #f47f13, lighten(#f47f13, 15%));
|
|
416 |
}
|
|
417 |
|
|
418 |
.messages li.success, .successnotice, .pk-success {
|
|
419 |
@include notification-message-base("\f058", #00b000, #27eb00, lighten(#27eb00, 10%));
|
|
420 |
}
|
|
421 |
|
|
422 |
.messages li.info, .infonotice, .pk-information {
|
|
423 |
@include notification-message-base("\f05a", #0000b0, #4474f6, lighten(#4474f6, 10%));
|
|
424 |
}
|
|
425 |
|
|
426 |
.errornotice, .warningnotice, .infonotice, .successnotice,
|
|
427 |
.pk-error, .pk-attention, .pk-information, .pk-success {
|
|
428 |
@include extended-notification-message();
|
|
429 |
}
|
|
430 |
|
|
431 |
.messages li {
|
|
432 |
&.error, &.warning, &.success, &.info {
|
|
433 |
margin-top: 0;
|
|
434 |
}
|
|
435 |
}
|
|
436 |
|
| 412 |
437 |
/* main content */
|
| 413 |
438 |
|
| 414 |
439 |
#main {
|
| 415 |
|
-
|