node-authored/test/style.scss

body
{
	font-family: sans-serif;

	.main
	{
		position: absolute;
		left: 0px;
		top: 0px;
		bottom: 0px;
		right: 260px;

		.notice
		{
			padding: 8px;
			margin: 16px;
			border: 1px solid red;
			background-color: #ffdada;
		}

		.renderer
		{
			background-color: lightgoldenrodyellow;
			width: 800px;
			height: 600px;

			.rendererObject
			{
				position: absolute;
				cursor: default;

				&.activated
				{
					outline: 1px dashed #720000;
					cursor: move;
				}
			}
		}
	}

	.sidebar
	{
		position: absolute;
		top: 0px;
		bottom: 0px;
		right: 0px;
		width: 260px;
		background-color: antiquewhite;
		border-left: 1px solid gray;

		section
		{

			h1
			{
				font-size: 17px;
				font-weight: bold;
				padding: 5px 7px;
				margin: 0px;
				background-color: #45674d;
				color: white;
			}

			.action
			{
				margin-left: 8px;
				margin-top: 8px;
				font-size: 13px;
				border: 1px solid black;
				background-color: white;
				font-weight: bold;
				padding: 3px 7px;

				&:hover
				{
					background-color: #dddddd;
				}
			}

			.toolbar
			{
				border-bottom: 1px solid black;
				background-color: white;

				.action
				{
					border: 0px;
					margin: 0px;

					border-right: 1px solid black;
				}
			}

			.layers, .scenes, .objects
			{
				ul
				{
					padding-left: 0px;
					margin: 0px 0px 8px 0px;
					border-bottom: 1px solid black;
					background-color: azure;

					li
					{
						list-style-type: none;
						padding: 3px 5px;
						font-size: 14px;

						&.selected
						{
							background-color: #caf5f5;
							color: red;
							font-weight: bold;
						}

						&.faded
						{
							color: gray;
						}
					}
				}
			}

			.layers, .scenes, .objects, .properties
			{
				ul
				{
					height: 100px;
					overflow: auto;
				}
			}

			.properties
			{
				.property
				{
					margin-bottom: 2px;

					&:before, &:after
					{
						content: " ";
						display: table;
					}

					&:after
					{
						clear: both;
					}

					label
					{
						display: block;
						float: left;
						width: 90px;
						padding: 3px 5px;
						font-size: 14px;
						background-color: #e2d2bd;
					}

					input
					{
						max-width: 150px;
					}
				}
			}
		}
	}
}