Feat(brand): add brand resource (#3147)Co-authored-by: Shanmughapriya…

…n S <priyanshan03@gmail.com> Co-authored-by: Claudio Wunder <cwunder@gnome.org> * feat(about): update ressources * feat(brand): add brand svg * feat(brand): add brand page to about section * feat(branding): add snapshots * feat(branding): update snapshots * Update src/styles/markdown.scss Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> * Update content/about/branding.en.md Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> * Update content/about/branding.en.md Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> * Update content/about/branding.en.md Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> * Update content/about/branding.en.md Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> * remove useless file * fix(brand): add athors * feat(brand): support pt * chore(brand): update branding ressource --------- Signed-off-by: Augustin Mauroy <97875033+AugustinMauroy@users.noreply.github.com> Co-authored-by: Shanmughapriyan S <priyanshan03@gmail.com> Co-authored-by: Claudio Wunder <cwunder@gnome.org>
nodejs · Mar 20, 2023 · 82b7353 · 82b7353
1 parent d1a2ab2
commit 82b7353
Show file tree

Hide file tree

Showing 49 changed files with 876 additions and 7,602 deletions.
diff --git a/content/about/branding.en.md b/content/about/branding.en.md
@@ -0,0 +1,163 @@
+---
+title: branding
+displayTitle: Branding of Node.js
+description: 'Branding | Node.js'
+authors: AugustinMauroy, XhmikosR, mikeal, fhemberger, Fishrock123, yous, tomgco, tniessen, SMcCandlish, saadq, Trott, Gornstats, piperchester, naoufal, lpinca, j9t, bnoordhuis, harshadsabne, Chris911, MrJithil
+category: about
+---
+
+Please review the [trademark policy](https://trademark-policy.openjsf.org/) for information about permissible use of Node.js® logos and marks.
+
+## Color
+
+The following colors are the color palette for the Node.js website. And should be used for other documents.
+
+### Brand colors
+
+![Brand colors](/static/images/brand/colors/brand-colors.svg)
+
+### Neutral colors
+
+![Neutral colors](/static/images/brand/colors/neutral-colors.svg)
+
+### Status colors
+
+**Danger**
+
+![Danger colors](/static/images/brand/colors/status-danger.svg)
+
+**Warning**
+
+![Warning colors](/static/images/brand/colors/status-warning.svg)
+
+**Info**
+
+![Info colors](/static/images/brand/colors/status-info.svg)
+
+### Accent colors
+
+**Accent 1**
+
+![Accent 1 colors](/static/images/brand/colors/accent-1.svg)
+
+**Accent 2**
+
+![Accent 2 colors](/static/images/brand/colors/accent-2.svg)
+
+## Font
+
+**Font Name**: Open Sans
+
+**Download**: [www.google.com/fonts/specimen/Open+Sans](https://www.google.com/fonts/specimen/Open+Sans)
+
+## Nodejs logos
+
+### Logos with JS hexagon at right
+
+<table>
+    <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-right/dark.svg' alt="Node.js dark">Node.js dark</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-right/dark.svg' download><img src='/static/images/brand/logos-js-right/dark.svg' alt="Node.js dark"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-right/light.svg' alt="Node.js light">Node.js light</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-right/light.svg' download><img src='/static/images/brand/logos-js-right/light.svg' alt="Node.js light" class='dark-bg'></a>
+        </td>
+    </tr>
+</table>
+
+### Logos with JS hexagon at bottom
+
+<table>
+   <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-bottom/dark.svg' alt="Node.js dark">Node.js dark</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-bottom/dark.svg' download><img src='/static/images/brand/logos-js-bottom/dark.svg' alt="Node.js dark"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-bottom/light.svg' alt="Node.js light">Node.js light</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-bottom/light.svg' download><img src='/static/images/brand/logos-js-bottom/light.svg' alt="Node.js light" class='dark-bg'></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-bottom/black.svg' alt="Node.js black">Node.js black</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-bottom/black.svg' download><img src='/static/images/brand/logos-js-bottom/black.svg' alt="Node.js black"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href='/static/images/brand/logos-js-bottom/white.svg' alt="Node.js white">Node.js white</a></h4>
+        </td>
+        <td>
+            <a href='/static/images/brand/logos-js-bottom/white.svg' download><img src='/static/images/brand/logos-js-bottom/white.svg' alt="Node.js white" class='dark-bg'></a>
+        </td>
+</table>
+
+## Assets
+
+### Hexagon
+
+<table>
+    <tr>
+        <td>
+            <h4><a href="/static/images/brand/hexagon/black.svg">Black hexagon</a></h4>
+        </td>
+        <td>
+            <a href="/static/images/brand/hexagon/black.svg" download><img src="/static/images/brand/hexagon/black.svg"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href="/static/images/brand/hexagon/green.svg">Green hexagon</a></h4>
+        </td>
+        <td>
+            <a href="/static/images/brand/hexagon/green.svg" download><img src="/static/images/brand/hexagon/green.svg"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+           <h4><a href="/static/images/brand/hexagon/white.svg">White hexagon</a></h4>
+        </td>
+        <td>
+            <a href="/static/images/brand/hexagon/white.svg" download><img src="/static/images/brand/hexagon/white.svg" class='dark-bg'></a>
+        </td>
+    <tr>
+</table>
+
+
+### JS from Node.js logo
+
+<table>
+    <tr>
+        <td>
+            <h4><a href="/static/images/brand/hexagon/js-green.svg">Green JS</a></h4>
+        </td>
+        <td>
+            <a href="/static/images/brand/hexagon/js-green.svg" download><img src="/static/images/brand/hexagon/js-green.svg"></a>
+        </td>
+    </tr>
+    <tr>
+        <td>
+            <h4><a href="/static/images/brand/hexagon/js-white.svg">White JS</a></h4>
+        </td>
+        <td>
+            <a href="/static/images/brand/hexagon/js-white.svg" download><img src="/static/images/brand/hexagon/js-white.svg" class='dark-bg'></a>
+        </td>
+    <tr>
+</table>
diff --git a/content/about/resources.en.md b/content/about/resources.en.md
diff --git a/content/about/resources.fr.md b/content/about/resources.fr.md
diff --git a/src/__fixtures__/page.tsx b/src/__fixtures__/page.tsx
@@ -227,7 +227,7 @@ export const createGeneralPageData = () => ({
   },
 });
 
-export const createResourcesData = () => ({
+export const createBrandingData = () => ({
   data: {
     articleCurrentLanguage: {
       fields: {

diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "Code of Conduct",
   "navigation.about.items.governance": "Project Governance",
   "navigation.about.items.releases": "Releases",
-  "navigation.about.items.resources": "Resources",
+  "navigation.about.items.branding": "Branding",
   "navigation.about.items.privacy": "Privacy Policy",
   "navigation.about.items.security": "Security Reporting",
   "navigation.about.items.packageManager": "Package Manager",

diff --git a/src/i18n/locales/es.json b/src/i18n/locales/es.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "Code of Conduct",
   "navigation.about.items.governance": "Project Governance",
   "navigation.about.items.releases": "Releases",
-  "navigation.about.items.resources": "Resources",
+  "navigation.about.items.branding": "Branding",
   "navigation.about.items.privacy": "Privacy Policy",
   "navigation.about.items.security": "Security Reporting",
   "navigation.about.items.packageManager": "Package Manager",

diff --git a/src/i18n/locales/fr.json b/src/i18n/locales/fr.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "Code de conduite",
   "navigation.about.items.governance": "Gouvernance de projet",
   "navigation.about.items.releases": "Versions",
-  "navigation.about.items.resources": "Ressources",
+  "navigation.about.items.branding": "Branding",
   "navigation.about.items.privacy": "Politique de confidentialité",
   "navigation.about.items.security": "Rapports de sécurité",
   "navigation.about.items.packageManager": "Package Manager",

diff --git a/src/i18n/locales/he.json b/src/i18n/locales/he.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "נוהל התנהגות",
   "navigation.about.items.governance": "מנהל גורמים",
   "navigation.about.items.releases": "גרסאות",
-  "navigation.about.items.resources": "משאבים",
+  "navigation.about.items.branding": "branding",
   "navigation.about.items.privacy": "מדיניות פרטיות",
   "navigation.about.items.security": "דיווח בעיות אבטחה",
   "navigation.about.items.packageManager": "מנהל חבילות",

diff --git a/src/i18n/locales/ja.json b/src/i18n/locales/ja.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "行動規範",
   "navigation.about.items.governance": "プロジェクトガバナンス",
   "navigation.about.items.releases": "リリース",
-  "navigation.about.items.resources": "リソース",
+  "navigation.about.items.branding": "branding",
   "navigation.about.items.privacy": "プライバシーポリシー",
   "navigation.about.items.security": "セキュリティ報告",
   "navigation.about.items.packageManager": "パッケージマネージャー",

diff --git a/src/i18n/locales/pt.json b/src/i18n/locales/pt.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "Código de Conduta",
   "navigation.about.items.governance": "Governação do Projeto",
   "navigation.about.items.releases": "Lançamentos",
-  "navigation.about.items.resources": "Recursos",
+  "navigation.about.items.branding": "branding",
   "navigation.about.items.privacy": "Política de Privacidade",
   "navigation.about.items.security": "Reportagem de Segurança",
   "navigation.about.items.packageManager": "Gestor de Pacote",

diff --git a/src/i18n/locales/zh-cn.json b/src/i18n/locales/zh-cn.json
@@ -87,7 +87,7 @@
   "navigation.about.items.codeOfConduct": "行为准则",
   "navigation.about.items.governance": "项目管理方式",
   "navigation.about.items.releases": "发布",
-  "navigation.about.items.resources": "资源",
+  "navigation.about.items.branding": "branding",
   "navigation.about.items.privacy": "隐私政策",
   "navigation.about.items.security": "安全隐患报告",
   "navigation.about.items.packageManager": "包管理",

diff --git a/src/navigations/about.tsx b/src/navigations/about.tsx
@@ -22,8 +22,8 @@ const aboutNavigation = {
       slug: AboutNavigationKeys.releases,
     },
     {
-      title: 'navigation.about.items.resources',
-      slug: AboutNavigationKeys.resources,
+      title: 'navigation.about.items.branding',
+      slug: AboutNavigationKeys.branding,
     },
     {
       title: 'navigation.about.items.privacy',

diff --git a/...s__/__snapshots__/resources.test.tsx.snap → ...ts__/__snapshots__/branding.test.tsx.snap b/...s__/__snapshots__/resources.test.tsx.snap → ...ts__/__snapshots__/branding.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Resources page renders correctly 1`] = `
+exports[`Branding page renders correctly 1`] = `
 <div>
   <div
     class="layout-container"
@@ -307,10 +307,10 @@ exports[`Resources page renders correctly 1`] = `
             </a>
             <a
               class="t-body2 navigationItem"
-              href="/about/resources/"
-              id="/about/resources/"
+              href="/about/branding/"
+              id="/about/branding/"
             >
-              Resources
+              Branding
             </a>
             <a
               class="t-body2 navigationItem"

diff --git a/src/pages/about/__tests__/__snapshots__/governance.test.tsx.snap b/src/pages/about/__tests__/__snapshots__/governance.test.tsx.snap
@@ -57,10 +57,10 @@ exports[`Governance Page renders correctly 1`] = `
         </a>
         <a
           class="t-body2 navigationItem"
-          href="/about/resources/"
-          id="/about/resources/"
+          href="/about/branding/"
+          id="/about/branding/"
         >
-          Resources
+          Branding
         </a>
         <a
           class="t-body2 navigationItem"

diff --git a/src/pages/about/__tests__/__snapshots__/index.test.tsx.snap b/src/pages/about/__tests__/__snapshots__/index.test.tsx.snap
@@ -57,10 +57,10 @@ exports[`About page renders correctly 1`] = `
         </a>
         <a
           class="t-body2 navigationItem"
-          href="/about/resources/"
-          id="/about/resources/"
+          href="/about/branding/"
+          id="/about/branding/"
         >
-          Resources
+          Branding
         </a>
         <a
           class="t-body2 navigationItem"

diff --git a/src/pages/about/__tests__/__snapshots__/releases.test.tsx.snap b/src/pages/about/__tests__/__snapshots__/releases.test.tsx.snap
@@ -57,10 +57,10 @@ exports[`Releases page renders correctly 1`] = `
         </a>
         <a
           class="t-body2 navigationItem"
-          href="/about/resources/"
-          id="/about/resources/"
+          href="/about/branding/"
+          id="/about/branding/"
         >
-          Resources
+          Branding
         </a>
         <a
           class="t-body2 navigationItem"

diff --git a/src/pages/about/__tests__/__snapshots__/security.test.tsx.snap b/src/pages/about/__tests__/__snapshots__/security.test.tsx.snap
@@ -56,10 +56,10 @@ exports[`Security page renders correctly 1`] = `
         </a>
         <a
           class="t-body2 navigationItem"
-          href="/about/resources/"
-          id="/about/resources/"
+          href="/about/branding/"
+          id="/about/branding/"
         >
-          Resources
+          Branding
         </a>
         <a
           class="t-body2 navigationItem"