docs: add documentation for v1.8 (#3669)

www/docs/src/components/Badge/index.js

@@ -1,16 +1,20 @@
 import React from "react"
-import styles from './styles.module.css'
-import clsx from 'clsx';
+import styles from "./styles.module.css"
+import clsx from "clsx"
 
-export default function Badge ({ className, variant, children }) {
+export default function Badge({ className, variant, children }) {
   return (
-    <span className={clsx(
-      styles.badge,
-      className,
-      variant === 'purple' && styles.purpleBadge,
-      variant === 'orange' && styles.orangeBadge
-    )}>
+    <span
+      className={clsx(
+        styles.badge,
+        className,
+        variant === "purple" && styles.purpleBadge,
+        variant === "orange" && styles.orangeBadge,
+        variant === "green" && styles.greenBadge,
+        variant === "blue" && styles.blueBadge
+      )}
+    >
       {children}
     </span>
   )
-}
+}

www/docs/src/components/Badge/styles.module.css

@@ -18,4 +18,16 @@
   background-color: var(--medusa-tag-orange-bg);
   border-color: var(--medusa-tag-orange-border);
   color: var(--medusa-tag-orange-text);
+}
+
+.greenBadge {
+  background-color: var(--medusa-tag-green-bg);
+  border-color: var(--medusa-tag-green-border);
+  color: var(--medusa-tag-green-text);
+}
+
+.blueBadge {
+  background-color: var(--medusa-tag-blue-bg);
+  border-color: var(--medusa-tag-blue-border);
+  color: var(--medusa-tag-blue-text);
 }

www/docs/src/components/Feedback/index.css

@@ -1,6 +1,9 @@
 .feedback-container {
   padding-top: var(--ifm-base-margin-vertical);
   padding-bottom: var(--ifm-base-margin-vertical);
+}
+
+.doc-footer .feedback-container {
   border-top: 1px solid var(--ifm-doc-footer-border-color);
 }