SONARCLOUD-335 Update about page languages link

server/sonar-web/src/main/js/apps/about/sonarcloud/__tests__/__snapshots__/Home-test.tsx.snap

@@ -496,24 +496,23 @@ exports[`should render 6`] = `
             />
           </li>
           <li
-            key="ABAP"
+            key="Swift"
           >
             <img
-              alt="ABAP"
-              src="/images/languages/abap.svg"
-              width={62}
+              alt="Swift"
+              src="/images/languages/swift.svg"
+              width={64}
             />
           </li>
         </ul>
         <a
-          className="bt bt-large bt-nav bt-orange2"
+          className="bt bt-large bt-nav bt-orange2 display-inline-flex-center"
           href="#"
           onClick={[Function]}
         >
           See All Languages
-          <ChevronDownIcon
+          <SCChevronDownIcon
             className="little-spacer-left"
-            size={20}
           />
         </a>
       </div>

server/sonar-web/src/main/js/apps/about/sonarcloud/components/Languages.tsx

@@ -18,9 +18,9 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
+import SCChevronDownIcon from './SCChevronDownIcon';
 import { LANGUAGES } from '../utils';
 import { getBaseUrl } from '../../../../helpers/urls';
-import ChevronDownIcon from '../../../../components/icons-components/ChevronDownIcon';
 
 interface State {
   height?: number;
@@ -69,11 +69,11 @@ export class Languages extends React.PureComponent<{}, State> {
               </ul>
               {!open && (
                 <a
-                  className="bt bt-large bt-nav bt-orange2"
+                  className="bt bt-large bt-nav bt-orange2 display-inline-flex-center"
                   href="#"
                   onClick={this.handleOpenClick}>
                   See All Languages
-                  <ChevronDownIcon className="little-spacer-left" size={20} />
+                  <SCChevronDownIcon className="little-spacer-left" />
                 </a>
               )}
             </div>

server/sonar-web/src/main/js/apps/about/sonarcloud/components/SCChevronDownIcon.tsx

@@ -0,0 +1,32 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2019 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import * as React from 'react';
+import Icon, { IconProps } from '../../../../components/icons-components/Icon';
+
+export default function SCChevronDownIcon({ className, fill = 'currentColor', size }: IconProps) {
+  return (
+    <Icon className={className} size={size} viewBox="0 0 24 24">
+      <path
+        d="M4 9a1 1 0 0 1 .29-.71 1 1 0 0 1 1.42 0l6.29 6.3 6.29-6.3a1.0041 1.0041 0 0 1 1.42 1.42l-7 7a1 1 0 0 1-1.42 0l-7-7A1 1 0 0 1 4 9z"
+        style={{ fill }}
+      />
+    </Icon>
+  );
+}

server/sonar-web/src/main/js/apps/about/sonarcloud/new_style.css

@@ -474,6 +474,7 @@ table.loc-price tr td:first-child {
 
 .sc-page .bt-nav.bt-large {
   height: 24px;
+  padding: 8px 8px;
 }
 
 .sc-page .bt-orange2 {
@@ -484,8 +485,8 @@ table.loc-price tr td:first-child {
 
 .sc-page .bt-orange2:hover,
 .sc-page .bt-orange2:focus {
-  border: 1px solid var(--sonarcloudOrange600);
-  background-color: var(--sonarcloudOrange600);
+  border: 1px solid var(--sonarcloudOrange700);
+  background-color: var(--sonarcloudOrange700);
 }
 
 .sc-page .bt-nav.bt-orange2 {
@@ -497,5 +498,5 @@ table.loc-price tr td:first-child {
 .sc-page .bt-nav.bt-orange2:focus {
   border: none;
   background-color: transparent;
-  color: var(--sonarcloudOrange600);
+  color: var(--sonarcloudOrange700);
 }

server/sonar-web/src/main/js/apps/about/sonarcloud/utils.ts

@@ -59,6 +59,7 @@ export const LANGUAGES = [
   { name: 'Go', file: 'go.svg', width: 91 },
   { name: 'Kotlin', file: 'kotlin.svg', width: 42 },
   { name: 'Ruby', file: 'ruby.svg', width: 43 },
+  { name: 'Swift', file: 'swift.svg', width: 64 },
   { name: 'ABAP', file: 'abap.svg', width: 62 },
   { name: 'Apex', file: 'apex.svg', width: 62 },
   { name: 'Flex', file: 'flex.png', width: 85 },
@@ -67,7 +68,6 @@ export const LANGUAGES = [
   { name: 'Objective-C', file: 'obj-c.svg', width: 63 },
   { name: 'PHP', file: 'php.svg', width: 57 },
   { name: 'Scala', file: 'scala.svg', width: 29 },
-  { name: 'Swift', file: 'swift.svg', width: 64 },
   { name: 'T-SQL', file: 't-sql.svg', width: 53 },
   { name: 'PL/SQL', file: 'pl-sql.svg', width: 65 },
   { name: 'VB', file: 'vb.svg', width: 55 },