feat(toast): add dynamic start and end positions.

The `start` and `end` positions are dynamic and are useful when using a bi-directional application with RTL and LTR

Fixes #7263

Closes #7318

src/components/toast/toast.js

@@ -202,8 +202,10 @@ function MdToastDirective($mdToast) {
   *   - `hideDelay` - `{number=}`: How many milliseconds the toast should stay
   *     active before automatically closing.  Set to 0 or false to have the toast stay open until
   *     closed manually. Default: 3000.
-  *   - `position` - `{string=}`: Where to place the toast. Available: any combination
-  *     of 'bottom', 'left', 'top', 'right'. Default: 'bottom left'.
+  *   - `position` - `{string=}`: Sets the position of the toast. <br/>
+  *     Available: any combination of `'bottom'`, `'left'`, `'top'`, `'right'`, `'end'` and `'start'`.
+  *     The properties `'end'` and `'start'` are dynamic and can be used for RTL support.<br/>
+  *     Default combination: `'bottom left'`.
   *   - `controller` - `{string=}`: The controller to associate with this toast.
   *     The controller will be injected the local `$mdToast.hide( )`, which is a function
   *     used to hide the toast.

src/components/toast/toast.scss

@@ -173,6 +173,15 @@ md-toast {
       top: 0;
     }
 
+    // Support for RTL alignment
+    &._md-start {
+      @include rtl-prop(left, right, 0);
+    }
+
+    &._md-end {
+      @include rtl-prop(right, left, 0);
+    }
+
     /*
    * When the toast doesn't take up the whole screen,
    * make it rotate when the user swipes it away