diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 26455ffb..3f22b690 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -35,6 +35,7 @@
       right: 0;
       left: 0;
       bottom: 0;
+      pointer-events: none;
     }
 
     &.unseen {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 4514e79f..751b048a 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -154,7 +154,7 @@
       margin-left: $fallback--attachmentRadius;
       margin-left: var(--attachmentRadius, $fallback--attachmentRadius);
       background-color: $fallback--fg;
-      background-color: var(--fg, $fallback--fg);
+      background-color: var(--btn, $fallback--fg);
       border-bottom-left-radius: 0;
       border-bottom-right-radius: 0;
     }
@@ -292,7 +292,7 @@
 
     &.highlighted {
       background-color: $fallback--fg;
-      background-color: var(--fg, $fallback--fg);
+      background-color: var(--lightBg, $fallback--fg);
     }
   }
 }
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index c2d5b9e6..39f1b5bc 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -75,6 +75,6 @@
   padding: 10px;
   z-index: 1;
   background-color: $fallback--fg;
-  background-color: var(--fg, $fallback--fg);
+  background-color: var(--panel, $fallback--fg);
 }
 </style>
diff --git a/src/components/user_card_content/user_card_content.js b/src/components/user_card_content/user_card_content.js
index e8073021..6f9ed9fe 100644
--- a/src/components/user_card_content/user_card_content.js
+++ b/src/components/user_card_content/user_card_content.js
@@ -1,11 +1,13 @@
 import StillImage from '../still-image/still-image.vue'
+import { hex2rgb } from '../../services/color_convert/color_convert.js'
 
 export default {
   props: [ 'user', 'switcher', 'selected', 'hideBio' ],
   computed: {
     headingStyle () {
-      const rgb = this.$store.state.config.customTheme.colors.bg
-      if (rgb) {
+      const color = this.$store.state.config.customTheme.colors.bg
+      if (color) {
+        const rgb = (typeof color === 'string') ? hex2rgb(color) : color
         const tintColor = `rgba(${Math.floor(rgb.r)}, ${Math.floor(rgb.g)}, ${Math.floor(rgb.b)}, .5)`
         return {
           backgroundColor: `rgb(${Math.floor(rgb.r * 0.53)}, ${Math.floor(rgb.g * 0.56)}, ${Math.floor(rgb.b * 0.59)})`,
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index 1b7ec7f2..57bd2841 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -202,6 +202,9 @@ const generateColors = (input) => {
       colors[k + 'Link'].a = v
       colors['panelFaint'].a = v
     }
+    if (k === 'bg') {
+      colors['lightBg'].a = v
+    }
     if (colors[k]) {
       colors[k].a = v
     } else {