From a8ccf302b291df6a1a8d916dcb4a0a042c87aec0 Mon Sep 17 00:00:00 2001
From: Thomas Heller <thomas.heller@dynatrace.com>
Date: Fri, 10 Jul 2020 08:35:17 +0200
Subject: [PATCH] feat(tile): Switched theming to custom properties.

---
 .../tile/src/_tile-theme.scss                 | 36 ++++++++++---------
 libs/barista-components/tile/src/tile.scss    |  7 +---
 2 files changed, 20 insertions(+), 23 deletions(-)

diff --git a/libs/barista-components/tile/src/_tile-theme.scss b/libs/barista-components/tile/src/_tile-theme.scss
index 0fe60d636c..ed7a530a7f 100644
--- a/libs/barista-components/tile/src/_tile-theme.scss
+++ b/libs/barista-components/tile/src/_tile-theme.scss
@@ -1,23 +1,25 @@
-@import '../../core/src/theming/theming';
+.dt-tile {
+  --dt-tile-default-color: #{$gray-700};
+}
+
+.dt-tile.dt-color-main {
+  --dt-tile-default-color: var(--dt-theme-main-default-color);
+}
 
-@mixin dt-theme-tile($theme) {
-  $palette-names: 'main', 'error', 'recovered';
-  $default-palette: 'main';
+.dt-tile.dt-color-error {
+  --dt-tile-default-color: var(--dt-error-default-color);
+}
 
-  .dt-tile:not(.dt-tile-disabled) {
-    @each $name in $palette-names {
-      $palette: dt-get-theme-palette($theme, $name);
-      $default-color: dt-get-theme-color($palette, 'default');
+.dt-tile.dt-color-recovered {
+  --dt-tile-default-color: var(--dt-recovered-default-color);
+}
 
-      &.dt-color-#{$name} {
-        &:hover {
-          border-color: $default-color;
-        }
+.dt-tile:not(.dt-tile-disabled) {
+  &:hover {
+    border-color: var(--dt-tile-default-color);
+  }
 
-        .dt-tile-icon {
-          background-color: $default-color;
-        }
-      }
-    }
+  .dt-tile-icon {
+    background-color: var(--dt-tile-default-color);
   }
 }
diff --git a/libs/barista-components/tile/src/tile.scss b/libs/barista-components/tile/src/tile.scss
index bd449672c0..06360ac3d5 100644
--- a/libs/barista-components/tile/src/tile.scss
+++ b/libs/barista-components/tile/src/tile.scss
@@ -1,8 +1,6 @@
 @import '../../style/font-mixins';
 @import '../../core/src/style/variables';
 @import '../../core/src/style/interactive-common';
-@import '../../core/src/theming/theming';
-@import './tile-theme';
 
 .dt-tile {
   display: block;
@@ -134,7 +132,4 @@
   color: $gray-300;
 }
 
-// Apply the tile theme to all theme definitions
-@include dt-apply-theme() {
-  @include dt-theme-tile($dt-current-theme);
-}
+@import './tile-theme';