Rewrite sass variables to support themes

src/sass/profile/card.scss

@@ -3,7 +3,7 @@
 
 .profile-card {
     flex-wrap: wrap;
-    background: $bg_panel;
+    background: var(--bg_panel);
     padding: 12px;
     display: flex;
 }
@@ -20,14 +20,14 @@
 
 .profile-card-username {
     @include breakable;
-    color: $fg_color;
+    color: var(--fg_color);
     font-size: 14px;
     display: block;
 }
 
 .profile-card-fullname {
     @include breakable;
-    color: $fg_color;
+    color: var(--fg_color);
     font-size: 16px;
     font-weight: bold;
     text-shadow: none;
@@ -45,8 +45,8 @@
         width: calc(100% - 8px);
         height: 100%;
         margin: 0;
-        border: 4px solid $darker_grey;
-        background: $bg_color;
+        border: 4px solid var(--darker_grey);
+        background: var(--bg_color);
     }
 }
 
@@ -67,7 +67,7 @@
     }
 
     .profile-joindate, .profile-location, profile-website {
-        color: $fg_faded;
+        color: var(--fg_faded);
         margin: 2px 0;
         width: 100%;
     }