PageRenderTime 27ms CodeModel.GetById 18ms RepoModel.GetById 0ms app.codeStats 0ms

/ajax/libs/jQuery.mmenu/4.3.2/css/jquery.mmenu.oncanvas.css

https://gitlab.com/Mirros/cdnjs
CSS | 217 lines | 204 code | 10 blank | 3 comment | 0 complexity | 06e12dee5f342ddf8d51c2477f35d244 MD5 | raw file
  1. /*
  2. jQuery.mmenu panels CSS
  3. */
  4. .mm-menu.mm-horizontal > .mm-panel {
  5. -webkit-transition: left 0.4s ease;
  6. -moz-transition: left 0.4s ease;
  7. -ms-transition: left 0.4s ease;
  8. -o-transition: left 0.4s ease;
  9. transition: left 0.4s ease; }
  10. .mm-menu .mm-hidden {
  11. display: none; }
  12. .mm-wrapper {
  13. overflow-x: hidden;
  14. position: relative; }
  15. .mm-menu {
  16. background: inherit;
  17. display: block;
  18. overflow: hidden;
  19. width: 100%;
  20. height: 100%;
  21. padding: 0;
  22. position: absolute;
  23. left: 0;
  24. top: 0;
  25. z-index: 0; }
  26. .mm-menu > .mm-panel {
  27. -webkit-box-sizing: border-box;
  28. -moz-box-sizing: border-box;
  29. -ms-box-sizing: border-box;
  30. -o-box-sizing: border-box;
  31. box-sizing: border-box;
  32. background: inherit;
  33. -webkit-overflow-scrolling: touch;
  34. overflow: scroll;
  35. overflow-x: hidden;
  36. overflow-y: auto;
  37. width: 100%;
  38. height: 100%;
  39. padding: 20px;
  40. position: absolute;
  41. top: 0;
  42. left: 100%;
  43. z-index: 0; }
  44. .mm-menu > .mm-panel.mm-opened {
  45. left: 0%; }
  46. .mm-menu > .mm-panel.mm-subopened {
  47. left: -40%; }
  48. .mm-menu > .mm-panel.mm-highest {
  49. z-index: 1; }
  50. .mm-menu .mm-list {
  51. padding: 20px 0; }
  52. .mm-menu > .mm-list {
  53. padding: 20px 0 40px 0; }
  54. .mm-panel > .mm-list {
  55. margin-left: -20px;
  56. margin-right: -20px; }
  57. .mm-panel > .mm-list:first-child {
  58. padding-top: 0; }
  59. .mm-list,
  60. .mm-list > li {
  61. list-style: none;
  62. display: block;
  63. padding: 0;
  64. margin: 0; }
  65. .mm-list {
  66. font: inherit;
  67. font-size: 14px; }
  68. .mm-list a,
  69. .mm-list a:hover {
  70. text-decoration: none; }
  71. .mm-list > li {
  72. position: relative; }
  73. .mm-list > li > a,
  74. .mm-list > li > span {
  75. text-overflow: ellipsis;
  76. white-space: nowrap;
  77. overflow: hidden;
  78. color: inherit;
  79. line-height: 20px;
  80. display: block;
  81. padding: 10px 10px 10px 20px;
  82. margin: 0; }
  83. .mm-list > li:not(.mm-subtitle):not(.mm-label):not(.mm-search):not(.mm-noresults):after {
  84. content: '';
  85. border-bottom-width: 1px;
  86. border-bottom-style: solid;
  87. display: block;
  88. width: 100%;
  89. position: absolute;
  90. bottom: 0;
  91. left: 0; }
  92. .mm-list > li:not(.mm-subtitle):not(.mm-label):not(.mm-search):not(.mm-noresults):after {
  93. width: auto;
  94. margin-left: 20px;
  95. position: relative;
  96. left: auto; }
  97. .mm-list a.mm-subopen {
  98. width: 40px;
  99. height: 100%;
  100. padding: 0;
  101. position: absolute;
  102. right: 0;
  103. top: 0;
  104. z-index: 2; }
  105. .mm-list a.mm-subopen:before {
  106. content: '';
  107. border-left-width: 1px;
  108. border-left-style: solid;
  109. display: block;
  110. height: 100%;
  111. position: absolute;
  112. left: 0;
  113. top: 0; }
  114. .mm-list a.mm-subopen.mm-fullsubopen {
  115. width: 100%; }
  116. .mm-list a.mm-subopen.mm-fullsubopen:before {
  117. border-left: none; }
  118. .mm-list a.mm-subopen + a,
  119. .mm-list a.mm-subopen + span {
  120. padding-right: 5px;
  121. margin-right: 40px; }
  122. .mm-list > li.mm-selected > a.mm-subopen {
  123. background: transparent; }
  124. .mm-list > li.mm-selected > a.mm-fullsubopen + a,
  125. .mm-list > li.mm-selected > a.mm-fullsubopen + span {
  126. padding-right: 45px;
  127. margin-right: 0; }
  128. .mm-list a.mm-subclose {
  129. text-indent: 20px;
  130. padding-top: 30px;
  131. margin-top: -20px; }
  132. .mm-list > li.mm-label {
  133. text-overflow: ellipsis;
  134. white-space: nowrap;
  135. overflow: hidden;
  136. font-size: 10px;
  137. text-transform: uppercase;
  138. text-indent: 20px;
  139. line-height: 25px;
  140. padding-right: 5px; }
  141. .mm-list > li.mm-spacer {
  142. padding-top: 40px; }
  143. .mm-list > li.mm-spacer.mm-label {
  144. padding-top: 25px; }
  145. .mm-list a.mm-subopen:after,
  146. .mm-list a.mm-subclose:before {
  147. content: '';
  148. border: 2px solid transparent;
  149. display: block;
  150. width: 7px;
  151. height: 7px;
  152. margin-bottom: -5px;
  153. position: absolute;
  154. bottom: 50%;
  155. -webkit-transform: rotate(-45deg);
  156. -moz-transform: rotate(-45deg);
  157. -ms-transform: rotate(-45deg);
  158. -o-transform: rotate(-45deg);
  159. transform: rotate(-45deg); }
  160. .mm-list a.mm-subopen:after {
  161. border-top: none;
  162. border-left: none;
  163. right: 18px; }
  164. .mm-list a.mm-subclose:before {
  165. border-right: none;
  166. border-bottom: none;
  167. margin-bottom: -15px;
  168. left: 22px; }
  169. .mm-menu.mm-vertical .mm-list .mm-panel {
  170. display: none;
  171. padding: 10px 0 10px 10px; }
  172. .mm-menu.mm-vertical .mm-list .mm-panel li:last-child:after {
  173. border-color: transparent; }
  174. .mm-menu.mm-vertical .mm-list li.mm-opened > .mm-panel {
  175. display: block; }
  176. .mm-menu.mm-vertical .mm-list > li.mm-opened > a.mm-subopen {
  177. height: 40px; }
  178. .mm-menu.mm-vertical .mm-list > li.mm-opened > a.mm-subopen:after {
  179. -webkit-transform: rotate(45deg);
  180. -moz-transform: rotate(45deg);
  181. -ms-transform: rotate(45deg);
  182. -o-transform: rotate(45deg);
  183. transform: rotate(45deg);
  184. top: 16px;
  185. right: 16px; }
  186. html.mm-opened .mm-page {
  187. box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); }
  188. .mm-ismenu {
  189. background: #333333;
  190. color: rgba(255, 255, 255, 0.6); }
  191. .mm-menu .mm-list > li:after {
  192. border-color: rgba(0, 0, 0, 0.15); }
  193. .mm-menu .mm-list > li > a.mm-subclose {
  194. background: rgba(0, 0, 0, 0.1);
  195. color: rgba(255, 255, 255, 0.3); }
  196. .mm-menu .mm-list > li > a.mm-subopen:after, .mm-menu .mm-list > li > a.mm-subclose:before {
  197. border-color: rgba(255, 255, 255, 0.3); }
  198. .mm-menu .mm-list > li > a.mm-subopen:before {
  199. border-color: rgba(0, 0, 0, 0.15); }
  200. .mm-menu .mm-list > li.mm-selected > a:not(.mm-subopen),
  201. .mm-menu .mm-list > li.mm-selected > span {
  202. background: rgba(0, 0, 0, 0.1); }
  203. .mm-menu .mm-list > li.mm-label {
  204. background: rgba(255, 255, 255, 0.05); }
  205. .mm-menu.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
  206. .mm-menu.mm-vertical .mm-list li.mm-opened > ul {
  207. background: rgba(255, 255, 255, 0.05); }