Fixed styling

Author: aeagle

react-spaces/src/components/stories/02-components/Custom.stories.mdx

@@ -146,7 +146,7 @@ intend to change the type of the space dynamically without causing remounting of
 		<Prop name="width" type="number | string" description="Width of space." />
 		<Prop name="height" type="number | string" description="Height of space." />
 		<PropsHeader>Relevant as anchored</PropsHeader>
-		<Prop name="anchor" type="anchor-left, anchor-top, anchor-right, anchor-bottom" description="Anchor the space to the parents edge" />
+		<Prop name="anchor" type="AnchorType.Left, AnchorType.Top, AnchorType.Right, AnchorType.Bottom, 'anchor-left', 'anchor-top', 'anchor-right', 'anchor-bottom'" description="Anchor the space to the parents edge" />
 		<Prop name="anchorSize" type="number | string" description="Size of space when anchored." />
 		<PropsHeader>Relevant as resizable</PropsHeader>
 		<Prop name="resizable" type="boolean" default="false" description="Makes the space resizable." />

react-spaces/src/components/stories/Utils.scss

@@ -1,22 +1,20 @@
-.sbdocs-wrapper {
-	.properties-table,
-	.css-lckf62 {
-		margin-top: 15px;
-		border-collapse: collapse;
-		border-spacing: 0;
-		width: 100%;
-		font-size: 14px;
-		line-height: 24px;
-		td,
-		th {
-			vertical-align: top;
-			text-align: left;
-			padding: 6px 13px;
-			border: 1px solid rgba(0, 0, 0, 0.1);
-		}
+.properties-table,
+.css-lckf62 {
+	margin-top: 15px;
+	border-collapse: collapse;
+	border-spacing: 0;
+	width: 100%;
+	font-size: 14px;
+	line-height: 24px;
+	td,
+	th {
+		vertical-align: top;
+		text-align: left;
+		padding: 6px 13px;
+		border: 1px solid rgba(0, 0, 0, 0.1);
+	}
 
-		tr:nth-of-type(2n) {
-			background-color: #f8f8f8;
-		}
+	tr:nth-of-type(2n) {
+		background-color: #f8f8f8;
 	}
 }

react-spaces/src/components/stories/Utils.tsx

@@ -188,9 +188,9 @@ export const DemoUI = () => {
 	);
 };
 
-export const blue: CSSProperties = { backgroundColor: "#e0eeee", opacity: 0.7 };
-export const red: CSSProperties = { backgroundColor: "#eee0e0", opacity: 0.7 };
-export const green: CSSProperties = { backgroundColor: "#e0eee0", opacity: 0.7 };
+export const blue: CSSProperties = { backgroundColor: "rgb(224, 238, 238, 0.7)" };
+export const red: CSSProperties = { backgroundColor: "rgb(238, 224, 224, 0.7)" };
+export const green: CSSProperties = { backgroundColor: "rgb(224, 238, 224, 0.7)" };
 
 export const description = (props: string, additional?: React.ReactNode) => (
 	<Info>