dropdown-submenu-engine.less

/**
 * Dropdown Submenu Plugin for jQuery
 *
 * @version 1.2
 * https://www.carlesrever.com/dropdown-submenu-jquery
 *
 * Minimum engine styles required for working. You can use it with your own skin styles, 
 * enqueue all in your project, etc.
 *
 * You will find this styles plus engine styles in the dropdown-submenu-dist.css file.
 */
 
 .dropdown-submenu-wrapper {
	
	-webkit-user-select: none;  
	-moz-user-select: none;    
	-ms-user-select: none;      
	user-select: none;
	
	.dropdown-field {
		position: relative;
	}
	&.dropdown-submenu-open .dropdown-field {
		z-index: 100000000;
	}
	&.is-hidden {
		display: none;
	}
	
	ul, li {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	// Main menu
	.dropdown-main-list {
		position: absolute;
		display: none;
	}
	&.dropdown-submenu-open .dropdown-main-list {
		display: block;
	}
	.dropdown-main-item {
		position: relative;
		white-space: nowrap;
	}

	// Submenu
	.dropdown-submenu {
		position: absolute;
		display: none;
		left: 100%;
		margin-left: -2px;
		top: 0;
	}

	.dropdown-submenu-item {
		white-space: nowrap;
	}
	
	// Mouse caret
	.dropdown-has-childs {
		cursor: default;
	}
	.dropdown-field-watch,
	.dropdown-no-childs,
	.dropdown-submenu-item {
		cursor: pointer;
	}
	li:hover .dropdown-submenu {
		display: block;
	}
	&.is-disabled .dropdown-field-watch {
		cursor: default;
	}
}

.dropdown-submenu-wrapper.fits-well {

	.dropdown-submenu-hidden {
		border: 0!important;
		clip: rect(0 0 0 0)!important;
		height: 1px!important;
		margin: -1px!important;
		overflow: hidden!important;
		padding: 0!important;
		position: absolute!important;
		width: 1px!important;
	}
}

.dropdown-submenu-wrapper.not-fit {
 
	display: inline-block; // default browser value for selects
	
	.dropdown-field {
		display: none;
	}
}