.network-view { width: 100%; margin-bottom: @baseLineHeight; border: 1px solid @treeHeaderBorder; .network-header { padding: 8px; line-height: @baseLineHeight; text-align: left; vertical-align: bottom; #gradient > .vertical(@treeHeaderHighlight, @treeHeader); border-bottom: 1px solid lighten(@treeHeaderBorder, 5%); font-weight: bold; color: @gray; text-shadow: 1px 1px 1px rgba(255, 255, 255, 1); height: 28px; .meta { float: left; padding: 4px 0; font-size: 14px; &.loading-commits:after { content: ' - Loading...'; } } } pre { margin: 0; padding: 12px; border: none; } .network-graph { background-color: #f5f5f5; height: 400px; overflow: hidden; cursor: move; position: relative; .network-commit-overlay { position: absolute; width: 400px; top: 0; left: 0; padding: 8px; margin: 0 0 @baseLineHeight; list-style: none; #gradient > .vertical(@white, #f5f5f5); border: 1px solid #ddd; .border-radius(3px); .box-shadow(~"0 1px 0 rgba(255,255,255,0.4), 0 0 10px rgba(0,0,0,0.1)"); img { float: left; margin-right: 8px; } &>h4, &>p { padding-left: 48px; } } &.loading-commits:before { content: ""; display: block; height: 100%; width: 80px; box-sizing: border-box; padding: 10px; font-weight: bold; position: absolute; left: 0; top: 0; color: #555; background: rgba(255,255,255,.8) url("@{ajaxLoaderPath}") no-repeat center; z-index: 2000; } } }