Implemented new wave and line vector divider components

They render "smooth", "flat" and "roaring" wave & line vector graphics
used for the new landing page sections.

GH-112

src/components/atoms/core/vectors/divider/LinesWavyIntersecting.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering two intersecting wavy lines.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const LinesWavyIntersecting = props => (
+  <DividerSvg {...props} viewBox="0 0 1600 173" xmlns="http://www.w3.org/2000/svg">
+    <path d="M1665.731 145.823c-115.382 81.947-257.301-50.789-507.113-94.011C854.859-.745 794.065 148.685 426.121 93.955 334.889 80.383 279.017 62.33 183.4 75.585 20.51 98.165-64.362 184.803-137.338 140.42c-40.128-24.406-64.669-81.136-48.761-103.736 34.158-48.53 217.973 112.638 473.523 108.058 233.32-4.18 251.403-141.599 475.689-143.718 226.76-2.141 245.44 137.972 501.695 148.04 232.694 9.144 426.896-98.152 443.183-61.593 6.454 14.485-19.273 42.026-42.26 58.352z" />
+  </DividerSvg>
+);
+
+export default LinesWavyIntersecting;

src/components/atoms/core/vectors/divider/WaveRoaring.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering a roaring wave form.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const WaveRoaring = props => (
+  <DividerSvg {...props} viewBox="0 0 2000 242" xmlns="http://www.w3.org/2000/svg">
+    <path d="M2000 75.463c-230.631 73.429-431.99 108.499-604.064 105.196-293.434-5.632-485.998-145.823-954.537-150.568C272.956 28.385 125.825 50.689 0 96.996V242h2000V75.463z" />
+  </DividerSvg>
+);
+
+export default WaveRoaring;

src/components/atoms/core/vectors/divider/WaveRough.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering a rough wave form.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const WaveRough = props => (
+  <DividerSvg {...props} viewBox="0 0 1920 240" xmlns="http://www.w3.org/2000/svg">
+    <path d="M0 0c62.028 23.301 207.726 31.062 355.345 10.956 194.93-26.548 329.274 58.551 412.36 95.275 113.991 50.379 161.026 36.177 242.491 47.604 81.464 11.428 80.28 30.32 167.409 35.339 99.802 5.746 258.527-51.115 385.457-10.565 156.954 50.136 300.814-6.06 356.938 1.225V240H0V0z" />
+  </DividerSvg>
+);
+
+export default WaveRough;

src/components/atoms/core/vectors/divider/WaveSmooth.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering a smooth wave form.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const WaveSmooth = props => (
+  <DividerSvg {...props} viewBox="0 0 1440 120" xmlns="http://www.w3.org/2000/svg">
+    <path d="M1440 21.21V120H0V21.21C120 35.07 240 42 360 42s240-6.93 360-20.79c88.328-8.794 154.574-14.333 198.738-16.618A3120.562 3120.562 0 0 1 1080 .42c120 0 240 6.93 360 20.79z" />
+  </DividerSvg>
+);
+
+export default WaveSmooth;

src/components/atoms/core/vectors/divider/WaveSmooth2.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering a smooth wave form.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const WaveSmooth2 = props => (
+  <DividerSvg {...props} viewBox="0 0 1920 157.327" xmlns="http://www.w3.org/2000/svg">
+    <path d="M303.719 110.734a3330.42 3330.42 0 0 0 168.09 4.234 3320.491 3320.491 0 0 0 159.313-3.813c135.609-6.535 268.979-21.525 396.41-44.547C1296.81 17.949 1525.27 3.983 1669.51.833c151.12-3.304 243.74 4.253 250.49 4.822v151.672H0v-77.97c12.939 2.334 128.5 22.508 303.719 31.377z" />
+  </DividerSvg>
+);
+
+export default WaveSmooth2;

src/components/atoms/core/vectors/divider/WaveSmoothFlat.jsx

@@ -0,0 +1,28 @@
+/*
+ * Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (C) 2018-present Sven Greb <[email protected]>
+ *
+ * Project:    Nord Docs
+ * Repository: https://github.com/arcticicestudio/nord-docs
+ * License:    MIT
+ */
+
+import React from "react";
+
+import DividerSvg from "./DividerSvg";
+
+/**
+ * A SVG vector graphic divider component rendering a flat smooth wave form.
+ *
+ * @author Arctic Ice Studio <[email protected]>
+ * @author Sven Greb <[email protected]>
+ * @since 0.6.0
+ * @see https://developer.mozilla.org/de/docs/Web/SVG
+ */
+const WaveSmoothFlat = props => (
+  <DividerSvg {...props} viewBox="0 0 1440 47" xmlns="http://www.w3.org/2000/svg">
+    <path d="M0 .058c117.505 18.386 269.602 22.114 456.294 11.185C562.076 5.051 730.784.911 885.297 3.273 1157.177 7.432 1386.981 21.329 1440 38.39v8.55H0V.058z" />
+  </DividerSvg>
+);
+
+export default WaveSmoothFlat;

src/components/atoms/core/vectors/divider/index.js

@@ -15,7 +15,12 @@
  * @since 0.5.0
  */
 
+import LinesWavyIntersecting from "./LinesWavyIntersecting";
 import WaveFooter from "./WaveFooter";
+import WaveRoaring from "./WaveRoaring";
+import WaveRough from "./WaveRough";
+import WaveSmooth from "./WaveSmooth";
+import WaveSmooth2 from "./WaveSmooth2";
+import WaveSmoothFlat from "./WaveSmoothFlat";
 
-/* eslint-disable-next-line import/prefer-default-export */
-export { WaveFooter };
+export { LinesWavyIntersecting, WaveFooter, WaveRoaring, WaveRough, WaveSmooth, WaveSmooth2, WaveSmoothFlat };