META-INF.resources.js.components.ModelBuilder.ObjectDefinitionNode.NodeContainer.scss Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of com.liferay.object.web

Liferay Object Web

The newest version!

@mixin nodeAnimation($translateYPx) {
	transform: translateY($translateYPx);
	transition:
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		transform 0.3s ease;
}

.lfr-objects__model-builder-node {
	&-container {
		background: #fff;
		border-color: #d3d6e0;
		border-radius: 0.25rem;
		border-style: solid;
		border-width: 0.125rem;
		height: auto;
		position: relative;
		@include nodeAnimation(4px);

		&:active {
			border-color: #0b5fff;
			border-width: 0.125rem;
			cursor: grabbing;
		}

		&:hover {
			border-color: #b3cdff;
			border-width: 0.125rem;
			box-shadow:
				rgba(17, 17, 26, 0.1) 0 4px 16px,
				rgba(17, 17, 26, 0.05) 0 8px 32px;

			@include nodeAnimation(-4px);
		}

		&--link {
			border-style: dashed;
		}

		&--selected {
			border-color: #0b5fff !important;
			border-width: 0.125rem !important;
			box-shadow:
				rgba(17, 17, 26, 0.1) 0 4px 16px,
				rgba(17, 17, 26, 0.05) 0 8px 32px;
			@include nodeAnimation(4px);
		}

		&--treeItem {
			padding-left: 1rem;

			&::before {
				background-color: #2e5aac;
				border-bottom-left-radius: 0.15rem;
				border-top-left-radius: 0.15rem;
				bottom: 0;
				content: '';
				left: 0;
				position: absolute;
				top: 0;
				width: 1rem;
			}
		}
	}
}

.lfr-objects__model-builder-node-dropdown.dropdown-menu {
	max-width: 14.5rem;
}