docs: crate main doc for how to deal with brand (#2100)

* Create main doc for how to deal with brand * Add pages to brand seciton * Correct MDX v2 issues * Removed draft docs * Add link from theming to brand section --------- Co-authored-by: Tobias Høegh <[email protected]>
dnbexperience · Mar 16, 2023 · 0144b5c · 0144b5c
1 parent 7f0caee
commit 0144b5c
Show file tree

Hide file tree

Showing 5 changed files with 81 additions and 18 deletions.
diff --git a/packages/dnb-design-system-portal/src/docs/brand/development.mdx b/packages/dnb-design-system-portal/src/docs/brand/development.mdx
@@ -0,0 +1,5 @@
+---
+title: 'Development'
+---
+
+# Development
diff --git a/packages/dnb-design-system-portal/src/docs/brand/development/import-styles.mdx b/packages/dnb-design-system-portal/src/docs/brand/development/import-styles.mdx
@@ -0,0 +1,6 @@
+---
+title: 'Import styles'
+level: 1
+---
+
+# Import styles
diff --git a/packages/dnb-design-system-portal/src/docs/contribute.mdx b/packages/dnb-design-system-portal/src/docs/contribute.mdx
@@ -38,20 +38,71 @@ Colors, fonts and logo guidelines are set in the DNB Brandbook and the digital v
 
 ## Dive in
 
-<div align="center" className="dnb-section dnb-section--spacing dnb-section--mint-green">
-	<div style={{display: 'flex', flexWrap: 'wrap', marginBottom: '1rem'}}>
-		<Card url="/contribute/rules" about="Code of conduct and Development principles" title="Ground rules" icon={Principles} />
-		<Card url="/contribute/first-contribution" about="Your first contribution, Pull Requests and Technical information " title="New contributor" icon={NewContributor} />
-		<Card url="/contribute/getting-started" about="Set up environment, Make changes and Run tests " title="Getting started" icon={GettingStarted} />
-	</div>
-
-    <strong>Or go directly to</strong>
-
-    <Button href="/contribute/style-guides" size="large" variant="secondary" text="Style guides" icon="chevron_right" right />
-    <Button href="/contribute/deploy" size="large" variant="secondary" text="Deployment" icon="chevron_right" right />
-    <Button href="/contribute/faq" size="large" variant="secondary" text="FAQ" icon="chevron_right" right />
-    <Button href="/contribute/contact" size="large" variant="secondary" text="Contact" icon="chevron_right" />
-
+<div
+  align="center"
+  className="dnb-section dnb-section--spacing dnb-section--mint-green"
+>
+  <div style={{ display: 'flex', flexWrap: 'wrap', marginBottom: '1rem' }}>
+    <Card
+      url="/contribute/rules"
+      about="Code of conduct and Development principles"
+      title="Ground rules"
+      icon={Principles}
+    />
+    <Card
+      url="/contribute/first-contribution"
+      about="Your first contribution, Pull Requests and Technical information "
+      title="New contributor"
+      icon={NewContributor}
+    />
+    <Card
+      url="/contribute/getting-started"
+      about="Set up environment, Make changes and Run tests "
+      title="Getting started"
+      icon={GettingStarted}
+    />
+  </div>
+  <h3>Or go directly to</h3>
+  <div
+    style={{
+      display: 'flex',
+      flexWrap: 'wrap',
+      gap: '1rem',
+      justifyContent: 'center',
+    }}
+  >
+    <Button
+      href="/contribute/style-guides"
+      size="large"
+      variant="secondary"
+      text="Style guides"
+      icon="chevron_right"
+      right
+    />
+    <Button
+      href="/contribute/deploy"
+      size="large"
+      variant="secondary"
+      text="Deployment"
+      icon="chevron_right"
+      right
+    />
+    <Button
+      href="/contribute/faq"
+      size="large"
+      variant="secondary"
+      text="FAQ"
+      icon="chevron_right"
+      right
+    />
+    <Button
+      href="/contribute/contact"
+      size="large"
+      variant="secondary"
+      text="Contact"
+      icon="chevron_right"
+    />
+  </div>
 </div>
 
 ### Links to important resources

diff --git a/packages/dnb-design-system-portal/src/docs/contribute/contact.mdx b/packages/dnb-design-system-portal/src/docs/contribute/contact.mdx
@@ -12,9 +12,10 @@ import { Button } from '@dnb/eufemia/src'
 
 For all discussion topics, ask in Slack:
 
-<Button href="https://dnb-it.slack.com/archives/CMXABCHEY">
-  #eufemia-web
-</Button>
+<Button
+  href="https://dnb-it.slack.com/archives/CMXABCHEY"
+  text="#eufemia-web"
+/>
 
 ### Related channels in [DNB IT](https://dnb-it.slack.com)
 

diff --git a/packages/dnb-design-system-portal/src/docs/uilib/usage/customisation/theming.mdx b/packages/dnb-design-system-portal/src/docs/uilib/usage/customisation/theming.mdx
@@ -9,7 +9,7 @@ Theming is a umbrella term of a wide range of different ways and needs of custom
 
 This section covers some of the needs we've seen in DNB productions as of now.
 
-You may also check out the section in the contribution docs on [how to maintain and create a theme](/contribute/style-guides/theming/).
+You may also check out the section in the contribution docs on [how to maintain and create a theme](/contribute/style-guides/theming/) or [how to deal with the brand as a developer](/brand/development/).
 
 - [Theming](#theming)
   - [Integrated theming](#integrated-theming)