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;

  }

}