Refactor CSS transitions and update support button UI

Author: robertpiosik

packages/ui/src/styles/foundation/_variables.scss

@@ -36,4 +36,5 @@
   --disabled-opacity: 0.5;
 
   --transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  --transition-duration: 0.15s;
 }

packages/vscode/src/view/frontend/home/HomeView/HomeView.module.scss

@@ -74,7 +74,8 @@
 
     &--buy-me-a-coffee {
       background-color: #f7d600;
-      transition: var(--transition);
+      transition: transform var(--transition-duration)
+        var(--transition-timing-function);
 
       &:hover {
         transform: scale(0.95);

packages/vscode/src/view/frontend/intro/Intro/Intro.tsx

@@ -37,8 +37,8 @@ export const Intro: React.FC<Props> = (props) => {
               className={styles.top__button}
               href="https://buymeacoffee.com/robertpiosik"
             >
-              <span className="codicon codicon-coffee" />
-              <span>Buy me a coffee</span>
+              <span className="codicon codicon-heart" />
+              <span>Support author</span>
             </a>
           </div>
           <div className={styles.bottom}>