(profile) more colours and better contrast

assets/variables.scss

@@ -54,10 +54,14 @@ $primary-dark: #ff95bb;
 
 $colours: (
     'pink':   ('light': $primary,    'dark': $primary-dark),
-    'red':    ('light': $red,        'dark': $red-400),
+    'red':    ('light': $red-600,    'dark': $red-400),
     'orange': ('light': $orange-600, 'dark': $orange-300),
+    'brown':  ('light': $orange-800, 'dark': $orange-500),
+    'yellow': ('light': $yellow-600, 'dark': $yellow-300),
     'green':  ('light': $green,      'dark': $green-300),
+    'teal':   ('light': $teal-700,   'dark': $teal-300),
     'blue':   ('light': $blue-700,   'dark': $blue-200),
-    'grey':   ('light': $gray-600,   'dark': $gray-600),
+    'purple': ('light': $purple,     'dark': $purple-300),
+    'grey':   ('light': $gray-600,   'dark': $gray-500),
     'default':('light': $body-color, 'dark': $light),
 );

locale/_base/translations.suml

@@ -703,8 +703,12 @@ profile:
             pink: 'Pink'
             red: 'Red'
             orange: 'Orange'
+            yellow: 'Yellow'
+            teal: 'Teal'
             green: 'Green'
             blue: 'Blue'
+            purple: 'Purple'
+            brown: 'Brown'
             grey: 'Grey'
         styles:
             _: '(Style…)'

locale/en/translations.suml

@@ -870,8 +870,12 @@ profile:
             pink: 'Pink'
             red: 'Red'
             orange: 'Orange'
+            yellow: 'Yellow'
+            teal: 'Teal'
             green: 'Green'
             blue: 'Blue'
+            purple: 'Purple'
+            brown: 'Brown'
             grey: 'Grey'
         styles:
             _: '(Style…)'

locale/expectedTranslations.js

@@ -142,4 +142,8 @@ module.exports = [
     'profile.share.pronouns',
     'profile.expendableList.more',
     'profile.expendableList.show',
+    'profile.opinions.colours.yellow',
+    'profile.opinions.colours.teal',
+    'profile.opinions.colours.purple',
+    'profile.opinions.colours.brown',
 ];

locale/pl/translations.suml

@@ -1418,8 +1418,12 @@ profile:
             pink: 'Różowy'
             red: 'Czerwony'
             orange: 'Pomarańczowy'
+            yellow: 'Żółty'
             green: 'Zielony'
+            teal: 'Seledynowy'
             blue: 'Niebieski'
+            purple: 'Fioletowy'
+            brown: 'Brązowy'
             grey: 'Szary'
         styles:
             _: '(Styl tekstu…)'

src/styling.js

@@ -1,2 +1,2 @@
-export const colours = ['', 'pink', 'red', 'orange', 'green', 'blue', 'grey'];
+export const colours = ['', 'pink', 'red', 'orange', 'brown', 'yellow', 'green', 'teal', 'blue', 'purple', 'grey'];
 export const styles = ['', 'bold-italics', 'bold', 'italics', 'small'];