sub-arrow.less 812 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. //the arrow connecting "LI" to ".SUBMENU"
  2. //-li > .arrow
  3. .nav-list li {
  4. > .arrow {
  5. display: none;
  6. position: absolute;
  7. top: 8px;
  8. right: 1px;
  9. z-index: @zindex-submenu + 1;
  10. &:before, &:after {
  11. border: 1px solid transparent;
  12. display: block;
  13. height: 0;
  14. width: 0;
  15. position: absolute;
  16. left: -20px;
  17. top: 0;
  18. right: auto;
  19. bottom: auto;
  20. content: "";
  21. border-width: 10px;
  22. }
  23. &:before {
  24. z-index: 1;//above .submenu
  25. left: -21px;
  26. }
  27. &:after {
  28. z-index: 2;//above .arrow:before
  29. }
  30. }
  31. //don't display when there's no submenu
  32. &:hover > a + .arrow , &.hover-show > a + .arrow {
  33. display: none;
  34. }
  35. @media only screen and (min-width: @screen-hover-menu) {
  36. &.hover:hover > a.dropdown-toggle + .arrow,
  37. &.hover.hover-show > a.dropdown-toggle + .arrow
  38. {
  39. display: block;
  40. }
  41. }
  42. }