UNPKG

@syncfusion/ej2-navigations

Version:

A package of Essential JS 2 navigation components such as Tree-view, Tab, Toolbar, Context-menu, and Accordion which is used to navigate from one page to another

386 lines (377 loc) 12.7 kB
.e-contextmenu-wrapper ul .e-menu-item .e-previous::before, .e-contextmenu-container ul .e-menu-item .e-previous::before { content: "\e962"; } .e-contextmenu-wrapper ul .e-menu-item .e-caret::before, .e-contextmenu-container ul .e-menu-item .e-caret::before { content: "\e219"; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-caret::before, .e-rtl.e-contextmenu-container .e-menu-item .e-caret::before { content: "\e98f"; } .e-contextmenu-wrapper ul, .e-contextmenu-container ul { font-weight: normal; list-style-image: none; list-style-position: outside; list-style-type: none; margin: 0; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 14px; padding: 0; border: 1px solid #757575; border-radius: 0; -webkit-box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); display: none; min-width: 120px; position: absolute; } .e-contextmenu-wrapper ul.e-ul, .e-contextmenu-wrapper ul.e-ul *, .e-contextmenu-container ul.e-ul, .e-contextmenu-container ul.e-ul * { -webkit-box-sizing: border-box; box-sizing: border-box; } .e-contextmenu-wrapper ul.e-ul:focus, .e-contextmenu-wrapper ul.e-ul *:focus, .e-contextmenu-container ul.e-ul:focus, .e-contextmenu-container ul.e-ul *:focus { outline: none; } .e-contextmenu-wrapper ul.e-contextmenu, .e-contextmenu-container ul.e-contextmenu { -webkit-box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); } .e-contextmenu-wrapper ul.e-contextmenu.e-contextmenu-template .e-menu-caret-icon, .e-contextmenu-container ul.e-contextmenu.e-contextmenu-template .e-menu-caret-icon { display: -webkit-box; display: -ms-flexbox; display: flex; } .e-contextmenu-wrapper ul.e-ul, .e-contextmenu-container ul.e-ul { font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont"; } .e-contextmenu-wrapper ul .e-menu-item, .e-contextmenu-container ul .e-menu-item { cursor: pointer; position: relative; height: 36px; line-height: 36px; padding: 0 10px; } .e-contextmenu-wrapper ul .e-menu-item.e-menu-hide, .e-contextmenu-container ul .e-menu-item.e-menu-hide { display: none; } .e-contextmenu-wrapper ul .e-menu-item.e-menu-header, .e-contextmenu-container ul .e-menu-item.e-menu-header { border-bottom-style: solid; border-bottom-width: 1px; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-url, .e-contextmenu-container ul .e-menu-item .e-menu-url { text-decoration: none; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-contextmenu-container ul .e-menu-item .e-menu-icon { display: inline-block; vertical-align: middle; } .e-contextmenu-wrapper ul .e-menu-item.e-separator, .e-contextmenu-container ul .e-menu-item.e-separator { cursor: auto; line-height: normal; pointer-events: none; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-url, .e-contextmenu-container ul .e-menu-item .e-menu-url { display: inline-block; min-width: 120px; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-contextmenu-container ul .e-menu-item .e-menu-icon { font-size: 16px; line-height: 36px; margin-right: 10px; width: 1em; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { line-height: 36px; margin-left: 16px; margin-right: 0; position: absolute; right: 5px; } .e-contextmenu-wrapper ul .e-menu-item.e-menu-caret-icon, .e-contextmenu-container ul .e-menu-item.e-menu-caret-icon { padding-right: 36px; } .e-contextmenu-wrapper ul .e-menu-item.e-separator, .e-contextmenu-container ul .e-menu-item.e-separator { border-bottom-style: solid; border-bottom-width: 1px; height: auto; margin: 0; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { font-size: 12px; } .e-contextmenu-wrapper ul .e-menu-item .e-previous, .e-contextmenu-container ul .e-menu-item .e-previous { margin-right: 12px; } .e-contextmenu-wrapper ul .e-menu-item.e-disabled, .e-contextmenu-container ul .e-menu-item.e-disabled { cursor: auto; pointer-events: none; } .e-contextmenu-wrapper ul .e-menu-item .e-checkbox-wrapper, .e-contextmenu-container ul .e-menu-item .e-checkbox-wrapper { width: -webkit-max-content; width: -moz-max-content; width: max-content; } .e-contextmenu-wrapper.e-sfcontextmenu, .e-contextmenu-container.e-sfcontextmenu { position: absolute; } .e-contextmenu-wrapper.e-sfcontextmenu .e-menu-vscroll, .e-contextmenu-container.e-sfcontextmenu .e-menu-vscroll { position: absolute; } .e-contextmenu-wrapper.e-sfcontextmenu ul, .e-contextmenu-container.e-sfcontextmenu ul { white-space: nowrap; } .e-contextmenu-wrapper.e-sfcontextmenu ul.e-transparent, .e-contextmenu-container.e-sfcontextmenu ul.e-transparent { background: transparent; border: 0; -webkit-box-shadow: none; box-shadow: none; height: 1px; left: 0; min-width: 0; padding: 0; top: 0; width: 0; } .e-contextmenu-wrapper.e-sfcontextmenu ul.e-transparent .e-menu-item, .e-contextmenu-container.e-sfcontextmenu ul.e-transparent .e-menu-item { height: 0; padding: 0; } .e-contextmenu-wrapper.e-sfcontextmenu ul.e-transparent .e-menu-item.e-separator, .e-contextmenu-container.e-sfcontextmenu ul.e-transparent .e-menu-item.e-separator { border: 0; margin: 0; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll { -webkit-box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-vscroll-bar, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-vscroll-bar { height: 100%; width: inherit; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-scroll-nav, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-scroll-nav { height: 16px; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll:not(.e-scroll-device), .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll:not(.e-scroll-device) { padding: 16px 0; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll ul, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll ul { -webkit-box-shadow: none; box-shadow: none; margin-top: -12px; width: inherit; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-menu-icon, .e-rtl.e-contextmenu-container .e-menu-item .e-menu-icon { margin-right: 0; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-caret, .e-rtl.e-contextmenu-container .e-menu-item .e-caret { margin-left: 0; margin-right: 16px; right: auto; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-menu-icon, .e-rtl.e-contextmenu-container .e-menu-item .e-menu-icon { margin-left: 10px; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-caret, .e-rtl.e-contextmenu-container .e-menu-item .e-caret { left: 5px; } .e-rtl.e-contextmenu-wrapper .e-menu-item.e-menu-caret-icon, .e-rtl.e-contextmenu-container .e-menu-item.e-menu-caret-icon { padding-left: 36px; padding-right: 10px; } .e-rtl.e-contextmenu-wrapper .e-menu-item.e-blankicon, .e-rtl.e-contextmenu-container .e-menu-item.e-blankicon { padding-left: 10px; } .e-rtl.e-contextmenu-wrapper .e-menu-item.e-blankicon.e-menu-caret-icon, .e-rtl.e-contextmenu-container .e-menu-item.e-blankicon.e-menu-caret-icon { padding-left: 36px; } .e-contextmenu-wrapper .e-menu-item, .e-contextmenu-container .e-menu-item { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .e-contextmenu-wrapper ul, .e-contextmenu-container ul { background-color: #fff; color: #000; } .e-contextmenu-wrapper ul .e-menu-item.e-menu-header, .e-contextmenu-container ul .e-menu-item.e-menu-header { border-bottom-color: #757575; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { color: #000; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-contextmenu-container ul .e-menu-item .e-menu-icon { color: #000; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-url, .e-contextmenu-container ul .e-menu-item .e-menu-url { color: #000; } .e-contextmenu-wrapper ul .e-menu-item.e-focused, .e-contextmenu-container ul .e-menu-item.e-focused { background-color: #ecf; color: #000; outline: 1px solid #757575; outline-offset: -1px; } .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret, .e-contextmenu-container ul .e-menu-item.e-focused .e-caret { color: #000; } .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-menu-icon, .e-contextmenu-container ul .e-menu-item.e-focused .e-menu-icon { color: #000; } .e-contextmenu-wrapper ul .e-menu-item.e-selected, .e-contextmenu-container ul .e-menu-item.e-selected { background-color: #400074; color: #fff; outline: 0 solid #400074; outline-offset: 0; } .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-caret, .e-contextmenu-container ul .e-menu-item.e-selected .e-caret { color: #fff; } .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-menu-icon, .e-contextmenu-container ul .e-menu-item.e-selected .e-menu-icon { color: #fff; } .e-contextmenu-wrapper ul .e-disabled, .e-contextmenu-container ul .e-disabled { color: #757575; opacity: 1; } .e-contextmenu-wrapper ul .e-disabled .e-menu-icon, .e-contextmenu-container ul .e-disabled .e-menu-icon { color: #757575; } .e-contextmenu-wrapper ul .e-disabled .e-caret, .e-contextmenu-container ul .e-disabled .e-caret { color: #757575; } .e-contextmenu-wrapper ul .e-disabled .e-menu-url, .e-contextmenu-container ul .e-disabled .e-menu-url { color: #757575; } .e-contextmenu-wrapper ul .e-separator, .e-contextmenu-container ul .e-separator { border-bottom-color: #757575; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll { background-color: #fff; border: 1px solid #757575; } .e-contextmenu-wrapper:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-scroll-nav, .e-contextmenu-container:not(.e-menu-container) .e-menu-vscroll.e-vscroll .e-scroll-nav { border-color: #757575; } .e-bigger .e-contextmenu-wrapper ul, .e-bigger.e-contextmenu-wrapper ul, .e-bigger .e-contextmenu-container ul, .e-bigger.e-contextmenu-container ul { font-size: 15px; padding: 0; white-space: nowrap; -webkit-box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); max-width: 280px; min-width: 112px; } .e-bigger .e-contextmenu-wrapper ul .e-menu-item, .e-bigger.e-contextmenu-wrapper ul .e-menu-item, .e-bigger .e-contextmenu-container ul .e-menu-item, .e-bigger.e-contextmenu-container ul .e-menu-item { height: 48px; line-height: 48px; } .e-bigger .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-bigger.e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-bigger .e-contextmenu-container ul .e-menu-item .e-menu-icon, .e-bigger.e-contextmenu-container ul .e-menu-item .e-menu-icon { font-size: 18px; line-height: 48px; } .e-bigger .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-bigger.e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-bigger .e-contextmenu-container ul .e-menu-item .e-caret, .e-bigger.e-contextmenu-container ul .e-menu-item .e-caret { line-height: 48px; } .e-bigger .e-contextmenu-wrapper ul .e-menu-item.e-separator, .e-bigger.e-contextmenu-wrapper ul .e-menu-item.e-separator, .e-bigger .e-contextmenu-container ul .e-menu-item.e-separator, .e-bigger.e-contextmenu-container ul .e-menu-item.e-separator { height: auto; line-height: normal; } .e-bigger .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-bigger.e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-bigger .e-contextmenu-container ul .e-menu-item .e-caret, .e-bigger.e-contextmenu-container ul .e-menu-item .e-caret { font-size: 12px; } .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon, .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon, .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon, .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon { padding-left: 10px; } .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon, .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon, .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon, .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon { padding-left: 36px; }