_custom.scss 14.6 KB
Newer Older
1 2
// Generic custom css (anything longer than a screen view should have its own component file)

Jen Zajac's avatar
Jen Zajac committed
3 4 5 6 7
#exportgeneration {
    text-align: center;
}

#progress-iframe { // old style progress bars, e.g. portfolio export
8
    border: 1px solid $gray-500;
Jen Zajac's avatar
Jen Zajac committed
9 10 11 12 13 14
    height: 40px;
    width: 100%;
    max-width: 650px;
    margin: 20px 0;
}

15 16
.task-item .complete-task .icon,
.task-item .overdue-task .icon {
17 18 19 20 21
    margin-left: -8px; // correct alignment
}

.task-item .btn-group {
    margin-right: -8px; // correct alignment
22 23 24 25
    a {
        font-size: 10px;
        padding: 2px 8px;
    }
26
}
27

28 29 30 31 32 33 34 35
.no-results {
    @extend .lead;
    clear: both;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
}

36 37 38 39 40
.no-results-small {
    @extend .no-results;
    padding: 15px 0;
}

41 42 43 44 45 46 47 48 49
.wysiwyg {
    label {
        display:block;
    }
    label  + .mce-tinymce {
        width:100%;
    }
}

50 51 52
.wysiwyg.view-description {
    width: 70%;
}
53 54 55 56 57
.wysiwyg.under-label-help {
    label  + .mce-tinymce {
        width:70%;
    }
}
58

59 60
.toolbar-affix.affix {
    position: fixed;
61
    top: 30px;
62 63 64 65
    z-index: 1;
}

.layoutthumb {
66
    rect.layout1 {
67 68
        fill: scale-color($card-bg, $lightness: -10%);
        stroke: $card-border-color;
69 70 71
    }

    rect.layout0 {
72
        fill: scale-color($card-bg, $lightness: -5.25%);
73

74
        stroke: $card-border-color;
75
    }
76 77

    svg {
78
        @include media-breakpoint-down(md) {
79 80 81
           zoom: 0.8;
       }
    }
82
}
Pat Kira's avatar
Pat Kira committed
83

84 85 86
// Show that layout thumbnails can be clicked (Bug 1543358)
.layoutoption > .thumbnail {
    cursor: pointer;
87 88 89 90 91 92 93 94 95
    // Add border around layout thumbnails
    display: block;
    padding: 4px;
    margin-bottom: 21px;
    line-height: $line-height-base;
    background-color: transparent;
    border: 1px solid $card-border;
    border-radius: 2px;
    transition: border .2s ease-in-out;
96 97
}

Pat Kira's avatar
Pat Kira committed
98 99 100
.blocktype-radio {
    display: none;
}
Naomi Guyer's avatar
Naomi Guyer committed
101 102 103

// see emaillist.tpl
.email-list {
104
    padding-bottom: 20px;
Naomi Guyer's avatar
Naomi Guyer committed
105
    display: block;
106 107 108
    .validation-message {
        padding: 8px 0 15px 15px
    }
109
    @include media-breakpoint-up(md) {
Naomi Guyer's avatar
Naomi Guyer committed
110 111 112
        display: inline-block;
        width: 420px;
    }
113
    @include media-breakpoint-up(xl) {
Naomi Guyer's avatar
Naomi Guyer committed
114 115 116
        width: 500px;
    }
}
117 118 119 120 121 122

// Styles for select2 in forms
// overriding select2 default styles
.select2-container-multi {
    max-width: 85% !important;
    display: inline-block;
123
    @include media-breakpoint-up(md) {
124 125
        width: 420px !important;
    }
126
    @include media-breakpoint-up(xl) {
127 128 129 130 131 132 133 134 135 136
        width: 500px !important;
    }
    &.select2-dropdown-open {
        .select2-choices {
            border-radius: 4px 4px 0 0;
        }
    }
    .select2-choices {
        @include box-shadow(0 1px 1px rgba(0, 0, 0, 0.075) inset);
        border-radius: 4px;
137
        background-color: $body-bg;
138
        border: 1px solid $input-border-color;
139 140 141 142 143 144 145
        background-image: none;
        width: 100%;
        .select2-search-choice {
            border: none;
        }
    }
}
Pat Kira's avatar
Pat Kira committed
146

147 148
// Specific card-secondary styling for the edit page layout
.card-secondary.blockinstance > .card-header > .blockinstance-header {
149 150 151 152 153 154
    display: block;
    padding-left: 10px;
    padding-right: 80px;
    word-break: normal;
}

155 156
// Style label institution selection
.institutionselector {
157 158 159 160 161 162
    .select {
        margin-bottom: 15px;
    }
    label {
        font-weight: bold;
    }
163
    @include media-breakpoint-up(md) {
164 165 166 167 168
        float: right;
        width: 50%;
        .form-group {
            float: right;
        }
169
        label {
170 171 172 173 174 175
            display: table-cell;
            width: auto;
        }
        .picker {
            width: auto;
            display: table-cell;
176
        }
177
    }
Liam's avatar
Liam committed
178 179 180
    > form {
        justify-content: flex-end;
    }
181
}
182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200

// Reset checkout boxes inside col in portfolio export page
.portfolio-export {
    .heading {
        margin-top: 15px;
    }
    .heading-exportable-pages {
        margin-top: 0;
        float: left;
    }
    .btn-group {
        float: right;
    }
}
.exportable-artefacts {
    .row {
        :first-child {
            clear: both;
        }
201
        border-bottom: 1px solid $list-group-border-color;
202 203 204 205 206 207 208 209 210 211
    }
    .checkbox input[type=checkbox] {
        margin-left: 0;
    }
    label {
        margin-bottom: 10px;
    }
}
.exportable-artefact-container {
    padding: 15px 15px 0;
212
    background-color: rgba($gray-100, 0.2);
213
}
214

Liam Sharpe's avatar
Liam Sharpe committed
215 216 217 218 219
// reset the padding when the individual font file is collapsed in font install
.individualfiles.form-group {
    padding: 0;
    border-bottom: 0 none;
}
220

221
// Login card
222 223 224
.login-externallink {
    display: inline-block;
}
225

226 227 228 229 230 231 232 233 234
.login-related-links {
  .register-link{
    padding-right: 2px;
  }
  .forgotpass-link {
    padding-left: 5px;
  }
}

235 236
.progress-bar {
    position: relative;
237
    height: 100%;
238 239 240 241 242 243 244
    &.small-progress span {
        display: block;
        left: 100%;
        padding-left: 5px;
        position: absolute;
    }
}
245

246 247 248 249 250 251 252
.progress-bar .decompress-link {
    color: $progress-bar-color;
    text-decoration: underline;
    display: inline-block;
    margin-top: 8px;
}

253 254
// Admin user search page (advanced options)
// limit the size of dynamic to match select box above
255 256 257 258 259 260 261 262
.userserach-filter {
    margin-bottom: 15px;
    .loggedindate-container {
        margin-top: 10px;
        max-width: 250px;
    }
    .duplicateemail-filter {
        margin-top: 10px;
263
        justify-content: flex-start;
264
    }
265 266
}

267 268 269 270 271 272 273 274
// Puts the date picker in form-condensed fields on the next line
.form-condensed {
    .picker {
        &.first {
            margin-left: 270px;
        }
    }
}
275

276 277 278 279 280
// Gallery thumbnails
// override bootstrap thumbnails styling
.thumbnails {
    padding-top: 20px;
    .thumb {
281
        margin: 5px 0px 10px 5px;
282 283 284 285
    }
}
.thumbnail {
    margin: 0 15px 0 0;
286
    .card-body & {
287
        margin-bottom: 10px;
288 289
    }
}
290 291 292 293 294 295 296
.bt-gallery,
.bt-gallery-editor {
    img.frame {
        padding: 3px;
        margin: 0;
        border: 1px solid #ccc;
        background: #fff;
Evonne Cheung's avatar
Evonne Cheung committed
297
        box-shadow: 0 0 3px 5px #f8f8f8;
298
    }
299 300 301 302
    &.card.card-secondary > .block > .card-body {
        overflow: hidden;
        padding: 15px 20px;
    }
303
}
304

305 306 307 308 309 310
.user-thumbnails {
    .user-icon {
        margin: 5px;
    }
}

311 312 313 314 315 316 317 318 319
//Google apps
.google-app {
    font-style: normal;
    img {
        height: 20px;
    }
    a {
        color: #245dc1;
    }
320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335
}

// Choose skin
.layoutoptions-container {
    @extend .clearfix;
    margin-top: 15px;
}
.layoutoption,
.skin {
    float: left;
    margin-bottom: 10px;
}

.objectionable-message {
    padding: 0 0 10px 0;
}
Pat Kira's avatar
Pat Kira committed
336 337 338 339 340 341

// Other social media input
#editprofileform_profiletype_other {
    @extend .form-control;
    width: 250px !important;
    margin-top: 10px;
342
    @include media-breakpoint-up(sm) {
Pat Kira's avatar
Pat Kira committed
343 344
        margin-left: 10px;
    }
345
    @include media-breakpoint-up(md) {
Pat Kira's avatar
Pat Kira committed
346 347 348
        margin-top: 0;
    }
}
349 350 351 352 353 354 355 356 357 358 359 360 361 362

// Editgroup membership modal
// see editgroupmemship.tpl
.editgroup-container {
    padding-bottom: 20px;
    margin-bottom: 20px;
    &:last-child {
        border-bottom-width: 0;
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .heading {
        margin: 0;
    }
363 364 365
    .checkbox {
        display: inline-block;
    }
366
}
367 368

// Used to make the forum settings look like it should
369
@include media-breakpoint-up(md) {
370 371 372 373 374 375 376
    #edit_interaction_weight_container {
        padding-left: 265px;
        label, span.description {
            margin-left: -265px;
        }
    }
}
377

378
.card > .card-header {
379
    font-size: $font-size-base * 1.14285;
380
}
381 382 383 384 385 386 387

.table thead {
    a::after {
        font-family: 'FontAwesome';
        position: relative;
        top: -3px;
        margin-left: 3px;
388
        color: $gray-300;
389
    }
390
    .asc > a::after {
391 392
        content: '\f0dd';
    }
393 394
    .desc > a::after,
    .sorted > a::after {
395 396 397 398
        content: '\f0de';
        top: 2px;
    }
}
399

400
.containobjectionable {
401
    background-color: $state-danger-bg;
402
}
403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419

.permissions-table {
    display: inline-block;
    .editpermissions.table {
        width: auto;
        background-color: rgba(255,255,255,0);
        thead tr th {
            font-weight: 400;
            font-size: 12px;
            padding: 2px 8px 8px;
        }
        thead tr,
        tbody td {
            min-width: 50px;
        }
    }
}
420

421 422 423 424 425
#needprotocolspro {
    padding-left: 10px;
}

#needprotocolsreq {
426 427
    padding-left: 10px;
}
428

429 430
.secreturls .list-group-item,
.iframesources .buttonscell {
431 432 433 434 435 436 437
    .collapse-indicator.open .icon-chevron-down {
        transform: rotate(-180deg);
        transition-duration: 0.3s;
    }
    .collapse-indicator.closed .icon-chevron-down {
        transform: rotate(0deg);
        transition-duration: 0.3s;
438 439
    }
}
440

441
.secreturls .list-group-item {
442 443
    .secret-url {
        word-wrap: break-word;
444 445
    }
}
446 447 448
.iframesources .buttonscell a {
    font-size: 12px;
}
449 450

// Remove the link colour from a comment that has an attachement
451
@include media-breakpoint-up(lg) {
452
    .viewfooter .comment-item .comment-attachment .card.collapsible h4 a.collapsed {
453
        color: $theme-text-color;
454 455
    }
}
456 457 458

#inboxblock .link-block.unread {
    font-weight: bold;
459 460 461 462 463 464 465
}

// Preview image in popup modal
#previewimg {
    display: block;
    margin: 0 auto;
}
466 467 468 469 470 471 472 473 474 475 476 477

// Edit/add skin page
// See templates/skin/index.tpl
.row.skins {
    margin-top: 30px;
    .skin {
        position: relative;
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
        float: none;
478
        @include media-breakpoint-up(sm) {
479 480 481
            float: left;
            width: 50%;
        }
482
        @include media-breakpoint-up(md) {
483 484 485 486
            width: 33.333333%;
        }
    }
}
487
.manage-skins-btn {
488 489 490
  margin-top: 10px;
  margin-bottom: 20px;
}
491 492 493 494

#auth_config_institutionidp {
    width: 90%;
}
495

496 497 498 499 500
.defaultskin {
    margin-top: 10px;
    margin-bottom: 20px;
}

501 502 503 504 505 506 507 508
.authInstance .authitem {
    padding:5px;
    &.inactive {
        background: $state-warning-bg;
        color: $state-warning-text;
    }
}

509 510
.btn-search.btn.btn-primary.admin-groups.button.btn {
    margin-left: -13px;
511
    margin-top: 2px;
512 513
    vertical-align: text-top;
}
514 515 516 517

.connections button {
    margin-top: 10px;
}
Robert Lyon's avatar
Robert Lyon committed
518 519 520 521 522

.emptybtnspace {
    display: inline-block;
    width: 30px;
}
523 524 525 526

// Make the other license text box align correctly on files page
.fileuploadlicense input[type=text].secondary-textbox,
.fileedittable input[type=text].secondary-textbox {
527
    @include media-breakpoint-up(xl) {
528 529 530
        margin-left: 100px;
    }
}
531 532 533 534 535 536 537

// fix responsive layout for pages and collections grid where sidebar overlaps
.grouppageswrap.view-container:after {
  clear: both;
  content: "";
  display: table;
}
538

539
.notification-parent .bulk-actions label.btn-secondary {
540 541
  padding-bottom: 3px;
}
542 543 544 545

.forassessment label {
  display: inline-block !important;
  margin-top: -25px;
546 547
}

548 549
.accessurl-button {
    margin-bottom: 15px;
550
}
551

552 553 554
#reportconfigform {
    fieldset {
        margin-top: 10px;
555
    }
556 557
    .checkbox.form-group {
        padding: 10px 0;
558
        label {
559 560
            padding-left: 28px;
            display: block;
561 562
        }
        input[type=checkbox] {
563 564
            position: absolute;
            top: 9px;
565
        }
566 567
    }
}
568

569 570 571
.reportsettings {
    margin-top: -5px;
}
572 573 574

.statinfoblock {
    width: 360px;
Evonne Cheung's avatar
Evonne Cheung committed
575 576
    float: left;
    margin-right: 15px;
577 578 579 580

    h3 {
        margin-top: 0;
    }
Evonne Cheung's avatar
Evonne Cheung committed
581 582 583 584 585
    h4 {
        padding: 0 1rem;
        margon: 0;
        font-size: $font-size-base;
    }
586

Evonne Cheung's avatar
Evonne Cheung committed
587 588 589
    table {
        padding: 10px;
    }
590 591 592 593
}

.ownersubtab {
    padding: 4px 0;
594 595 596 597 598 599 600 601
}

.deletion-message {
    float: right;
    position: relative;
    padding: 5px;
    clear: right;
}
602 603

// Used to remove the second border around the legal information
604
#agreetoprivacy .card {
605 606
    border: 0;
}
607 608 609 610 611 612 613 614 615 616 617

.image-rotator {
    height: 110px;
    line-height: 75px;

    .image-rotator-inner {
        display: inline-block;
        text-align: center;
        width: 110px;
    }
}
618 619 620

#searchviews_matchalltags_container {
    width: 300px;
621
    margin-left: 5px;
Evonne Cheung's avatar
Evonne Cheung committed
622
    margin-top: 21px;
623 624 625 626 627
    label {
        margin-left: 28px;
    }
    input {
        margin-left: 3px;
628
        margin-top: -20px;
629
        float: left;
Evonne Cheung's avatar
Evonne Cheung committed
630 631
        width: auto;
        height: auto;
632 633 634 635 636 637 638 639
    }
    div {
        margin-left: 3px;
        padding-top: 0;
        span {
            padding-top: 0;
        }
    }
640 641
}

642 643 644 645 646 647 648 649 650
div.toolbarhtml {
    margin-top: 5px;
    clear: both;
    float: right;
    div {
        text-align: right;
    }
}

651 652 653 654 655 656 657
.assessment-item-buttons {
    .assessbtn + .assessbtn {
        button {
            @include border-left-radius(0);
        }
    }
}
658

659 660 661 662 663 664
#viewinstructions,
.peerinstructions {
    &.with-toolbar {
        margin-right: 20px;
    }
    div.fieldset-body {
665
        background-color: $gray-100 !important;
666
    }
667
}
668 669 670 671 672

.releaseviewform {
    position: relative;
    top: 15px;
}
673 674 675 676 677 678

.field-label-bold {
    label {
        font-weight: bold;
    }
}
679 680
#pendinglist {
    margin-bottom: 0;
681
}
682 683
// Stop btn links displaying as buttons
[type="button"].btn-link,
Liam's avatar
Liam committed
684
a[type="submit"],
685 686
.card-header a[type="button"] {
    -webkit-appearance: none;
687
}
688 689 690 691 692 693 694 695 696 697 698 699 700 701 702

// Used when you really only need flex on an item
.flexbox {
    display: flex;
}

// Add space when there are 2 selects next to each other
.select {
    + .select {
        margin-left: 5px;
    }
    + .submit:not(.input-group-append) {
        margin-left: 5px;
    }
}
703 704 705 706 707

// Removes weird text node between buttons on admin/users/suspended.php
.pieform-fieldset.btn-group {
    font-size: 0;
}
708 709 710

.elasticsearch-filters {
    border-bottom: 1px solid $card-border;
711
    background-color: $card-header-bg;
712
}
713 714 715 716 717

// Mostly used to make the table matrix popups work
.d-none.popover {
    visibility: hidden;
}
Evonne Cheung's avatar
Evonne Cheung committed
718 719 720 721 722

// Notifications search and bulk action select alignment
.form-inline {
    input {
        @extend .form-control;
723 724 725
        &.btn-primary {
            @extend .btn-primary;
        }
Evonne Cheung's avatar
Evonne Cheung committed
726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770
    }
}
.notification-parent {
    .bulk-actions {
        input {
            margin-top: 1px;
        }
        button {
            height: calc(2.0625rem + 2px);
        }
    }
}

// Share with me search filter
#search_share_container {
    label {
        margin-top: 13px;
    }
}

// Find groups search
#search_searchfield {
    color: $btn-primary-color;
    background-color: $btn-primary-bg;
    border: $btn-primary-border;
    border-radius: $border-radius;
    width: auto;
    margin-top: 12px;
}

// Find people results approve request alignment
.approvefriend .pieform {
    display: inline-block;
    margin-left: 3px;
    button {
        font-size: $font-size-sm;
    }
}

// Manage collections
.collection-pages {
    button.btn-sm {
        border: 0;
    }
}
Evonne Cheung's avatar
Evonne Cheung committed
771 772 773 774 775 776 777 778 779 780 781 782 783 784

// Networking delete btn
.secondary #networkingform_submit {
    background-color: $state-danger-bg;
    color: $state-danger-text;
    border-color: $state-danger-border;
    margin-left: .5rem;
}

// Web services add service groups btn
#webservices_function_groups_add_submit,
#webservices_token_generate_submit {
    width: auto;
}
785 786 787 788 789

// Backup for libraries that still need hidden class instead of bootstrap 4s new .d-none
.hidden {
    display: none;
}