Update colors

4ian · Dec 19, 2024 · 3311493 · 3311493
1 parent 1dd0c26
commit 3311493
Show file tree

Hide file tree

Showing 11 changed files with 97 additions and 27 deletions.
diff --git a/newIDE/app/src/Profile/Subscription/GetSubscriptionCard.module.css b/newIDE/app/src/Profile/Subscription/GetSubscriptionCard.module.css
@@ -9,7 +9,7 @@
 .premiumContainer::before {
     content: '';
     display: block;
-    background: linear-gradient(90deg, var(--theme-premium-green) 0%, var(--theme-premium-orange) 100%);
+    background: linear-gradient(90deg, var(--theme-premium-teal) 0%, var(--theme-premium-orange) 100%);
     width: 100%;
     padding-bottom: 100%;
     position: absolute;

diff --git a/newIDE/app/src/UI/RaisedButton.module.css b/newIDE/app/src/UI/RaisedButton.module.css
@@ -19,10 +19,10 @@ button.buttonDanger:hover {
 }
 
 button.buttonPremium {
-    background: linear-gradient(90deg, var(--theme-premium-green) 0%, var(--theme-premium-orange) 100%);
+    background: linear-gradient(90deg, var(--theme-premium-teal) 0%, var(--theme-premium-orange) 100%);
     color: var(--theme-premium-text-contrast-color);
 }
 
 button.buttonPremium:hover {
-    background: linear-gradient(90deg, var(--theme-premium-orange) 0%, var(--theme-premium-green) 100%);
+    background: linear-gradient(90deg, var(--theme-premium-teal-dark) 0%, var(--theme-premium-orange-dark) 100%);
 }
diff --git a/newIDE/app/src/UI/Theme/BlueDarkTheme/theme.json b/newIDE/app/src/UI/Theme/BlueDarkTheme/theme.json
@@ -76,11 +76,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/DefaultDarkTheme/theme.json b/newIDE/app/src/UI/Theme/DefaultDarkTheme/theme.json
@@ -109,11 +109,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/DefaultLightTheme/theme.json b/newIDE/app/src/UI/Theme/DefaultLightTheme/theme.json
@@ -109,11 +109,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#09F0EC"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFA929"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/NordTheme/theme.json b/newIDE/app/src/UI/Theme/NordTheme/theme.json
@@ -74,11 +74,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/OneDarkTheme/theme.json b/newIDE/app/src/UI/Theme/OneDarkTheme/theme.json
@@ -74,11 +74,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/RosePineTheme/theme.json b/newIDE/app/src/UI/Theme/RosePineTheme/theme.json
@@ -38,11 +38,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/Theme/SolarizedDarkTheme/theme.json b/newIDE/app/src/UI/Theme/SolarizedDarkTheme/theme.json
@@ -74,11 +74,21 @@
       }
     },
     "premium": {
-      "green": {
-        "value": "#3BF7F4"
+      "teal": {
+        "value": "#3BF7F4",
+        "comment": "Palette/Teal/40"
+      },
+      "teal-dark": {
+        "value": "#09F0EC",
+        "comment": "Palette/Teal/50"
       },
       "orange": {
-        "value": "#FFBC57"
+        "value": "#FFBC57",
+        "comment": "Palette/Yellow/40"
+      },
+      "orange-dark": {
+        "value": "#FFA929",
+        "comment": "Palette/Yellow/50"
       },
       "text-contrast-color": {
         "value": "#1D1D26",

diff --git a/newIDE/app/src/UI/User/UserAvatar.module.css b/newIDE/app/src/UI/User/UserAvatar.module.css
@@ -9,7 +9,7 @@
 .premiumContainer::before {
     content: '';
     display: block;
-    background: linear-gradient(90deg, var(--theme-premium-green) 0%, var(--theme-premium-orange) 100%);
+    background: linear-gradient(90deg, var(--theme-premium-teal) 0%, var(--theme-premium-orange) 100%);
     width: 100%;
     padding-bottom: 100%;
     position: absolute;

diff --git a/newIDE/app/src/stories/componentStories/UserChip/UserChip.stories.js b/newIDE/app/src/stories/componentStories/UserChip/UserChip.stories.js
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { action } from '@storybook/addon-actions';
 
-import paperDecorator from '../../PaperDecorator';
+import { getPaperDecorator } from '../../PaperDecorator';
 
 import UserChipComponent from '../../../UI/User/UserChip';
 import {
@@ -18,7 +18,7 @@ import Text from '../../../UI/Text';
 export default {
   title: 'User chips/UserChip',
   component: UserChipComponent,
-  decorators: [paperDecorator],
+  decorators: [getPaperDecorator('medium')],
 };
 
 const LoggedOut = () => {