Proyectos de Subversion Moodle

// The dropdown wrapper (`<div>`)
.dropup,
.dropright,
.dropdown,
.dropleft {
  position: relative;
}

.dropdown-toggle {
  white-space: nowrap;

  // Generate the caret automatically
  @include caret();
}

.tertiary-navigation .tertiary-navigation-selector .dropdown-toggle::after {
  margin-left: 2px;
  border-top: 5px solid;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
}

// The dropdown menu
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: auto;
  max-width: 280px;
  z-index: $zindex-fixed + 200;
  display: none; // none by default, but block on "open" of the menu
  float: left;
  min-width: $dropdown-min-width;
  padding: $dropdown-padding-y $dropdown-padding-x;
  margin: $dropdown-spacer 0 0; // override default ul
  @include font-size($dropdown-font-size);
  color: $dropdown-color;
  text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
  list-style: none;
  background-color: $dropdown-bg;
  background-clip: padding-box;
  @include border-radius($dropdown-border-radius);
  box-shadow: 0 1px 1px rgba(0,0,0,0.11), 0 2px 2px rgba(0,0,0,0.11), 0 4px 4px rgba(0,0,0,0.11), 0 8px 8px rgba(0,0,0,0.11), 0 16px 16px rgba(0,0,0,0.11), 0 32px 32px rgba(0,0,0,0.11);
  
  .rui-course-card & {
    max-width: 195px;
  }

  .border-top, .border-bottom {
    border-color: $dropdown-border-color!important;
  }

  .block-controls & {
    padding: 5px;
    margin: 2px;
  }

  .theme-dark & {
    color: $dm-dropdown-color;
    background-color: $dm-dropdown-bg;
    border: 1px solid $dm-border-color;
  }

  li {
    margin-bottom: .35rem;

    &:last-of-type {
      margin-bottom: 0;
    }
  }
}

@each $breakpoint in map-keys($grid-breakpoints) {
  @include media-breakpoint-up($breakpoint) {
    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

    .dropdown-menu#{$infix}-left {
      right: auto;
      left: 0;
    }

    .dropdown-menu#{$infix}-right {
      right: 0;
      left: auto;
    }
  }
}

// Allow for dropdowns to go bottom up (aka, dropup-menu)
// Just add .dropup after the standard .dropdown class and you're set.
.dropup {
  .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: $dropdown-spacer;
  }

  .dropdown-toggle {
    @include caret(up);
  }
}

.dropright {
  .dropdown-menu {
    top: 0;
    right: auto;
    left: 100%;
    margin-top: 0;
    margin-left: $dropdown-spacer;
  }

  .dropdown-toggle {
    @include caret(right);

    &::after {
      vertical-align: 0;
    }
  }
}

.dropleft {
  .dropdown-menu {
    top: 0;
    right: 100%;
    left: auto;
    margin-top: 0;
    margin-right: $dropdown-spacer;
  }

  .dropdown-toggle {
    @include caret(left);

    &::before {
      vertical-align: 0;
    }
  }
}

// When enabled Popper.js, reset basic dropdown position
// stylelint-disable-next-line no-duplicate-selectors
.dropdown-menu {
  &[x-placement^="top"],
  &[x-placement^="right"],
  &[x-placement^="bottom"],
  &[x-placement^="left"] {
    right: auto;
    bottom: auto;
  }
}

// Dividers (basically an `<hr>`) within the dropdown
.dropdown-divider {
  @include nav-divider($dropdown-divider-bg, $dropdown-divider-margin-y, true);

  .theme-dark & {
    @include nav-divider($dm-dropdown-divider-bg, $dropdown-divider-margin-y, true);
  }

  &+.dropdown-divider {
    display: none;
  }
}

// Links, buttons, and more within the dropdown menu
//
// `<button>`-specific styles are denoted with `// For <button>s`
input.dropdown-item {
  background-color: transparent;
}

.dropdown-menu a,
.dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 290px;

  padding: $dropdown-item-padding-y $dropdown-item-padding-x;
  margin-bottom: 2px;
  clear: both;

  font-size: $font-size-xs;
  font-weight: $font-weight-medium;
  color: $dropdown-color;

  text-align: inherit; // For `<button>`s
  text-decoration: none!important;
  /*word-break: normal;
  white-space: break-spaces;*/

  white-space: normal;

  border: 0; // For `<button>`s
  border-radius: $dropdown-border-radius - 2px;

  background-color: transparent;
  background-blend-mode:hard-light;

  // Edwiser Report Plugin
  input[type="text"] {
    color: $dropdown-color;

    .theme-dark & {
      color: $dm-dropdown-color;
    }
  }

  &:after {
    display: none;
  }

  &:last-child {
    margin-bottom: 0;
  }

  &[disabled=disabled] {
    opacity: .5;
    background-color: $dropdown-link-hover-bg;
  }

  .rui-course-card & {
    min-width: 180px;
  }

  .theme-dark & {
    color: $dm-dropdown-color;
  }

  &.ml-4 {
    width: calc(100% - 1.875rem);
  }

  &:not(.hidden) {
    display: flex;
  }

  .icon {
    margin-right: 7px;
    width: 16px;
    height: 16px;
    line-height: 1.3;
    color: inherit;
    opacity: .6;
  }

  img.icon {
    filter: invert(1);
  }

  .rui-icon {
    line-height: 1;
  }

  // Prevent dropdown overflow if there's no padding
  // See https://github.com/twbs/bootstrap/pull/27703
  @if $dropdown-padding-y==0 {
    &:first-child {
      @include border-top-radius($dropdown-inner-border-radius);
    }

    &:last-child {
      @include border-bottom-radius($dropdown-inner-border-radius);
    }
  }

  &.hidden {
    display: none;
  }

  &.active,
  &:hover {
    color: $dropdown-link-hover-color;
    text-decoration: none;
    background-color: $dropdown-link-hover-bg;

    .theme-dark & {
      color: $dm-dropdown-link-hover-color;
      background-color: $dm-dropdown-link-hover-bg;
    }
  
  }

  &.active,
  &:active {
    a {
      color: $dropdown-link-active-color;
      text-decoration: none;
      @include gradient-bg($dropdown-link-active-bg);
    }

    .icon {
      filter: invert(1);
    }
  }

  &:after {
    display: none;
  }

  &[aria-current="true"] {
    position: relative;
    display: flex;
    align-items: center;

    color: $dropdown-link-active-color;
    text-decoration: none;
    @include gradient-bg($dropdown-link-active-bg);

    margin-bottom: .15rem;

    .theme-dark & {
      color: $dm-dropdown-link-active-color;
      @include gradient-bg($dm-dropdown-link-active-bg);
    }
  }

  &.disabled,
  &:disabled {
    a {
      opacity: .5;
      color: $dropdown-link-disabled-color;
      pointer-events: none;
      background-color: transparent;

      // Remove CSS gradients if they're enabled
      @if $enable-gradients {
        background-image: none;
      }

      .theme-dark & {
        color: $dm-dropdown-link-disabled-color;
      }
    }
  }

}

//Atto Editor mod
.dropdown-menu .atto_menuentry {
  a {
    display: block;
    width: 100%; // For `<button>`s

    margin-bottom: 0.25rem;
    padding: $dropdown-item-padding-y $dropdown-item-padding-x;
    clear: both;

    font-size: $font-size-md;
    font-weight: $font-weight-medium;
    color: $dropdown-color;

    text-align: inherit; // For `<button>`s
    text-decoration: if($link-decoration==none, null, none);
    white-space: nowrap; // prevent links from randomly breaking onto new lines

    border: 0; // For `<button>`s
    border-radius: $btn-border-radius;

    .theme-dark & {
      color: $dm-dropdown-color;
    }

    &:hover {
      color: $dropdown-link-hover-color;
      text-decoration: none;
      background-color: $dropdown-link-hover-bg;

      .theme-dark & {
        color: $dm-dropdown-link-hover-color;
        background-color: $dm-dropdown-link-hover-bg;
      }
    }
  }

}

.dropdown-menu.show {
  display: block;
  min-height: max-content;
  width: max-content;
  max-width: 300px;
}

.dir-rtl .usermenu {
  .dropdown-menu.show {
    display: block;
    left: 30px!important;
  }  
}

// Dropdown section headers
.dropdown-header {
  display: block;
  padding: .35rem 1rem;
  margin: 0 -5px 5px; // for use with heading elements
  @include font-size($font-size-xs);
  font-weight: $font-weight-medium;
  color: $dropdown-header-color;
  white-space: nowrap; // as with > li > a

  border-bottom: 1px solid $dropdown-border-color;

  .theme-dark & {
    color: $dm-dropdown-header-color;
    border-bottom: 1px solid $dm-dropdown-border-color;
  }
}

// Dropdown text
.dropdown {
  .dropdown-item-text {
    max-width: calc(100% - 30px);
    @extend .text-truncate;
  }

}



// Action menu trigger - settings button
.dropdown-btn {

  @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
  font-weight: $font-weight-medium;
  color: $body-color;

  @include transition($btn-transition);

  .action-menu-trigger &,
  #category-listing & {
    padding: 5px;

    &:after {
      display: none;
    }
  }

  .theme-dark & {
    color: $dm-gray-900;
  }

  .main-nav-container & {
    background-color: transparent;
    color: $body-color-secondary;

    .theme-dark & {
      background-color: transparent;
      color: $dm-body-color-secondary;
    }
  }

  &:hover {
    background-color: $gray-100;
    color: $body-color;
    text-decoration: none;

    .theme-dark & {
      background-color: $dm-gray-300;
      color: $dm-body-color;
    }
  }

  .icon {
    margin: 0;
    width: 24px;
    height: 24px;
    line-height: 24px;

    #course-category-listings & {
      display: inline-flex;
      align-items: center;

      width: 16px;
      height: 16px;
    }
  }
}

// The dropdown menu
.dropdown-user {
  width: 300px;
  max-width: 300px;

  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;

  font-size: 1rem; //16px
  font-weight: $font-weight-medium;
  color: $dropdown-text;

  .theme-dark & {
    color: $dm-dropdown-text;
  }

  .meta.viewingas,
  .meta.role {
    position: relative;
    display: block;
    background-color: $green-200;
    padding: 9px 14px;
    margin: 5px 0 0;

    border-radius: $btn-border-radius;

    font-size: $font-size-xs;
    line-height: 1.3;
    color: $green-800;
    text-align: center;
  }
}

// .meta.loginfailures {
//   padding: 3px 8px;
//   background-color: $yellow-100;
//   border-radius: $btn-border-radius;

//   font-size: $font-size-xs;
//   white-space: normal;
//   line-height: 1.3;
//   color: $yellow-800;
// }

.dropdown-user-meta:not(:empty) {
  margin: 5px 0 0;
  white-space: normal;

  .badge-xs:empty {
    display: none;
  }
}

.dropdown-user-nick {
  margin: 15px 0 5px;
  white-space: normal;
  font-size: $font-size-xs;
  line-height: 1;
  color: rgba($dropdown-text, .8);
}

.dropdown-user-mail {
  display: block;
  width: 100%;

  font-size: 0.75rem;
  font-weight: $font-weight-normal;
  color: rgba($dropdown-text, .8);

  .theme-dark & {
    color: rgba($dm-dropdown-text, .8);
  }
}

.dropdown-user-wrapper {
  padding: 10px 12px;
  display: flex;
  flex-wrap: wrap;
}

.rui-fullname {
  width: 100%;
  font-size: $font-size-sm;
  white-space: normal;
  word-break: break-all;
}

.dropdown-item.aabtn.menu-action {
  .dropdown-item--text {
    display: none;
  }
}

.dropdown-item--text {
  max-width: 200px;
}

// Tool Lp Competencies
.dropdown {
  .tool-lp-menu-item {
    padding: 0;
    
    a {
      width: 100%;
      min-width: 200px;
      font-weight: $font-weight-medium;
      color: $dropdown-text;

      &:hover {
        text-decoration: none;
      }

      .icon {
        padding: 0;
      }
    }
  }
}

.dropdown-menu,
.collapsecolumndropdown {
  .text-muted {
    color: $dm-body-color-light;
  }
}


// Moodle 4.3
.choicelist {
  flex-wrap: wrap;
}

.option-selected-bg {
  background-color: $dropdown-link-active-bg;

  .theme-dark & {
    background-color: $dm-dropdown-link-active-bg;
  }
}

.option-description {
  color: rgba($dropdown-text, .8);

  .theme-dark & {
    color: rgba($dm-dropdown-text, .8);  
  }
}

.dropdown-item.editing_delete {
  background-color: #4c2623;

  span { 
    color: #ff887f!important;
  }

  &:hover {
    background-color: #5d2b28!important;
  }

  .icon {
    color: #ff887f;
    opacity: 1;
  }

  img {
    mix-blend-mode: plus-lighter;
  }

}

.groupmode-icon-info {
  font-size: $font-size-xs;
}

.gradesearchdropdown {
  .w-100.p-3 {
    padding: $dropdown-padding-x $dropdown-padding-y!important;
  }
}