[Summary view] [Print] [Text view]

   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
  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  .path-mod-feedback .feedback_bar_image {
  77      height: 5px; // we should remove the bar height specification in core
  78  }
  79  
  80  .forumpost {
  81      .well;
  82      padding: 6px;
  83      .header {
  84          margin-bottom: 3px;
  85      }
  86      .picture img {
  87          margin: 3px;
  88          &.userpicture {
  89              margin-left: 3px;
  90              margin-right: 10px;
  91          }
  92      }
  93      .content {
  94          .posting.fullpost {
  95              margin-top: 8px;
  96          }
  97      }
  98      .row {
  99          .topic,
 100          .content-mask,
 101          .options {
 102              margin-left: 48px;
 103          }
 104          &.side {
 105              clear: both;
 106          }
 107      }
 108  }
 109  
 110  .dir-rtl .forumpost {
 111      .picture img {
 112          &.userpicture {
 113              margin-left: 10px;
 114              margin-right: 3px;
 115          }
 116      }
 117      .row {
 118          .topic,
 119          .content-mask,
 120          .options {
 121              margin-left: 0;
 122              margin-right: 48px;
 123          }
 124      }
 125  }
 126  
 127  .forumpost .row .left {
 128      width: 48px;
 129  }
 130  
 131  .forumpost .options .commands {
 132      margin-left: 0;
 133  }
 134  
 135  .forumpost .subject {
 136      font-weight: bold;
 137  }
 138  
 139  // Override hardcoded forum modules styling
 140  .forumsearch input[type=text] {
 141       margin-bottom: 0 !important;
 142  }
 143  
 144  #page-mod-forum-discuss .discussioncontrols {
 145      width: auto;
 146      margin: 0;
 147  }
 148  
 149  #page-footer {
 150      margin-top: 1em;
 151      padding: 1em 0;
 152      border-top: 2px solid @tableBorder;
 153  }
 154  
 155  .maincalendar .calendarmonth td,.maincalendar .calendarmonth th {
 156      border: 1px dotted @tableBorder;
 157  }
 158  
 159  .path-grade-report-grader h1 {
 160      text-align: inherit;
 161  }
 162  
 163  #page-mod-chat-gui_basic input#message {
 164      max-width: 100%;
 165  }
 166  
 167  #page-mod-data-view #singleimage {
 168      width: auto;
 169  }
 170  
 171  .path-mod-data form {
 172      margin-top: 10px;
 173  }
 174  
 175  .template_heading {
 176      margin-top: 10px;
 177  }
 178  
 179  .breadcrumb-button {
 180      float: right;
 181      margin-top: 4px;
 182  }
 183  
 184  .breadcrumb-button .singlebutton {
 185      float: left;
 186      margin-left: 4px;
 187  }
 188  
 189  .dir-rtl {
 190      .nav-tabs > li,
 191      .nav-pills > li {
 192          float: right;
 193      }
 194  }
 195  .dir-rtl .navbar .brand {
 196      float: right;
 197  }
 198  
 199  .navbar-inverse .logininfo a {
 200      color: @navbarInverseLinkColor;
 201  }
 202  .navbar-inverse .logininfo a:hover {
 203      background-color: @navbarInverseLinkBackgroundHover; // "transparent" is default to differentiate :hover/:focus from .active
 204      color: @navbarInverseLinkColorHover;
 205  }
 206  
 207  .navbar-fixed-top,
 208  .navbar-fixed-bottom {
 209      z-index: 4030;
 210  }
 211  
 212  .dir-rtl .breadcrumb-button,
 213  .dir-rtl .navbar .btn-navbar {
 214      float: left;
 215  }
 216  
 217  .dir-rtl .breadcrumb-button .singlebutton {
 218      float: right;
 219      margin-right: 4px;
 220  }
 221  
 222  .ie .row-fluid .desktop-first-column {
 223      margin-left: 0;
 224  }
 225  .langmenu form {
 226      margin: 0;
 227  }
 228  .container-fluid {
 229      max-width: 1680px;
 230      margin: 0 auto;
 231  }
 232  // contributed by Paul Hibbitts, see http://msdn.microsoft.com/en-us/library/ie/jj583807(v=vs.85).aspx
 233  canvas {
 234      -ms-touch-action: auto;
 235  }
 236  
 237  div#dock {
 238      display: none;
 239  }
 240  
 241  .path-mod-choice {
 242      .horizontal  .choices {
 243          margin: 0;
 244          .option {
 245              display: inline-block;
 246              padding: 10px;
 247          }
 248      }
 249      .results .data {
 250          white-space: normal;
 251      }
 252  }
 253  
 254  .path-mod-lesson .firstpageoptions {
 255      margin: auto;
 256      min-width: 280px;
 257      width: 60%;
 258  }
 259  
 260  .path-mod-lesson .centerpadded {
 261      padding: 5px;
 262      text-align: center;
 263  }
 264  
 265  .path-mod-wiki .wiki_headingtitle,
 266  .path-mod-wiki .midpad,
 267  .path-mod-wiki .wiki_headingtime {
 268      text-align: inherit;
 269  }
 270  
 271  .path-mod-wiki .wiki_contentbox {
 272      width: 100%;
 273  }
 274  
 275  // Dropdown styling.
 276  .dropdown-menu {
 277      > li > a {
 278          padding: 3px 20px 3px 8px;
 279      }
 280  }
 281  .dir-rtl .dropdown-menu {
 282      > li > a {
 283          padding: 3px 8px 3px 20px;
 284      }
 285  }
 286  .dir-rtl .dropdown-submenu > .dropdown-menu {
 287    .border-radius(6px 0px 6px 6px);
 288  }
 289  
 290  
 291  // Survey module
 292  
 293  .path-mod-survey {
 294      .surveytable {
 295        > tbody > tr:nth-of-type(odd) {background-color: @tableBackground;}
 296        > tbody > tr:nth-of-type(even) {background-color: @tableBackgroundAccent;}
 297          .rblock label {text-align: center;}
 298      }
 299      .resultgraph, .reportsummary, .studentreport, .reportbuttons, .centerpara {
 300          text-align:center;
 301      }
 302  }
 303  // rtl overrides
 304  .dir-rtl {
 305      &.path-mod-forum .forumheaderlist {
 306          thead .header.lastpost {
 307              text-align: left;
 308          }
 309          .discussion {
 310              .lastpost {
 311                  text-align: left;
 312              }
 313          }
 314      }
 315  }
 316  
 317  .nav .caret {
 318      margin-left: 4px;
 319  }
 320  .dir-rtl .nav .caret {
 321      margin-right: 4px;
 322  }
 323  
 324  // Dividers
 325  .nav {
 326      .divider {
 327          overflow: hidden;
 328          width: 0;
 329          height: 40px;
 330          border-left: 1px solid #e5e5e5;
 331          border-right: 1px solid #fff;
 332      }
 333  }
 334  
 335  .dropdown-menu {
 336      .divider {
 337          width: auto;
 338          height: 1px;
 339          border-left: 0px none;
 340          border-right: 0px none;
 341      }
 342  }
 343  
 344  // Usermenu
 345  .usermenu {
 346      .login {
 347          color: @navbarText;
 348          line-height: 40px;
 349          a {
 350              color: @linkColor;
 351              &:hover,
 352              &:focus {
 353                  color: @linkColorHover;
 354                  text-decoration: underline;
 355              }
 356          }
 357      }
 358      .moodle-actionmenu {
 359  
 360          .toggle-display {
 361              display: block;
 362              opacity: 1;
 363              color: @navbarLinkColor;
 364              line-height: 40px;
 365              height: 40px;
 366              &:hover {
 367                  color: @navbarLinkColorHover;
 368              }
 369  
 370              .userbutton {
 371                  height: 40px;
 372                  line-height: 40px;
 373                  .avatars{
 374                      display: inline-block;
 375                      height: 36px;
 376                      width: 36px;
 377                      vertical-align: middle;
 378                      margin-right: 6px;
 379                      margin-left: 6px;
 380  
 381                      .avatar,
 382                      img {
 383                          display: block;
 384                      }
 385                  }
 386                  .usertext {
 387                      display: inline-block;
 388                      vertical-align: middle;
 389                      line-height: 1em;
 390                      color: inherit;
 391                      .meta,
 392                      .role {
 393                          display: block;
 394                          font-size: 12px;
 395                          .value {
 396                              font-weight: bold;
 397                          }
 398                      }
 399                      .role {
 400                          font-weight: bold;
 401                      }
 402                  }
 403              }
 404  
 405              // Hide caret when JS is disabled.
 406              .caret {
 407                  display: none;
 408              }
 409          }
 410  
 411  
 412          // A little bit of visual feedback for the action menu when Javascript is disabled.
 413          .menu {
 414              .menu-action.icon {
 415                  img {
 416                      border-radius: 0;
 417                      background: transparent;
 418                      box-shadow: none;
 419                  }
 420                  &:hover img {
 421                      background: #fff;
 422                      border-radius: 4px;
 423                      box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.125);
 424                  }
 425              }
 426          }
 427          &[data-enhanced] .menu {
 428              .menu-action.icon,
 429              .menu-action.icon:hover {
 430                  img {
 431                      border-radius: 0;
 432                      background: transparent;
 433                      box-shadow: none;
 434                  }
 435              }
 436          }
 437  
 438      }
 439  }
 440  .navbar-inverse {
 441      .usermenu {
 442          .login {
 443              color: @navbarInverseText;
 444              a {
 445                  color: @navbarInverseLinkColor;
 446                  &:hover {
 447                      color: @navbarInverseLinkColorHover;
 448                  }
 449              }
 450          }
 451          .moodle-actionmenu {
 452              .toggle-display {
 453                  color: @navbarInverseLinkColor;
 454              }
 455              .userbutton {
 456                  .usertext {
 457                      color: @navbarInverseLinkColor;
 458                      .meta {
 459                          color: @navbarInverseText;
 460                          .value {
 461                              color: @navbarInverseLinkColor;
 462                          }
 463                      }
 464                  }
 465              }
 466              &:hover {
 467                  .usertext {
 468                      color: @navbarInverseLinkColorHover;
 469                      .meta {
 470                          color: @navbarInverseText;
 471                          .value {
 472                              color: @navbarInverseLinkColorHover;
 473                          }
 474                      }
 475                  }
 476              }
 477              &[data-enhanced] .toggle-display.textmenu {
 478                  .caret {
 479                      border-top-color: @navbarInverseLinkColorHover;
 480                  }
 481              }
 482  
 483              // A little bit of visual feedback for the action menu when Javascript is disabled.
 484              .menu {
 485                  .menu-action.icon {
 486                      img {
 487                          border-radius: 0;
 488                          background: transparent;
 489                          box-shadow: none;
 490                      }
 491                      &:hover img {
 492                          background: #333;
 493                          border-radius: 4px;
 494                          box-shadow: 0px 0px 16px rgba(255, 255, 255, 1);
 495                      }
 496                  }
 497              }
 498              &[data-enhanced] .menu {
 499                  .menu-action.icon,
 500                  .menu-action.icon:hover {
 501                      img {
 502                          border-radius: 0;
 503                          background: transparent;
 504                          box-shadow: none;
 505                      }
 506                  }
 507              }
 508          }
 509      }
 510  }
 511  
 512  .jsenabled {
 513      .usermenu {
 514          .moodle-actionmenu {
 515              .toggle-display {
 516                  display: block;
 517  
 518                  &.textmenu {
 519                      padding-left: 8px;
 520                      padding-right: 8px;
 521                  }
 522  
 523                  // Show caret when JS is enabled.
 524                  .caret {
 525                      display: inline-block;
 526                      position: relative;
 527                      top: 9px;
 528                  }
 529              }
 530  
 531              > .menubar {
 532                  display: block;
 533                  margin: 0px 0px 2px 0px;
 534              }
 535              > .menu {
 536                  min-width: 160px;
 537                  .filler {
 538                      display: block;
 539                      .nav-divider();
 540                  }
 541              }
 542  
 543              &.show {
 544                  background-color: @navbarLinkBackgroundActive;
 545                  .menu {
 546                      padding: 5px 0;
 547                      margin: 2px 0 0;
 548                      background-clip: padding-box;
 549                      &:before {
 550                          content: '';
 551                          display: inline-block;
 552                          border-left:   7px solid transparent;
 553                          border-right:  7px solid transparent;
 554                          border-bottom: 7px solid #ccc;
 555                          border-bottom-color: @dropdownBorder;
 556                          position: absolute;
 557                          top: -7px;
 558                      }
 559                      &:after {
 560                          content: '';
 561                          display: inline-block;
 562                          border-left:   6px solid transparent;
 563                          border-right:  6px solid transparent;
 564                          border-bottom: 6px solid @dropdownBackground;
 565                          position: absolute;
 566                          top: -6px;
 567                      }
 568  
 569                      a {
 570                          border-radius: 0;
 571  
 572                          &:focus {
 573                              text-decoration: none;
 574                          }
 575                          &:hover {
 576                              text-decoration: none;
 577                              #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
 578                          }
 579                      }
 580                      &.align-tr-br {
 581                          margin-top: 2px;
 582                      }
 583                      .box-shadow (0 5px 10px rgba(0, 0, 0, 0.2));
 584                  }
 585                  &:hover .toggle-display {}
 586              }
 587          }
 588      }
 589      .navbar-inverse {
 590          .usermenu {
 591              .moodle-actionmenu {
 592  
 593                  &.show {
 594                      background-color: @navbarInverseLinkBackgroundActive;
 595                  }
 596              }
 597          }
 598      }
 599  }
 600  
 601  .dir-ltr {
 602      .usermenu {
 603          float: right;
 604          > .moodle-actionmenu {
 605              > .menu {
 606                  &:before {
 607                      right: 9px;
 608                  }
 609                  &:after {
 610                      right: 10px;
 611                  }
 612              }
 613              > .menubar li a {
 614                  text-align: right;
 615              }
 616          }
 617      }
 618      &.userloggedinas .usermenu .userbutton .avatars {
 619          .avatar {
 620              &.current {
 621                  left: 16px;
 622              }
 623          }
 624      }
 625  }
 626  
 627  .dir-rtl {
 628      .usermenu {
 629          float: left;
 630          > .moodle-actionmenu {
 631              > .menu {
 632                  margin-right: 0px;
 633                  &:before {
 634                      left: 9px;
 635                  }
 636                  &:after {
 637                      left: 10px;
 638                  }
 639              }
 640              > .menubar li a {
 641                  text-align: left;
 642              }
 643          }
 644      }
 645      &.userloggedinas .usermenu .userbutton .avatars {
 646          .avatar {
 647              &.current {
 648                  left: -14px;
 649              }
 650          }
 651      }
 652  }
 653  
 654  
 655  .userloggedinas .usermenu .userbutton .avatars {
 656      .avatar {
 657          &.current {
 658              position: relative;
 659              top: 4px;
 660              left: 4px;
 661              width: 20px;
 662              height: 20px;
 663              margin-top: 11px;
 664              margin-bottom: -34px;
 665              border: 1px solid #fff;
 666              border-radius: 50%;
 667              box-shadow: -2px -2px 16px rgba(0,0,0,0.25);
 668          }
 669          img {
 670              width: inherit;
 671              height: inherit;
 672          }
 673          overflow: hidden;
 674      }
 675  }