Fix glitch-soc high color privacy icons

glitch-soc · Jan 13, 2024 · e2ba5f6 · e2ba5f6
1 parent e227e95
commit e2ba5f6
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 8 deletions.
diff --git a/app/javascript/flavours/glitch/components/visibility_icon.tsx b/app/javascript/flavours/glitch/components/visibility_icon.tsx
@@ -57,6 +57,7 @@ export const VisibilityIcon: React.FC<{ visibility: Visibility }> = ({
       id={visibilityIcon.icon}
       icon={visibilityIcon.iconComponent}
       title={visibilityIcon.text}
+      className={'status__visibility-icon'}
     />
   );
 };
diff --git a/app/javascript/flavours/glitch/styles/accessibility.scss b/app/javascript/flavours/glitch/styles/accessibility.scss
@@ -16,23 +16,23 @@ $emojis-requiring-inversion: 'back' 'copyright' 'curly_loop' 'currency_exchange'
 }
 
 .hicolor-privacy-icons {
-  .status__visibility-icon.fa-globe,
-  .privacy-dropdown__option .fa-globe {
+  .status__visibility-icon.icon-globe,
+  .privacy-dropdown__option .icon-globe {
     color: #1976d2;
   }
 
-  .status__visibility-icon.fa-unlock,
-  .privacy-dropdown__option .fa-unlock {
+  .status__visibility-icon.icon-unlock,
+  .privacy-dropdown__option .icon-unlock {
     color: #388e3c;
   }
 
-  .status__visibility-icon.fa-lock,
-  .privacy-dropdown__option .fa-lock {
+  .status__visibility-icon.icon-lock,
+  .privacy-dropdown__option .icon-lock {
     color: #ffa000;
   }
 
-  .status__visibility-icon.fa-envelope,
-  .privacy-dropdown__option .fa-envelope {
+  .status__visibility-icon.icon-envelope,
+  .privacy-dropdown__option .icon-envelope {
     color: #d32f2f;
   }
 }