decko-commons/decko

View on GitHub
mod/format/assets/style/menu.scss

Summary

Maintainability
Test Coverage


/*---------- Card menu ------------*/

.card-menu {
  position: absolute;
  right: 8px;
  top: 5px;
  width: auto;
}

.d0-card-content, .titled-view > .d0-card-header {
  > .card-menu {
    top: 0;
  }
}

.d0-card-content, .labeled-view {
  .card-menu i {
    font-size: 1.2em
  }
}

.modal-menu, .overlay-menu {
  a {
    color: $text-muted !important;
    opacity: 0.6 !important;
    &:hover {
      opacity: 1 !important;
    }
  }
}


@include media-breakpoint-up(xs) {
  // Hover over these, and only the card menus that are immediate children will appear
  .card-slot > .d0-card-frame > .d0-card-header,
  .card-slot > .d0-card-header,
  .card-slot.labeled-view,
  .card-slot,
  .card > .card-body,
  .card > .card-header {
    > .card-menu._show-on-hover > a {
      display: none;
    }
    &:hover > .card-menu._show-on-hover > a {
      display: inline-block;
    }
  }

  // Hover over this one, and ANY card-menu inside will appear
  .card-menu-hoverspace {
    .card-menu._show-on-hover > a {
      display: none;
    }
    &:hover .card-menu._show-on-hover > a {
      display: inline-block;
    }
  }
}