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

388 lines (379 loc) 12.7 kB
/*! component's theme wise override definitions and variables */ /*! component's theme wise override definitions and variables */ .e-contextmenu-wrapper ul .e-menu-item .e-previous::before, .e-contextmenu-container ul .e-menu-item .e-previous::before { content: "\e728"; } .e-contextmenu-wrapper ul .e-menu-item .e-caret::before, .e-contextmenu-container ul .e-menu-item .e-caret::before { content: "\e70b"; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-caret::before, .e-rtl.e-contextmenu-container .e-menu-item .e-caret::before { content: "\e71f"; } .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 rgba(0, 0, 0, 0.15); border-radius: 4px; -webkit-box-shadow: none; box-shadow: none; 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: none; box-shadow: none; } .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: "Helvetica Neue", "Helvetica", "Arial", sans-serif, "-apple-system", "BlinkMacSystemFont"; } .e-contextmenu-wrapper ul .e-menu-item, .e-contextmenu-container ul .e-menu-item { cursor: pointer; position: relative; height: 26px; line-height: 26px; padding: 0 20px; } .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: 14px; line-height: 26px; margin-right: 8px; width: 1em; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { line-height: 26px; margin-left: 16px; margin-right: 0; position: absolute; right: 14px; } .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: 6px 0; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { font-size: 9px; } .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: none; box-shadow: none; } .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: 8px; } .e-rtl.e-contextmenu-wrapper .e-menu-item .e-caret, .e-rtl.e-contextmenu-container .e-menu-item .e-caret { left: 14px; } .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: 20px; } .e-rtl.e-contextmenu-wrapper .e-menu-item.e-blankicon, .e-rtl.e-contextmenu-container .e-menu-item.e-blankicon { padding-left: 14px; } .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: #212529; } .e-contextmenu-wrapper ul .e-menu-item.e-menu-header, .e-contextmenu-container ul .e-menu-item.e-menu-header { border-bottom-color: #e9ecef; } .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret { color: #212529; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon, .e-contextmenu-container ul .e-menu-item .e-menu-icon { color: #495057; } .e-contextmenu-wrapper ul .e-menu-item .e-menu-url, .e-contextmenu-container ul .e-menu-item .e-menu-url { color: #212529; } .e-contextmenu-wrapper ul .e-menu-item.e-focused, .e-contextmenu-container ul .e-menu-item.e-focused { background-color: rgb(242.05, 243.9, 245.75); color: #212529; outline: 0 solid #e9ecef; outline-offset: 0; } .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret, .e-contextmenu-container ul .e-menu-item.e-focused .e-caret { color: #212529; } .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: #495057; } .e-contextmenu-wrapper ul .e-menu-item.e-selected, .e-contextmenu-container ul .e-menu-item.e-selected { background-color: #007bff; color: #fff; outline: 0 solid #007bff; 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: #212529; } .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: #495057; } .e-contextmenu-wrapper ul .e-disabled, .e-contextmenu-container ul .e-disabled { color: #6c757d; opacity: 1; } .e-contextmenu-wrapper ul .e-disabled .e-menu-icon, .e-contextmenu-container ul .e-disabled .e-menu-icon { color: #6c757d; } .e-contextmenu-wrapper ul .e-disabled .e-caret, .e-contextmenu-container ul .e-disabled .e-caret { color: #6c757d; } .e-contextmenu-wrapper ul .e-disabled .e-menu-url, .e-contextmenu-container ul .e-disabled .e-menu-url { color: #6c757d; } .e-contextmenu-wrapper ul .e-separator, .e-contextmenu-container ul .e-separator { border-bottom-color: #e9ecef; } .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 rgba(0, 0, 0, 0.15); } .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: #e9ecef; } .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: 16px; padding: 8px 0; white-space: nowrap; -webkit-box-shadow: none; box-shadow: none; 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: 32px; line-height: 32px; } .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: 16px; line-height: 32px; } .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: 32px; } .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: 14px; } .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; }