[Autoflow] Add SCSS files

Merge in SCSS files and platform markup which supports
autoflow tabular views for WTD-611 into the open-source-friendly
master branch.

platform/commonUI/general/res/sass/helpers/_bubbles.scss

@@ -0,0 +1,40 @@
+.bubble-wrapper {
+  $arwSize: 7px;
+  $c: #990000;
+  @include box-shadow(rgba(black, 0.4) 0 1px 5px);
+  position: absolute;
+  //top: 200px; left: 200px;
+  z-index: 10;
+	.bubble {
+      @include border-radius($basicCr);
+      display: inline-block;
+      background: $c;
+      color: lighten($c, 50%);
+      font-size: 0.8rem;
+      font-style: italic;
+      max-width: 200px;
+      padding: 4px 8px;
+      &:before {
+        content:"";
+        position: absolute;
+        width: 0;
+        height: 0;
+      }
+	}
+  &.arw-left .bubble:before {
+    right: 100%;
+    top: 50%; // 26px;
+    margin-top: -1 * $arwSize;
+    border-top: $arwSize solid transparent;
+    border-bottom: $arwSize solid transparent;
+    border-right: ($arwSize * 1.5) solid $c;
+  }
+  &.arw-down .bubble:before {
+    left: 50%;
+    top: 100%;
+    margin-left: -1 * $arwSize;
+    border-left: $arwSize solid transparent;
+    border-right: $arwSize solid transparent;
+    border-top: ($arwSize * 1.5) solid $c;
+  }
+}

platform/commonUI/general/res/sass/helpers/_splitter.scss

@@ -0,0 +1,47 @@
+.split-layout {
+	$b: lighten($colorBodyBg, 5%);
+	$splitterD: 5px;
+	.splitter {
+		background-color: $b;
+		@include box-shadow(rgba(black, 0.4) 0 0 3px);
+		overflow: hidden;
+		position: absolute;
+		z-index: 1;
+	}
+	&.horizontal {
+		// Slides vertically up and down, splitting the element horizontally
+        overflow: hidden; // Suppress overall scroll; each internal pane handles its own overflow
+		.pane {
+			left: 0;
+			right: 0;
+		}
+		>.splitter {
+			@include controlGrippy($b, horizontal);
+			cursor: row-resize;
+			left: 0; right: 0;
+			width: auto;
+			height: $splitterD;
+		}
+	}
+	&.vertical {
+		// Slides horizontally left to right, splitting the element vertically
+		.pane {
+			top: 0;
+			bottom: 0;
+		}
+		>.splitter {
+			@include controlGrippy($b, vertical);
+			bottom: 0;
+			cursor: col-resize;
+			width: $splitterD;
+		}
+	}
+}
+
+.browse-area .splitter {
+	top: $ueBrowseViewBarH + $interiorMargin;
+}
+
+.edit-area .splitter {
+	top: 0;
+}

platform/commonUI/general/res/sass/helpers/_wait-spinner.scss

@@ -0,0 +1,62 @@
+@-webkit-keyframes rotation {
+	from {-webkit-transform: rotate(0deg);}
+	to {-webkit-transform: rotate(359deg);}
+}
+
+@-moz-keyframes rotation {
+	from {-moz-transform: rotate(0deg);}
+	to {-moz-transform: rotate(359deg);}
+}
+
+@-o-keyframes rotation {
+	from {-o-transform: rotate(0deg);}
+	to {-o-transform: rotate(359deg);}
+}
+
+@keyframes rotation {
+	from {transform: rotate(0deg);}
+	to {transform: rotate(359deg);}
+}
+
+.t-wait-spinner,
+.wait-spinner {
+	$d: 5%;
+	@include wait-spinner(0.5em, $colorKey);
+	top: 50%; left: 50%;
+	height: auto; width: auto;
+	padding: $d; // Will size object based on parent container WIDTH
+	pointer-events: none;
+	margin-top: $d / -1;
+	margin-left: $d / -1;
+	z-index: 2;
+}
+
+.l-wait-spinner-holder {
+	pointer-events: none;
+	position: absolute;
+	&.align-left {
+		.t-wait-spinner {
+			left: 0;
+			margin-left: 0;
+		}
+	}
+	&.full-size {
+		display: inline-block;
+		height: 100%; width: 100%;
+		.t-wait-spinner {
+			top: 0;
+			margin-top: 0;
+			padding: 30%;
+		}
+	}
+}
+
+
+.treeview .wait-spinner {
+	$d: 18px;
+	@include wait-spinner(0.25em, $colorKey);
+	height: $d; width: $d;
+	margin: 0 !important;
+	padding: 0 !important;
+	top: 2px; left: 0;
+}