// Main entry point (develop move).
// Contains additional styles not included in the release.
//
// @author Stanislav Kalashnik <sk@infomir.eu>
// @license GNU GENERAL PUBLIC LICENSE Version 3


html {
	overflow: auto;
}

div.develop {
	canvas {
		cursor:     none;
		visibility: hidden;
		position:   absolute;
		width:      unit(@width, px);
		height:     unit(@height, px);
		&.active {
			visibility: visible;
			z-index:    1000;
		}
	}
}

// can be toggled by numpad 9
body.develop {
	outline:        1px dashed #005000;
	outline-offset: -1px;

	// outline all divs
	div:not(.component) {
		//outline:        1px dashed grey;
		//outline-offset: -1px;
	}

	.component {
		outline:        1px dashed #005000;
		outline-offset: -1px;

		&.focus {
			outline: 1px dashed red;
		}

		// to show inner structure
		&.wired {
			outline-width: 3px;
			outline-style: dotted;
			div, td {
				outline:        1px dashed grey;
				outline-offset: -1px;
			}
		}

		// current version of webkit doesn't show outline for table elements
		// fix to compensate it and show at least table cells
		&.button {
			outline: none;

			.text, .icon {
				outline:        1px dashed #005000;
				outline-offset: -1px;
			}

			&.focus .text, &.focus .icon {
				outline: 1px dashed red;
			}
		}

		&.list {
			> .item {
				outline:        1px dashed #000000;
				outline-offset: -1px;

				&.focus {
					outline:        1px dashed orange;
					outline-offset: -1px;
				}
			}
		}

		&.grid {
			td.item {
				outline:        1px dashed #000000;
				outline-offset: -1px;

				&.focus {
					outline:        1px dashed orange;
					outline-offset: -1px;
				}
			}
		}

		&.input > .body {
			outline: 1px dashed #000;
		}
		&.focus.input > .body {
			outline: 1px dashed red;
		}
	}
}