fix: tile theme parameter refactoring (#387)

* refactored mixin

* refactored tile colors

src/mixins/_mixins.scss

@@ -296,7 +296,7 @@
   &:focus {
     outline-style: dotted;
     outline-width: 1px;
-    outline-color: var(--sapContent_FocusColor);
+    outline-color: var(--sapLinkColor);
   }
 }
 

src/tile.scss

@@ -13,27 +13,18 @@ $block: #{$fd-namespace}-tile;
 
 .#{$block} {
   // VARS
-  $fd-tile-color: fd-color("text", 3) !default;
-  $fd-tile-background-color: fd-color("background", 2) !default;
-  $fd-tile-title-color: fd-color("text", 1) !default;
+  color: var(--sapTile_TextColor);
+  background-color: var(--sapTile_Background);
   $fd-tile-content-padding: fd-space(4) fd-space("reg") !default;
   $fd-tile-content-padding-x: fd-space("small") !default;
   $fd-tile-content-padding-y: fd-space(2) + 2px !default;
-  $fd-tile-box-shadow: 0 0 5px 0 rgba($fd-tile-color, 0.4) !default;
   // anim
   $fd-tile-transition-params: $fd-animation--speed ease-in !default;
 
-  --fd-tile-color: var(--fd-color-text-3);
-  --fd-tile-background-color: var(--fd-color-background-2);
-  --fd-tile-title-color: var(--fd-color-text-1);
-
   @include fd-reset();
 
   display: flex;
 
-  @include fd-var-color("color", $fd-tile-color, --fd-tile-color);
-  @include fd-var-color("background-color", $fd-tile-background-color, --fd-tile-background-color);
-
   &__text {
     @include fd-reset();
   }
@@ -46,7 +37,7 @@ $block: #{$fd-namespace}-tile;
     transition: box-shadow $fd-tile-transition-params;
 
     &:hover {
-      box-shadow: $fd-tile-box-shadow;
+      box-shadow: 0 0 5px 0 rgba(var(--sapTile_BorderColor), 0.4);
       position: relative;
       z-index: map-get($fd-z-index-levels, "first");
     }
@@ -92,7 +83,9 @@ $block: #{$fd-namespace}-tile;
 
   &__title {
     @include fd-type("0");
-    @include fd-var-color("color", $fd-tile-title-color, --fd-tile-title-color);
+
+    color: var(--sapTile_TitleTextColor);
+
     @include fd-reset-spacing();
   }