Restructure Sass files and folders for proper application Sass development

UI/WebServerResources/scss/components/tooltip/demoBasicUsage/index.html

@@ -0,0 +1,48 @@
+<div ng-controller="AppCtrl">
+
+  <md-toolbar class="md-accent">
+    <h1 class="md-toolbar-tools">
+      <span flex>Awesome Md App</span>
+      <md-button class="md-fab md-accent" aria-label="refresh">
+        <md-tooltip>
+          Refresh
+        </md-tooltip>
+        <md-icon icon="/img/icons/ic_refresh_24px.svg">
+        </md-icon>
+      </md-button>
+    </h1>
+  </md-toolbar>
+  <md-content class="md-padding">
+
+    <p>
+      The tooltip is visible when the button is hovered, focused, or touched.
+    </p>
+
+    <md-button class="md-fab md-fab-top-left left" aria-label="Insert Drive">
+      <md-icon icon="/img/icons/ic_insert_drive_file_24px.svg"></md-icon>
+      <md-tooltip md-visible="demo.showTooltip">
+        Insert Drive
+      </md-tooltip>
+    </md-button>
+    <md-button class="md-fab md-fab-top-right right" aria-label="Photos">
+      <md-icon icon="/img/icons/ic_photo_24px.svg"></md-icon>
+      <md-tooltip>
+        Photos
+      </md-tooltip>
+    </md-button>
+
+    <br/><br/><br/><br/><br/><br/>
+
+    <p>
+      <div>
+        Additionally, the Tooltip's `md-visible` attribute can use data-binding to programmatically
+        show/hide itself. Toggle the checkbox below...
+      </div>
+    </p>
+
+    <md-checkbox ng-model="demo.showTooltip">
+      Insert Drive
+    </md-checkbox>
+
+  </md-content>
+</div>

UI/WebServerResources/scss/components/tooltip/demoBasicUsage/script.js

@@ -0,0 +1,5 @@
+angular.module('tooltipDemo1', ['ngMaterial'])
+
+.controller('AppCtrl', function($scope) {
+  $scope.demo = {};
+});

UI/WebServerResources/scss/components/tooltip/demoBasicUsage/style.css

@@ -0,0 +1,19 @@
+
+md-toolbar .md-toolbar-tools .md-button,
+md-toolbar .md-toolbar-tools .md-button:hover { 
+  box-shadow: none;
+  border: none;
+  transform: none;
+  -webkit-transform: none;
+}
+
+
+.left {
+  top:70px !important;
+  left:56px !important;
+}
+
+.right {
+  top:70px !important;
+  right:56px !important;
+}