Tweak to pink theme. (#2694)

app/assets/stylesheets/top-bar.scss

@@ -1,4 +1,6 @@
 @import 'variables';
+@import 'mixins';
+
 .stories-index,
 .comments-index,
 .users-index,
@@ -191,10 +193,10 @@
         border-radius: 100%;
         margin-top: -1px;
         margin-left: -1px;
-        -ms-user-select:none;
-        -moz-user-select:none;
-        -webkit-user-select:none;
-        user-select:none;
+        -ms-user-select: none;
+        -moz-user-select: none;
+        -webkit-user-select: none;
+        user-select: none;
       }
     }
     .bars {
@@ -213,7 +215,9 @@
         }
       }
       &.desktop {
-        &:hover,&:active,&:focus {
+        &:hover,
+        &:active,
+        &:focus {
           .menu {
             display: block;
           }
@@ -283,7 +287,12 @@
           padding: 6px 10px;
         }
         &.prime-option {
-          border-bottom: 3px solid #7a7e81;
+          border-bottom: 3px solid;
+          @include themeable(
+            border-color,
+            theme-prime-option-border-color,
+            #7a7e81
+          );
           margin-bottom: 5px;
           font-size: 1.22em;
           font-weight: 500;
@@ -301,7 +310,7 @@
       }
     }
   }
-  
+
   .skip-content-link {
     position: absolute;
     top: 0;
@@ -316,7 +325,7 @@
     opacity: 0;
     transition: opacity 0.3s $ease-in-cubic, transform 0.3s $ease-in-cubic;
 
-    &:focus {      
+    &:focus {
       pointer-events: auto;
       opacity: 1;
       transform: translate(-50%, 22px);

app/views/layouts/_user_config.html.erb

@@ -49,7 +49,8 @@
       --theme-container-color: #333;\
       --theme-container-box-shadow: none;\
       --theme-container-border: 1px solid #ff4983;\
-      --theme-social-icon-invert: invert(0)</style>'
+      --theme-social-icon-invert: invert(0);\
+      --theme-prime-option-border-color: rgba(255, 255, 255, 0.55)</style>'
     }
   } catch(e) {
       console.log(e)