Fix tabs and links colors

Do not show in changelog

newIDE/app/src/AssetStore/AssetDetails.js

@@ -21,7 +21,6 @@ import { type ResourceExternalEditor } from '../ResourcesList/ResourceExternalEd
 import { ResponsiveLineStackLayout } from '../UI/Layout';
 import { CorsAwareImage } from '../UI/CorsAwareImage';
 import { AssetStoreContext } from './AssetStoreContext';
-import Link from '@material-ui/core/Link';
 import Window from '../Utils/Window';
 import Paper from '@material-ui/core/Paper';
 import SelectField from '../UI/SelectField';
@@ -36,6 +35,7 @@ import { AssetCard } from './AssetCard';
 import { SimilarAssetStoreSearchFilter } from './AssetStoreSearchFilter';
 import EmptyMessage from '../UI/EmptyMessage';
 import { BoxSearchResults } from '../UI/Search/BoxSearchResults';
+import Link from '../UI/Link';
 
 const FIXED_HEIGHT = 250;
 const FIXED_WIDTH = 300;
@@ -230,10 +230,7 @@ export const AssetDetails = ({
                         <Link
                           key={author.name}
                           href={author.website}
-                          onClick={event => {
-                            Window.openExternalURL(author.website);
-                            event.preventDefault();
-                          }}
+                          onClick={() => Window.openExternalURL(author.website)}
                         >
                           {author.name}
                         </Link>
@@ -422,10 +419,9 @@ export const AssetDetails = ({
                       {
                         <Link
                           href={assetLicense.website}
-                          onClick={event => {
-                            Window.openExternalURL(assetLicense.website);
-                            event.preventDefault();
-                          }}
+                          onClick={() =>
+                            Window.openExternalURL(assetLicense.website)
+                          }
                         >
                           {assetLicense.name}
                         </Link>

newIDE/app/src/MainFrame/Preferences/LanguageSelector.js

@@ -9,7 +9,7 @@ import Window from '../../Utils/Window';
 import PreferencesContext from './PreferencesContext';
 import LocalesMetadata from '../../locales/LocalesMetadata';
 import Text from '../../UI/Text';
-import Link from '@material-ui/core/Link';
+import Link from '../../UI/Link';
 
 type Props = {|
   onLanguageChanged: (language: string) => void,
@@ -76,10 +76,9 @@ const LanguageSelector = ({ onLanguageChanged }: Props) => {
           You can{' '}
           <Link
             href={'https://crowdin.com/project/gdevelop'}
-            onClick={event => {
-              Window.openExternalURL('https://crowdin.com/project/gdevelop');
-              event.preventDefault();
-            }}
+            onClick={() =>
+              Window.openExternalURL('https://crowdin.com/project/gdevelop')
+            }
           >
             help to translate GDevelop in your language
           </Link>

newIDE/app/src/MainFrame/Preferences/PreferencesDialog.js

@@ -20,7 +20,7 @@ import { Tabs, Tab } from '../../UI/Tabs';
 import RaisedButton from '../../UI/RaisedButton';
 import ShortcutsList from '../../KeyboardShortcuts/ShortcutsList';
 import LanguageSelector from './LanguageSelector';
-import Link from '@material-ui/core/Link';
+import Link from '../../UI/Link';
 const electron = optionalRequire('electron');
 
 type Props = {|
@@ -132,12 +132,11 @@ const PreferencesDialog = ({ i18n, onClose }: Props) => {
                   href={
                     'https://github.com/4ian/GDevelop/blob/master/newIDE/README-themes.md'
                   }
-                  onClick={event => {
+                  onClick={() =>
                     Window.openExternalURL(
                       'https://github.com/4ian/GDevelop/blob/master/newIDE/README-themes.md'
-                    );
-                    event.preventDefault();
-                  }}
+                    )
+                  }
                 >
                   create your own themes
                 </Link>

newIDE/app/src/UI/Link.js

@@ -0,0 +1,23 @@
+// @flow
+import * as React from 'react';
+import MuiLink from '@material-ui/core/Link';
+
+type Props = {|
+  children: React.Node,
+  href: string,
+  onClick: () => void,
+|};
+
+function Link(props: Props) {
+  const onClick = (event: MouseEvent) => {
+    event.preventDefault();
+    props.onClick();
+  };
+  return (
+    <MuiLink color="secondary" href={props.href} onClick={onClick}>
+      {props.children}
+    </MuiLink>
+  );
+}
+
+export default Link;

newIDE/app/src/UI/Tabs.js

@@ -26,7 +26,7 @@ export function Tabs<TabName>({
     <MUITabs
       variant={variant || 'fullWidth'}
       textColor="primary"
-      indicatorColor={'primary'}
+      indicatorColor="secondary"
       value={value}
       onChange={(e, newValue) => onChange(newValue)}
       allowScrollButtonsMobile={!!variant}

newIDE/app/src/UI/Theme/OneDarkTheme/theme.json

@@ -10,7 +10,7 @@
     },
     "secondary": {
       "color": {
-        "value": "#D6DEEC"
+        "value": "#56B6C2"
       },
       "text-contrast-color": {
         "value": "#282C34"

newIDE/app/src/stories/componentStories/UI/Link.stories.js

@@ -0,0 +1,29 @@
+// @flow
+import * as React from 'react';
+
+import muiDecorator from '../../ThemeDecorator';
+import paperDecorator from '../../PaperDecorator';
+
+import Link from '../../../UI/Link';
+import Text from '../../../UI/Text';
+import Window from '../../../Utils/Window';
+import { getHelpLink } from '../../../Utils/HelpLink';
+
+export default {
+  title: 'Link',
+  component: Link,
+  decorators: [paperDecorator, muiDecorator],
+};
+
+export const Default = () => (
+  <Text>
+    This is a link to{' '}
+    <Link
+      href="source"
+      onClick={() => Window.openExternalURL(getHelpLink('/publishing'))}
+    >
+      better configure your GDevelop project
+    </Link>
+    .
+  </Text>
+);