theme/noname/scss/moodle/modules.scss

   1 /* modules.less */
   2
   3 // The home for small tweaks to modules that don't require
   4 // changes drastic enough to pull in the full module css
   5 // and replace it completely
   6 // Plus some misc. odds and ends
   7
   8 select {
   9     width: auto;
  10 }
  11
  12 // Forum module
  13
  14 .path-mod-forum .forumsearch {
  15     input,
  16     .helptooltip {
  17         margin: 0 3px;
  18     }
  19 }
  20
  21 .path-mod-forum .forumheaderlist,
  22 .path-mod-forum .forumheaderlist td {
  23     border: none;
  24 }
  25
  26 .path-mod-forum {
  27     .forumheaderlist {
  28         thead .header,
  29         tbody .discussion td {
  30             white-space: normal;
  31             vertical-align: top;
  32             padding-left: 0.5em;
  33             padding-right: 0.5em;
  34         }
  35
  36         thead .header {
  37             white-space: normal;
  38             vertical-align: top;
  39         }
  40
  41         thead .header.replies {
  42             text-align: center;
  43         }
  44         thead .header.lastpost {
  45             text-align: right;
  46         }
  47         thead .header th,
  48         tbody .discussion td{
  49             &.discussionsubscription {
  50                 width: 16px;
  51                 padding-left: 0.5em;
  52                 padding-right: 0.5em;
  53             }
  54         }
  55         .discussion {
  56             .author, .replies, .lastpost {
  57                 white-space: normal;
  58             }
  59             .discussionsubscription,
  60             .replies {
  61                 text-align: center;
  62             }
  63             .topic,
  64             .discussionsubscription,
  65             .topic.starter,
  66             .picture,
  67             .author,
  68             .replies,
  69             .lastpost {
  70                 vertical-align: top;
  71             }
  72         }
  73     }
  74 }
  75
  76 .forumpost {
  77     @extend .card;
  78     padding: 6px;
  79     .header {
  80         margin-bottom: 3px;
  81     }
  82     .picture img {
  83         margin: 3px;
  84         &.userpicture {
  85             margin-left: 3px;
  86             margin-right: 10px;
  87         }
  88     }
  89     .content {
  90         .posting.fullpost {
  91             margin-top: 8px;
  92         }
  93     }
  94     .row {
  95         .topic,
  96         .content-mask,
  97         .options {
  98             margin-left: 48px;
  99         }
 100         &.side {
 101             clear: both;
 102         }
 103     }
 104 }
 105
 106 .forumpost .row .left {
 107     width: 48px;
 108 }
 109
 110 .forumpost .options .commands {
 111     margin-left: 0;
 112 }
 113
 114 .forumpost .subject {
 115     font-weight: bold;
 116 }
 117
 118 // Override hardcoded forum modules styling
 119 .forumsearch input[type=text] {
 120      margin-bottom: 0 !important;
 121 }
 122
 123 #page-mod-forum-discuss .discussioncontrols {
 124     width: auto;
 125     margin: 0;
 126 }
 127
 128 #page-footer {
 129     border-top: 2px solid $table-border-color;
 130 }
 131
 132 .maincalendar .calendarmonth td,.maincalendar .calendarmonth th {
 133     border: 1px dotted $table-border-color;
 134 }
 135
 136 .path-grade-report-grader h1 {
 137     text-align: inherit;
 138 }
 139
 140 #page-mod-chat-gui_basic input#message {
 141     max-width: 100%;
 142 }
 143
 144 #page-mod-data-view #singleimage {
 145     width: auto;
 146 }
 147
 148 .path-mod-data form {
 149     margin-top: 10px;
 150 }
 151
 152 .template_heading {
 153     margin-top: 10px;
 154 }
 155
 156 .breadcrumb-button {
 157     float: right;
 158     margin-top: 4px;
 159 }
 160
 161 .breadcrumb-button .singlebutton {
 162     float: left;
 163     margin-left: 4px;
 164 }
 165
 166 .navbar-fixed-top,
 167 .navbar-fixed-bottom {
 168     z-index: 4030;
 169 }
 170
 171 .ie .row-fluid .desktop-first-column {
 172     margin-left: 0;
 173 }
 174 .langmenu form {
 175     margin: 0;
 176 }
 177 .container-fluid {
 178     max-width: 1680px;
 179     margin: 0 auto;
 180 }
 181 // contributed by Paul Hibbitts, see http://msdn.microsoft@mixin com/en-us/library/ie/jj583807(v=vs.85).aspx
 182 canvas {
 183     -ms-touch-action: auto;
 184 }
 185
 186 div#dock {
 187     display: none;
 188 }
 189
 190 // Choice module
 191
 192 .path-mod-choice {
 193     .horizontal  .choices {
 194         margin: 0;
 195         .option {
 196             display: inline-block;
 197             padding: 10px;
 198         }
 199     }
 200     .results .data {
 201         white-space: normal;
 202     }
 203 }
 204
 205 // Lesson module
 206
 207 .path-mod-lesson .firstpageoptions {
 208     margin: auto;
 209     min-width: 280px;
 210     width: 60%;
 211 }
 212
 213 .path-mod-lesson .centerpadded {
 214     padding: 5px;
 215     text-align: center;
 216 }
 217
 218 .path-mod-wiki .wiki_headingtitle,
 219 .path-mod-wiki .midpad,
 220 .path-mod-wiki .wiki_headingtime {
 221     text-align: inherit;
 222 }
 223
 224 .path-mod-wiki .wiki_contentbox {
 225     width: 100%;
 226 }
 227
 228 // Dropdown styling.
 229 .dropdown-menu {
 230     > li > a {
 231         padding: 3px 20px 3px 8px;
 232     }
 233 }
 234
 235 // Survey module
 236
 237 .path-mod-survey {
 238     .surveytable {
 239       > tbody > tr:nth-of-type(odd) {background-color: $table-bg;}
 240       > tbody > tr:nth-of-type(even) {background-color: $table-bg-accent;}
 241         .rblock label {text-align: center;}
 242     }
 243     .resultgraph, .reportsummary, .studentreport, .reportbuttons, .centerpara {
 244         text-align:center;
 245     }
 246 }
 247
 248 .nav .caret {
 249     margin-left: 4px;
 250 }
 251
 252 // Dividers
 253 .nav {
 254     .divider {
 255         overflow: hidden;
 256         width: 0;
 257   //      height: $navbarHeight;
 258   //      border-left: 1px solid $navbarBackground;
 259    //     border-right: 1px solid $navbarBackgroundHighlight;
 260     }
 261 }
 262 //.navbar-inverse {
 263 //    .nav {
 264    //     .divider {
 265        //     border-left-color: $navbarInverseBackground;
 266        //     border-right-color: lighten($navbarInverseBackground, 25%);
 267       //  }
 268  //   }
 269 //}
 270 .dropdown-menu {
 271     .divider {
 272         width: auto;
 273         height: 1px;
 274         border-left: 0 none;
 275         border-right: 0 none;
 276     }
 277 }
 278
 279 // Usermenu
 280 .usermenu {
 281     .login {
 282         line-height: 2.25rem;
 283         a {
 284             color: $link-color;
 285             &:hover,
 286             &:focus {
 287                 color: $link-hover-color;
 288                 text-decoration: underline;
 289             }
 290         }
 291     }
 292     .moodle-actionmenu {
 293
 294         .toggle-display {
 295             display: block;
 296             opacity: 1;
 297             color: $dropdown-link-color;
 298             line-height: 40px;
 299             height: 40px;
 300             &:hover {
 301                 color: $dropdown-link-hover-color;
 302             }
 303
 304             .userbutton {
 305                 height: 40px;
 306                 line-height: 40px;
 307                 .avatars{
 308                     display: inline-block;
 309                     height: 36px;
 310                     width: 36px;
 311                     vertical-align: middle;
 312                     margin-right: 6px;
 313                     margin-left: 6px;
 314
 315                     .avatar,
 316                     img {
 317                         display: block;
 318                     }
 319                 }
 320                 .usertext {
 321                     display: inline-block;
 322                     vertical-align: middle;
 323                     line-height: 1em;
 324                     color: inherit;
 325                     .meta,
 326                     .role {
 327                         display: block;
 328                         font-size: 12px;
 329                         .value {
 330                             font-weight: bold;
 331                         }
 332                     }
 333                     .role {
 334                         font-weight: bold;
 335                     }
 336
 337                 }
 338
 339             }
 340
 341             // Hide caret when JS is disabled.
 342             .caret {
 343                 display: none;
 344             }
 345         }
 346
 347
 348     }
 349 }
 350 @include media-breakpoint-down(sm) {
 351     .usertext {
 352         display: none;
 353     }
 354 }
 355 .jsenabled {
 356     .usermenu {
 357         .moodle-actionmenu {
 358             .toggle-display {
 359                 display: block;
 360
 361                 &.textmenu {
 362                     padding-left: 8px;
 363                     padding-right: 8px;
 364                 }
 365
 366                 // Show caret when JS is enabled.
 367                 .caret {
 368                     display: inline-block;
 369                     position: relative;
 370                     top: 9px;
 371                 }
 372             }
 373
 374             > .menubar {
 375                 display: block;
 376                 margin: 0px;
 377             }
 378             > .menu {
 379                 min-width: 160px;
 380                 .filler {
 381                     display: block;
 382                     @include nav-divider();
 383                 }
 384             }
 385
 386             &.show {
 387                 background-color: $dropdown-link-active-bg;
 388                 .menu {
 389                     padding: 5px 0;
 390                     margin: 2px 0 0;
 391                     background-clip: padding-box;
 392                     &:before {
 393                         content: '';
 394                         display: inline-block;
 395                         border-left:   7px solid transparent;
 396                         border-right:  7px solid transparent;
 397                         border-bottom: 7px solid #ccc;
 398                         border-bottom-color: $dropdown-border-color;
 399                         position: absolute;
 400                         top: -7px;
 401                     }
 402                     &:after {
 403                         content: '';
 404                         display: inline-block;
 405                         border-left:   6px solid transparent;
 406                         border-right:  6px solid transparent;
 407                         border-bottom: 6px solid $dropdown-bg;
 408                         position: absolute;
 409                         top: -6px;
 410                     }
 411
 412                     a {
 413                         border-radius: 0;
 414
 415                         &:focus {
 416                             text-decoration: none;
 417                         }
 418                         &:hover {
 419                             text-decoration: none;
 420                             @include gradient-y($dropdown-link-hover-bg, darken($dropdown-link-hover-bg, 5%));
 421                         }
 422                     }
 423                     &.align-tr-br {
 424                         margin-top: 2px;
 425                     }
 426                     @include box-shadow (0 5px 10px rgba(0, 0, 0, 0.2));
 427                 }
 428                 &:hover .toggle-display {}
 429             }
 430         }
 431     }
 432 }
 433
 434 .usermenu {
 435     float: right;
 436     > .moodle-actionmenu {
 437         > .menu {
 438             &:before {
 439                 right: 9px;
 440             }
 441             &:after {
 442                 right: 10px;
 443             }
 444         }
 445         > .menubar li a {
 446             text-align: right;
 447         }
 448     }
 449 }
 450 &.userloggedinas .usermenu .userbutton .avatars {
 451     .avatar {
 452         &.current {
 453             left: 16px;
 454         }
 455     }
 456 }
 457
 458
 459 .userloggedinas .usermenu .userbutton .avatars {
 460     .avatar {
 461         &.current {
 462             position: relative;
 463             top: 4px;
 464             left: 4px;
 465             width: 20px;
 466             height: 20px;
 467             margin-top: 11px;
 468             margin-bottom: -34px;
 469             border: 1px solid #fff;
 470             border-radius: 50%;
 471             box-shadow: -2px -2px 16px rgba(0,0,0,0.25);
 472         }
 473         img {
 474             width: inherit;
 475             height: inherit;
 476         }
 477         overflow: hidden;
 478     }
 479 }
 480
 481 // Quiz module
 482
 483 // Question navigation block.
 484 .path-mod-quiz #mod_quiz_navblock {
 485     .qnbutton {
 486         text-decoration: none;
 487         font-size: 14px;
 488         line-height: 20px;
 489         font-weight: normal;
 490         background-color: $body-color;
 491         background-image: none;
 492         height: 40px;
 493         width: 30px;
 494         border-radius: 3px;
 495         border: 0;
 496         overflow: visible;
 497         margin: 0 6px 6px 0;
 498     }
 499     span.qnbutton {
 500         cursor: default;
 501         background-color: $input-bg-disabled;
 502         color: $gray;
 503     }
 504     a.qnbutton:hover,
 505     a.qnbutton:active,
 506     a.qnbutton:focus {
 507         text-decoration: underline;
 508     }
 509
 510     .qnbutton .thispageholder {
 511         border: 1px solid;
 512         border-radius: 3px;
 513         z-index: 1;
 514     }
 515     .qnbutton.thispage .thispageholder {
 516         border-width: 3px;
 517     }
 518     .allquestionsononepage .qnbutton.thispage .thispageholder {
 519         border-width: 1px;
 520     }
 521
 522     .qnbutton.flagged .thispageholder {
 523         background: transparent url([[pix:theme|mod/quiz/flag-on]]) 15px 0px no-repeat;
 524     }
 525
 526     .qnbutton .trafficlight {
 527         border: 0;
 528         background: $body-color none center/10px no-repeat scroll;
 529         height: 20px;
 530         margin-top: 20px;
 531         border-radius: 0 0 3px 3px;
 532     }
 533
 534     .qnbutton.notyetanswered .trafficlight,
 535     .qnbutton.invalidanswer .trafficlight {
 536         background-color: $body-color;
 537     }
 538     .qnbutton.invalidanswer .trafficlight {
 539         background-image: url([[pix:theme|mod/quiz/warningtriangle]]);
 540     }
 541     .qnbutton.correct .trafficlight {
 542         background-image: url([[pix:theme|mod/quiz/checkmark]]);
 543         background-color: $state-success-text;
 544     }
 545     .qnbutton.blocked .trafficlight {
 546         background-image: url([[pix:core|t/locked]]);
 547         background-color: $input-bg-disabled;
 548     }
 549     .qnbutton.notanswered .trafficlight,
 550     .qnbutton.incorrect .trafficlight {
 551         background-color: $state-danger-text;
 552     }
 553     .qnbutton.partiallycorrect .trafficlight {
 554         background-image: url([[pix:theme|mod/quiz/whitecircle]]);
 555         background-color: $state-warning-text;
 556     }
 557     .qnbutton.complete .trafficlight,
 558     .qnbutton.answersaved .trafficlight,
 559     .qnbutton.requiresgrading .trafficlight {
 560         background-color: $gray-light;
 561     }
 562 }
 563
 564 /**
 565  * Assign.
 566  */
 567 .path-mod-assign [data-region="grade-actions-panel"] [data-region="grade-actions"] .collapse-buttons {
 568     top: auto;
 569 }
 570 .path-mod-assign [data-region="grade-panel"] h3 {
 571     margin: 10px 0;
 572     line-height: 40px;
 573 }
 574 .path-mod-assign [data-region="grading-navigation"] {
 575     padding: 6px;
 576 }
 577 .path-mod-assign [data-region="grade-actions"] {
 578     padding: 10px;
 579 }
 580 .path-mod-assign [data-region="user-info"] .img-rounded {
 581     margin-top: 0;
 582 }
 583 .path-mod-assign [data-region="grading-navigation-panel"] {
 584     height: 85px;
 585 }
 586 .path-mod-assign [data-region="grading-navigation"] [data-region="input-field"] input {
 587     width: auto;
 588     display: inline-block;
 589 }
 590
 591 /**
 592  * Assign feedback.
 593  */
 594 .assignfeedback_editpdf_widget * {
 595     box-sizing: content-box;
 596 }
 597 .assignfeedback_editpdf_widget button {
 598     box-sizing: border-box;
 599 }
 600 .assignfeedback_editpdf_widget .commentcolourbutton img {
 601     border-width: 0;
 602 }
 603 .assignfeedback_editpdf_widget .label {
 604     @extend .tag;
 605     @extend .tag-info;
 606 }
 607
 608 .assignfeedback_editpdf_menu {
 609     padding: 0;
 610 }