diff --git a/packages/images/src/components/footer.js b/packages/images/src/components/footer.js
index 64a6cf61..4ab37271 100644
--- a/packages/images/src/components/footer.js
+++ b/packages/images/src/components/footer.js
@@ -30,12 +30,20 @@ const Link = styled.a`
 export default () => (
   <List>
     <ListItem>
-      <Link href="https://www.joyent.com/about/policies" target="_blank">
+      <Link
+        href="https://www.joyent.com/about/policies"
+        target="__blank"
+        rel="noopener noreferrer"
+      >
         Policies
       </Link>
     </ListItem>
     <ListItem>
-      <Link href="https://www.joyent.com/networking-and-security/security-compliance">
+      <Link
+        href="https://www.joyent.com/networking-and-security/security-compliance"
+        target="__blank"
+        rel="noopener noreferrer"
+      >
         Compliance
       </Link>
     </ListItem>
diff --git a/packages/images/src/components/image.js b/packages/images/src/components/image.js
index 7e9278ef..3fd8d8bd 100644
--- a/packages/images/src/components/image.js
+++ b/packages/images/src/components/image.js
@@ -36,6 +36,12 @@ const CardAnchor = styled(Anchor)`
   text-decoration: none;
 `;
 
+const ItemAnchor = styled(Anchor)`
+  color: ${props => props.theme.text};
+  -webkit-text-fill-color: currentcolor;
+  text-decoration: none;
+`;
+
 const Type = styled(Margin)`
   overflow: hidden;
   white-space: nowrap;
@@ -62,7 +68,15 @@ const Actions = styled(Flex)`
   min-width: 48px;
 `;
 
-export const Image = ({ name, os, version, type, removing, onRemove }) => (
+export const Image = ({
+  name,
+  os,
+  version,
+  type,
+  removing,
+  onRemove,
+  onCreateInstance
+}) => (
   <Margin bottom={3}>
     <CardAnchor to={`/${name}`} component={Link}>
       <Card radius>
@@ -108,14 +122,14 @@ export const Image = ({ name, os, version, type, removing, onRemove }) => (
                     <ActionsIcon />
                   </PopoverTarget>
                   <Popover placement="bottom">
-                    <PopoverItem disabled={false}>
-                      <Anchor
-                        noUnderline
-                        black
-                        href={`instances/~create/?image=${name}`}
+                    <PopoverItem disabled={false} onClick={onCreateInstance}>
+                      <ItemAnchor
+                        href={`http://localhost:3069/~create/?image=${name}`}
+                        target="__blank"
+                        rel="noopener noreferrer"
                       >
                         Create Instance
-                      </Anchor>
+                      </ItemAnchor>
                     </PopoverItem>
                     <PopoverDivider />
                     <PopoverItem disabled={removing} onClick={onRemove}>
diff --git a/packages/images/src/components/summary.js b/packages/images/src/components/summary.js
index 969b45e3..f57d1049 100644
--- a/packages/images/src/components/summary.js
+++ b/packages/images/src/components/summary.js
@@ -115,7 +115,9 @@ export default withTheme(({ theme = {}, onRemove, removing, ...image }) => (
                 <Medium>
                   <Button
                     type="button"
-                    href={`instances/~create/?image=${image.name}`}
+                    href={`http://localhost:3069/~create/?image=${image.name}`}
+                    target="__blank"
+                    rel="noopener noreferrer"
                     bold
                     icon
                   >
diff --git a/packages/images/src/containers/list.js b/packages/images/src/containers/list.js
index 07433797..fc7be560 100644
--- a/packages/images/src/containers/list.js
+++ b/packages/images/src/containers/list.js
@@ -37,6 +37,7 @@ export const List = ({
   error = null,
   history,
   typeValue,
+  handleCreateInstance,
   handleRemove
 }) => (
   <ViewContainer main>
@@ -78,7 +79,11 @@ export const List = ({
       <Row>
         {images.map(image => (
           <Col sm={4}>
-            <Image {...image} onRemove={() => handleRemove(image.id)} />
+            <Image
+              {...image}
+              onCreateInstance={() => handleCreateInstance(image)}
+              onRemove={() => handleRemove(image.id)}
+            />
           </Col>
         ))}
         {!images.length && !loading ? (
@@ -152,6 +157,10 @@ export default compose(
       };
     },
     (dispatch, { removeImage, history }) => ({
+      handleCreateInstance: image =>
+        window
+          .open(`http://localhost:3069/~create/?image=${image.name}`, '_blank')
+          .focus(),
       handleRemove: async id => {
         dispatch([set({ name: `remove-mutation-${id}-loading`, value: true })]);
 
diff --git a/packages/images/src/containers/tags.js b/packages/images/src/containers/tags.js
index 9b3d4be1..dcf9ff11 100644
--- a/packages/images/src/containers/tags.js
+++ b/packages/images/src/containers/tags.js
@@ -155,7 +155,7 @@ export default compose(
       handleRemoveTag: async name => {
         dispatch(set({ name: `${image.id}-mutating`, value: true }));
 
-        const [err, res] = await intercept(
+        const [err] = await intercept(
           updateTags({
             variables: {
               id: image.id,
@@ -180,7 +180,7 @@ export default compose(
       handleAddTag: async ({ name, value }) => {
         dispatch(set({ name: `${image.id}-mutating`, value: true }));
 
-        const [err, res] = await intercept(
+        const [err] = await intercept(
           updateTags({
             variables: {
               id: image.id,
diff --git a/packages/my-joy-beta/package.json b/packages/my-joy-beta/package.json
index c4dff16d..2e3930c9 100644
--- a/packages/my-joy-beta/package.json
+++ b/packages/my-joy-beta/package.json
@@ -25,9 +25,9 @@
     "constant-case": "^2.0.0",
     "date-fns": "^1.29.0",
     "declarative-redux-form": "^2.0.8",
-    "joyent-logo-assets": "^1.0.0",
     "execa": "^0.9.0",
     "inert": "^5.1.0",
+    "joyent-logo-assets": "^1.0.0",
     "joyent-manifest-editor": "^1.4.0",
     "joyent-react-scripts": "^7.3.0",
     "joyent-react-styled-flexboxgrid": "^2.2.3",
@@ -51,6 +51,7 @@
     "param-case": "^2.1.1",
     "prop-types": "^15.6.0",
     "punycode": "^2.1.0",
+    "query-string": "^5.1.0",
     "react": "^16.2.0",
     "react-apollo": "^2.0.4",
     "react-dom": "^16.2.0",
diff --git a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png
index a4d49ced..23d05a9e 100644
Binary files a/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png and b/packages/my-joy-beta/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
index e3387e8f..29d27750 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/cns.spec.js.snap
@@ -82,7 +82,8 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c9 + button {
+.c9 + button,
+.c9 + a {
   margin-left: 0.375rem;
 }
 
@@ -90,6 +91,11 @@ exports[`renders <AddServiceForm /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c8 + button,
+.c8 + a {
+  margin-left: 0.375rem;
+}
+
 .c7 {
   box-sizing: border-box;
   display: inline-block;
@@ -417,7 +423,8 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c9 + button {
+.c9 + button,
+.c9 + a {
   margin-left: 0.375rem;
 }
 
@@ -425,6 +432,11 @@ exports[`renders <AddServiceForm pristine /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c8 + button,
+.c8 + a {
+  margin-left: 0.375rem;
+}
+
 .c7 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
index 4467ec1e..7aa222e8 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/key-value.spec.js.snap
@@ -30,7 +30,8 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -38,6 +39,11 @@ exports[`renders <KeyValue /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -1299,7 +1305,8 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -1307,6 +1314,11 @@ exports[`renders <KeyValue input="input" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -2329,7 +2341,8 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -2350,6 +2363,11 @@ exports[`renders <KeyValue input="textarea" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -3417,7 +3435,8 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -3425,6 +3444,11 @@ exports[`renders <KeyValue method="add" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -4447,7 +4471,8 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -4455,6 +4480,11 @@ exports[`renders <KeyValue method="edit" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -5488,7 +5518,8 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -5549,6 +5580,11 @@ exports[`renders <KeyValue removing /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -6602,7 +6638,8 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -6663,6 +6700,11 @@ exports[`renders <KeyValue submitting /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c24 {
   box-sizing: border-box;
   display: inline-block;
@@ -7771,7 +7813,8 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -7779,6 +7822,11 @@ exports[`renders <KeyValue type="tag" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
index cee27331..09c2f640 100644
--- a/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/components/__tests__/__snapshots__/tags.spec.js.snap
@@ -47,7 +47,8 @@ exports[`renders <AddForm /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -55,6 +56,11 @@ exports[`renders <AddForm /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -1077,7 +1083,8 @@ exports[`renders <EditForm /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -1085,6 +1092,11 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png
index da044818..a5eb9335 100644
Binary files a/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png and b/packages/my-joy-beta/src/components/create-instance/__tests__/__image_snapshots__/images-ui-js-images-images-name-stuff-image-name-stuff-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
index e9387c57..017edda3 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/images.spec.js.snap
@@ -324,8 +324,10 @@ exports[`renders <Images images=[{name: stuff, imageName: stuff}] /> without thr
           onClick={[Function]}
         >
           <svg
+            height="42"
             id="image-img-stuff"
             viewBox="0 0 42 42"
+            width="42"
             xmlns="http://www.w3.org/2000/svg"
           >
             <title>
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
index 030e4bc4..50942b17 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/name.spec.js.snap
@@ -99,7 +99,8 @@ exports[`renders <Name /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c13 + button {
+.c13 + button,
+.c13 + a {
   margin-left: 0.375rem;
 }
 
@@ -107,6 +108,11 @@ exports[`renders <Name /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c12 + button,
+.c12 + a {
+  margin-left: 0.375rem;
+}
+
 .c11 {
   box-sizing: border-box;
   display: inline-block;
@@ -529,7 +535,8 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c13 + button {
+.c13 + button,
+.c13 + a {
   margin-left: 0.375rem;
 }
 
@@ -537,6 +544,11 @@ exports[`renders <Name expanded /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c12 + button,
+.c12 + a {
+  margin-left: 0.375rem;
+}
+
 .c11 {
   box-sizing: border-box;
   display: inline-block;
@@ -959,7 +971,8 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c13 + button {
+.c13 + button,
+.c13 + a {
   margin-left: 0.375rem;
 }
 
@@ -967,6 +980,11 @@ exports[`renders <Name name="test" /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c12 + button,
+.c12 + a {
+  margin-left: 0.375rem;
+}
+
 .c11 {
   box-sizing: border-box;
   display: inline-block;
@@ -1389,7 +1407,8 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c13 + button {
+.c13 + button,
+.c13 + a {
   margin-left: 0.375rem;
 }
 
@@ -1397,6 +1416,11 @@ exports[`renders <Name pristine={false} /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c12 + button,
+.c12 + a {
+  margin-left: 0.375rem;
+}
+
 .c11 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
index 6e745a4d..0ca814bd 100644
--- a/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
@@ -105,7 +105,8 @@ exports[`renders <Filters /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c16 + button {
+.c16 + button,
+.c16 + a {
   margin-left: 0.375rem;
 }
 
@@ -176,6 +177,11 @@ exports[`renders <Filters /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c15 + button,
+.c15 + a {
+  margin-left: 0.375rem;
+}
+
 .c14 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/create-instance/image.js b/packages/my-joy-beta/src/components/create-instance/image.js
index 9358bc62..bae1316c 100644
--- a/packages/my-joy-beta/src/components/create-instance/image.js
+++ b/packages/my-joy-beta/src/components/create-instance/image.js
@@ -59,7 +59,7 @@ const Image = ({ onClick, active, ...image }) => {
     <Col md={2} sm={3}>
       <Margin bottom={3}>
         <Card id={ids[0]} onClick={handleClick} active={active} preview>
-          <Logo id={ids[1]} />
+          <Logo id={ids[1]} width="42" height="42" />
           <H4>{titleCase(imageName)}</H4>
           <FormGroup name="image" field={Field}>
             <Version onBlur={null}>
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png
index b584e8d2..55d52b09 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/snapshots-ui-js-item-mutating-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png
index 5873626e..40abfac3 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-1-snap.png
index ec050e51..e31ba45a 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-2-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-2-snap.png
index 1f50b099..1a6ff87b 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-2-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-instance-2-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index 5849c0f6..3796564e 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-provisioning-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-provisioning-1-snap.png
index a09f69da..39914501 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-provisioning-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-provisioning-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-running-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-running-1-snap.png
index 4da743a5..a7a8bda8 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-running-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-running-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-stopped-1-snap.png b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-stopped-1-snap.png
index bc070755..c5fb184b 100644
Binary files a/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-stopped-1-snap.png and b/packages/my-joy-beta/src/components/instances/__tests__/__image_snapshots__/summary-ui-js-summary-state-stopped-1-snap.png differ
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
index d99d726c..b740f130 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/list.spec.js.snap
@@ -3611,7 +3611,7 @@ exports[`renders <Item /> without throwing 1`] = `
       >
         <a
           className="c11 c12 c13"
-          to="/instances/undefined"
+          to="/undefined"
         />
       </td>
       <td
@@ -4090,7 +4090,7 @@ exports[`renders <Item {...item} /> without throwing 1`] = `
       >
         <a
           className="c11 c12 c13"
-          to="/instances/name"
+          to="/name"
         >
           name
         </a>
@@ -4571,7 +4571,7 @@ exports[`renders <Item allowedActions /> without throwing 1`] = `
       >
         <a
           className="c11 c12 c13"
-          to="/instances/undefined"
+          to="/undefined"
         />
       </td>
       <td
@@ -5078,7 +5078,7 @@ exports[`renders <Item mutating /> without throwing 1`] = `
       >
         <a
           className="c11 c12 c13"
-          to="/instances/undefined"
+          to="/undefined"
         />
       </td>
       <td
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
index cb25b8ce..f5bcb1e9 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -30,7 +30,8 @@ exports[`renders <AddForm /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -51,6 +52,11 @@ exports[`renders <AddForm /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -1118,7 +1124,8 @@ exports[`renders <EditForm /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -1139,6 +1146,11 @@ exports[`renders <EditForm /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
 .c23 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
index 1d71e7ad..9218649b 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -88,7 +88,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: block;
 }
 
-.c22 {
+.c25 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -98,7 +98,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: block;
 }
 
-.c27 {
+.c30 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -117,7 +117,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-top: 0.375rem;
 }
 
-.c25 {
+.c28 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -126,7 +126,14 @@ exports[`renders <Summary /> without throwing 1`] = `
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -140,30 +147,43 @@ exports[`renders <Summary /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
 
-.c31 {
+.c34 {
   cursor: pointer;
 }
 
@@ -171,6 +191,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
 .c18 {
   box-sizing: border-box;
   display: inline-block;
@@ -214,11 +239,6 @@ exports[`renders <Summary /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -276,23 +296,6 @@ exports[`renders <Summary /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c18 svg + span {
   margin-left: 0.75rem;
 }
@@ -301,7 +304,137 @@ exports[`renders <Summary /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c22:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c22:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c22[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c22:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c22 svg {
+  max-height: 1.125rem;
+}
+
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -360,7 +493,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c21:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -368,68 +501,68 @@ exports[`renders <Summary /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c21:focus {
+.c24:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c21 svg + span {
+.c24 svg + span {
   margin-left: 0.75rem;
 }
 
-.c21 svg {
+.c24 svg {
   max-height: 1.125rem;
 }
 
-.c23 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -495,7 +628,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   float: right;
 }
 
-.c23:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -503,87 +636,87 @@ exports[`renders <Summary /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c26:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c23:focus {
+.c26:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c23:hover {
+.c26:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c23:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23 svg + span {
+.c26 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
+.c26 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -647,7 +780,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   float: right;
 }
 
-.c24:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -655,83 +788,83 @@ exports[`renders <Summary /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c24:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c24:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
@@ -746,7 +879,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   text-align: left;
 }
 
-.c28 {
+.c31 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -782,7 +915,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c26 {
+.c29 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -863,7 +996,7 @@ exports[`renders <Summary /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c30 {
+.c33 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -888,62 +1021,62 @@ exports[`renders <Summary /> without throwing 1`] = `
   outline: 0;
 }
 
-.c30::-webkit-input-placeholder {
+.c33::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30::-moz-placeholder {
+.c33::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:-ms-input-placeholder {
+.c33:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:invalid {
+.c33:invalid {
   box-shadow: none;
 }
 
-.c30:disabled {
+.c33:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c30:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled {
+.c33:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:focus {
+.c33:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c32 {
+.c35 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -966,62 +1099,62 @@ exports[`renders <Summary /> without throwing 1`] = `
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c35::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c35::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c35:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c35:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c35:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled {
+.c35:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:focus {
+.c35:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
+.c32 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1033,11 +1166,11 @@ exports[`renders <Summary /> without throwing 1`] = `
   align-items: center;
 }
 
-.c29 input {
+.c32 input {
   padding-right: 1.875rem;
 }
 
-.c29 div {
+.c32 div {
   position: relative;
   left: -1.625rem;
 }
@@ -1140,7 +1273,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c25 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -1149,7 +1282,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c30 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -1158,7 +1291,7 @@ exports[`renders <Summary /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c27 {
+  .c30 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -1290,12 +1423,38 @@ exports[`renders <Summary /> without throwing 1`] = `
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1327,7 +1486,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1362,7 +1521,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1394,7 +1553,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1429,7 +1588,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1477,7 +1636,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1525,14 +1684,14 @@ exports[`renders <Summary /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c22"
+              className="c25"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c26 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1564,7 +1723,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c19 c20"
+                  className="c27 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -1597,10 +1756,10 @@ exports[`renders <Summary /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c25"
+            className="c28"
           >
             <div
-              className="c26 c0"
+              className="c29 c0"
               height="0.0625rem"
             />
           </div>
@@ -1608,19 +1767,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1633,7 +1792,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1659,19 +1818,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1684,7 +1843,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1710,19 +1869,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1735,7 +1894,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1761,19 +1920,19 @@ exports[`renders <Summary /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c32"
+                  className="c35"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -1786,7 +1945,7 @@ exports[`renders <Summary /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -1903,7 +2062,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: block;
 }
 
-.c24 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1913,7 +2072,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: block;
 }
 
-.c29 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1932,7 +2091,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-top: 0.375rem;
 }
 
-.c27 {
+.c29 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -1941,7 +2100,14 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -1955,30 +2121,43 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
 
-.c33 {
+.c35 {
   cursor: pointer;
 }
 
@@ -1986,6 +2165,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
 .c18 {
   box-sizing: border-box;
   display: inline-block;
@@ -2029,11 +2213,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -2091,23 +2270,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c18 svg + span {
   margin-left: 0.75rem;
 }
@@ -2116,7 +2278,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2164,129 +2326,6 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c21:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -2344,6 +2383,23 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(216,216,216);
 }
 
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c22 svg + span {
   margin-left: 0.75rem;
 }
@@ -2352,7 +2408,135 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   max-height: 1.125rem;
 }
 
-.c23 {
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c24:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2406,7 +2590,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   font-weight: 500;
 }
 
-.c23:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2414,51 +2598,51 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c25:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c23 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
+.c25 svg {
   max-height: 1.125rem;
 }
 
-.c25 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2519,7 +2703,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   float: right;
 }
 
-.c25:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2527,70 +2711,70 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c25 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c25 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
-.c26 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -2649,7 +2833,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   float: right;
 }
 
-.c26:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -2657,66 +2841,66 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -2731,7 +2915,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   text-align: left;
 }
 
-.c30 {
+.c32 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -2767,7 +2951,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-top: 1.5rem;
 }
 
-.c28 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -2849,7 +3033,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c32 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -2872,62 +3056,62 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled {
+.c34:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2939,16 +3123,16 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   align-items: center;
 }
 
-.c31 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c31 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c34 {
+.c36 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2961,11 +3145,11 @@ exports[`renders <Summary instance /> without throwing 1`] = `
   margin-bottom: 0rem;
 }
 
-.c34 input {
+.c36 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c36 div {
   position: relative;
   left: -1.625rem;
 }
@@ -3068,7 +3252,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c24 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -3077,7 +3261,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -3086,7 +3270,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -3220,12 +3404,38 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3257,7 +3467,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -3292,7 +3502,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c18 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3324,7 +3534,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3359,7 +3569,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c18 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3407,7 +3617,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3455,14 +3665,14 @@ exports[`renders <Summary instance /> without throwing 1`] = `
               </span>
             </div>
             <div
-              className="c24"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c19 c20"
+                  className="c27 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3494,7 +3704,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c19 c20"
+                  className="c28 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -3527,10 +3737,10 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             </div>
           </div>
           <div
-            className="c27"
+            className="c29"
           >
             <div
-              className="c28 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -3538,19 +3748,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3563,7 +3773,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3589,19 +3799,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3614,7 +3824,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3640,19 +3850,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3665,7 +3875,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3691,19 +3901,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3716,7 +3926,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3742,19 +3952,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3767,7 +3977,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3793,19 +4003,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 IP address 1
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3818,7 +4028,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3844,19 +4054,19 @@ exports[`renders <Summary instance /> without throwing 1`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 IP address 2
               </label>
               <div
-                className="c34"
+                className="c36"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -3869,7 +4079,7 @@ exports[`renders <Summary instance /> without throwing 1`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -3986,7 +4196,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: block;
 }
 
-.c24 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3996,7 +4206,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: block;
 }
 
-.c29 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -4015,7 +4225,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-top: 0.375rem;
 }
 
-.c27 {
+.c29 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -4024,7 +4234,14 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -4038,30 +4255,43 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
 
-.c33 {
+.c35 {
   cursor: pointer;
 }
 
@@ -4069,6 +4299,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   display: inline-block;
 }
 
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
 .c18 {
   box-sizing: border-box;
   display: inline-block;
@@ -4112,11 +4347,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -4174,23 +4404,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c18 svg + span {
   margin-left: 0.75rem;
 }
@@ -4199,7 +4412,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4247,129 +4460,6 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c21:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -4427,6 +4517,23 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(216,216,216);
 }
 
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c22 svg + span {
   margin-left: 0.75rem;
 }
@@ -4435,7 +4542,135 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c23 {
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c24:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4489,7 +4724,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c23:focus {
+.c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4497,51 +4732,51 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c25:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c25[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c25:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c25:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c23 svg + span {
+.c25 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
+.c25 svg {
   max-height: 1.125rem;
 }
 
-.c25 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4602,7 +4837,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   float: right;
 }
 
-.c25:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4610,70 +4845,70 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c25 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c25 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
-.c26 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -4732,7 +4967,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   float: right;
 }
 
-.c26:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -4740,66 +4975,66 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -4814,7 +5049,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   text-align: left;
 }
 
-.c30 {
+.c32 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -4850,7 +5085,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c28 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -4932,7 +5167,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c32 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -4955,62 +5190,62 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c34::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c34:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c34:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c34:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled {
+.c34:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c34:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-moz-placeholder {
+.c34:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c34:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:focus {
+.c34:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c31 {
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5022,16 +5257,16 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   align-items: center;
 }
 
-.c31 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c31 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c34 {
+.c36 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -5044,11 +5279,11 @@ exports[`renders <Summary instance /> without throwing 2`] = `
   margin-bottom: 0rem;
 }
 
-.c34 input {
+.c36 input {
   padding-right: 1.875rem;
 }
 
-.c34 div {
+.c36 div {
   position: relative;
   left: -1.625rem;
 }
@@ -5151,7 +5386,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c24 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -5160,7 +5395,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -5169,7 +5404,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -5303,12 +5538,38 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5340,7 +5601,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -5375,7 +5636,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c18 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5407,7 +5668,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5442,7 +5703,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c18 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5490,7 +5751,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5538,14 +5799,14 @@ exports[`renders <Summary instance /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c24"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c19 c20"
+                  className="c27 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5577,7 +5838,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c19 c20"
+                  className="c28 c19 c23"
                   disabled={false}
                   href=""
                   icon={true}
@@ -5610,10 +5871,10 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c27"
+            className="c29"
           >
             <div
-              className="c28 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -5621,19 +5882,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5646,7 +5907,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5672,19 +5933,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5697,7 +5958,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5723,19 +5984,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5748,7 +6009,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5774,19 +6035,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Image UUID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5799,7 +6060,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5825,19 +6086,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5850,7 +6111,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5876,19 +6137,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 IP address 1
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5901,7 +6162,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -5927,19 +6188,19 @@ exports[`renders <Summary instance /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 IP address 2
               </label>
               <div
-                className="c34"
+                className="c36"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -5952,7 +6213,7 @@ exports[`renders <Summary instance /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -6069,6 +6330,2085 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
+.c29 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c34 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c8 {
+  margin-top: 0.75rem;
+  margin-bottom: 1.125rem;
+}
+
+.c14 {
+  margin-top: 0.375rem;
+}
+
+.c32 {
+  margin-top: 1.5rem;
+  margin-bottom: 1.875rem;
+}
+
+.c4 {
+  padding: 1.5rem;
+}
+
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
+  font-family: sans-serif;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+  overflow: visible;
+  -webkit-text-transform: none;
+  text-transform: none;
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+  min-width: 7.5rem;
+}
+
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
+  outline: 0.0625rem dotted ButtonText;
+}
+
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.c12 {
+  margin-right: 0.375rem;
+}
+
+.c38 {
+  cursor: pointer;
+}
+
+.c25 {
+  fill: rgb(59,70,204);
+  stroke: rgb(59,70,204);
+  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
+  animation: iCqDak 1.5s ease-out 0s infinite;
+}
+
+.c26 {
+  fill: rgb(59,70,204);
+  stroke: rgb(59,70,204);
+  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
+  animation: iCqDak 1.5s ease-out 0s infinite;
+  -webkit-animation-delay: 0.5s;
+  animation-delay: 0.5s;
+}
+
+.c27 {
+  fill: rgb(59,70,204);
+  stroke: rgb(59,70,204);
+  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
+  animation: iCqDak 1.5s ease-out 0s infinite;
+  -webkit-animation-delay: 1s;
+  animation-delay: 1s;
+}
+
+.c24 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-content: center;
+  -ms-flex-line-pack: center;
+  align-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 1.25rem;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+}
+
+.c19 {
+  display: inline-block;
+}
+
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
+.c18 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c18:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c18:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c18[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c18:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c18:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c18 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c18 svg {
+  max-height: 1.125rem;
+}
+
+.c22 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c22:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c22:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c22[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c22:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c22 svg {
+  max-height: 1.125rem;
+}
+
+.c28 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c28:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c28:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c28[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c28:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c28:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c28:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c28 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c28 svg {
+  max-height: 1.125rem;
+}
+
+.c30 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  float: right;
+}
+
+.c30:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c30:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c30[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c30:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c30:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c30:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c30:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c30:active,
+.c30:active:hover,
+.c30:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c30 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c30 svg {
+  max-height: 1.125rem;
+}
+
+.c31 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  color: rgb(210,67,58);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(210,67,58);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+  float: right;
+}
+
+.c31:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c31:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c31[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c31:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c31:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c31:focus {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c31:hover {
+  color: rgb(205,37,27);
+  background-color: rgb(255,255,255);
+  border-color: rgb(205,37,27);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-color: rgba(210,67,58,0.1);
+  border-color: rgb(205,37,27);
+}
+
+.c31:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c31:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c31:active,
+.c31:active:hover,
+.c31:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c31 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c31 svg {
+  max-height: 1.125rem;
+}
+
+.c10 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  -webkit-text-align: left;
+  text-align: left;
+}
+
+.c35 {
+  font-size: 0.9375rem;
+  line-height: 1.125rem;
+  font-style: normal;
+  font-stretch: normal;
+  display: block;
+  color: rgb(70,70,70);
+  -webkit-text-align: left;
+  text-align: left;
+  margin-right: 0.75rem;
+  font-weight: 600;
+  white-space: pre;
+  font-size: 0.8125rem;
+}
+
+.c7 {
+  color: rgba(73,73,73,1);
+  font-weight: normal;
+  line-height: 1.875rem;
+  font-size: 1.5rem;
+  margin: 0;
+}
+
+.c7 + p,
+.c7 + small,
+.c7 + h1,
+.c7 + h2,
+.c7 + label,
+.c7 + h3,
+.c7 + h4,
+.c7 + h5,
+.c7 + div,
+.c7 + span {
+  margin-top: 1.5rem;
+}
+
+.c33 {
+  background-color: rgb(216,216,216);
+  margin: 0;
+  height: 0.0625rem;
+}
+
+.c13 {
+  width: 0.9375rem;
+  height: 0.9375rem;
+  border-radius: 50%;
+  display: inline-block;
+  margin-right: 0rem;
+  margin-left: 0rem;
+}
+
+.c2 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c3 {
+  box-sizing: content-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 0 auto;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  border-width: 0.0625rem;
+  border-style: solid;
+  -webkit-transition: all 300ms ease;
+  transition: all 300ms ease;
+  color: rgba(73,73,73,1);
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  box-sizing: border-box;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  border-width: 0;
+  margin-bottom: 0;
+  background-color: transparent;
+}
+
+.c3 > [name='card']:not(:last-child) {
+  margin-bottom: 0.8125rem;
+}
+
+.c3 > [name='card']:last-child {
+  margin-bottom: 0.4375rem;
+}
+
+.c37 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  padding: 0.8125rem 1.125rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-family: "Roboto Mono",monospace;
+  width: 100%;
+  min-width: 100%;
+  -webkit-text-overflow: ellipsis;
+  text-overflow: ellipsis;
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+}
+
+.c37::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37:invalid {
+  box-shadow: none;
+}
+
+.c37:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c37:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c37:disabled {
+  color: rgba(73,73,73,1);
+}
+
+.c37:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c37:disabled::-moz-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c37:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c37:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c39 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  padding: 0.8125rem 1.125rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-family: "Roboto Mono",monospace;
+  width: 100%;
+  min-width: 100%;
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+}
+
+.c39::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39:invalid {
+  box-shadow: none;
+}
+
+.c39:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c39:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c39:disabled {
+  color: rgba(73,73,73,1);
+}
+
+.c39:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c39:disabled::-moz-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c39:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c39:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c36 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  margin-bottom: 0.625rem;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c36 input {
+  padding-right: 1.875rem;
+}
+
+.c36 div {
+  position: relative;
+  left: -1.625rem;
+}
+
+.c15 {
+  opacity: 0.5;
+  padding-right: 0.1875rem;
+}
+
+.c9 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+}
+
+.c11 {
+  width: 0.0625rem;
+  background: rgb(216,216,216);
+  height: 1.5rem;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-self: flex-end;
+  -ms-flex-item-align: end;
+  align-self: flex-end;
+  margin: 0 1.125rem;
+}
+
+@media only screen and (min-width:0em) {
+  .c5 {
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c16 {
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c1 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:48em) {
+  .c1 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c1 {
+    -webkit-flex-basis: 75%;
+    -ms-flex-preferred-size: 75%;
+    flex-basis: 75%;
+    max-width: 75%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c6 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c17 {
+    -webkit-flex-basis: 75%;
+    -ms-flex-preferred-size: 75%;
+    flex-basis: 75%;
+    max-width: 75%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c29 {
+    -webkit-flex-basis: 25%;
+    -ms-flex-preferred-size: 25%;
+    flex-basis: 25%;
+    max-width: 25%;
+  }
+}
+
+@media only screen and (min-width:0em) {
+  .c34 {
+    -webkit-flex-basis: 100%;
+    -ms-flex-preferred-size: 100%;
+    flex-basis: 100%;
+    max-width: 100%;
+  }
+}
+
+@media only screen and (min-width:64em) {
+  .c34 {
+    -webkit-flex-basis: 58.333333333333336%;
+    -ms-flex-preferred-size: 58.333333333333336%;
+    flex-basis: 58.333333333333336%;
+    max-width: 58.333333333333336%;
+  }
+}
+
+@media (max-width:47.9375rem) {
+  .c9 {
+    display: block;
+  }
+}
+
+@media (max-width:47.9375rem) {
+  .c11 {
+    display: none;
+  }
+}
+
+<div
+  className="c0"
+>
+  <div
+    className="c1"
+  >
+    <div
+      className="c2"
+      disabled={false}
+      name="card"
+    >
+      <div
+        className="c3"
+        name="card-outlet"
+      >
+        <div
+          className="c4"
+        >
+          <div
+            className="c5"
+          >
+            <div
+              className="c6"
+            >
+              <h2
+                className="c7"
+              />
+            </div>
+          </div>
+          <div
+            className="c8"
+          >
+            <div
+              className="c9"
+            >
+              <label
+                className="c10"
+              >
+                Custom Image
+              </label>
+              <div
+                className="c11"
+              />
+              <label
+                className="c10"
+              >
+                Hardware Virtual Machine
+              </label>
+              <div
+                className="c11"
+              />
+              <div
+                className="c9"
+              >
+                <span
+                  className="c12 c13"
+                  color={undefined}
+                  size="0.9375rem"
+                />
+                
+              </div>
+            </div>
+            <div
+              className="c14"
+            >
+              <div
+                className="c9"
+              >
+                <div
+                  className="c9"
+                >
+                  <label
+                    className="c15 c10"
+                  >
+                    Created: 
+                  </label>
+                  <label
+                    className="c10"
+                  >
+                     
+                    almost NaN years
+                     ago
+                  </label>
+                </div>
+                <div
+                  className="c11"
+                />
+                <div
+                  className="c9"
+                >
+                  <label
+                    className="c15 c10"
+                  >
+                    Updated: 
+                  </label>
+                  <label
+                    className="c10"
+                  >
+                     
+                    almost NaN years
+                     ago
+                  </label>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="c16"
+          >
+            <div
+              className="c17"
+            >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (max-width: 47.9375rem)"
+              >
+                <button
+                  className="c22 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (min-width: 48rem)"
+              >
+                <button
+                  className="c28 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (max-width: 47.9375rem)"
+              >
+                <button
+                  className="c22 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (min-width: 48rem)"
+              >
+                <button
+                  className="c28 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (max-width: 47.9375rem)"
+              >
+                <button
+                  className="c22 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (min-width: 48rem)"
+              >
+                <button
+                  className="c28 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+            </div>
+            <div
+              className="c29"
+            >
+              <span
+                name="react-responsive-mock"
+                query="only screen and (max-width: 47.9375rem)"
+              >
+                <button
+                  className="c30 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+              <span
+                name="react-responsive-mock"
+                query="only screen and (min-width: 48rem)"
+              >
+                <button
+                  className="c31 c19 c23"
+                  disabled={true}
+                  href=""
+                  icon={true}
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <div
+                    className="c24"
+                  >
+                    <svg
+                      height="10"
+                      width="28"
+                    >
+                      <rect
+                        className="c25"
+                        height="6"
+                        width="6"
+                        x="2"
+                        y="2"
+                      />
+                      <rect
+                        className="c26"
+                        height="6"
+                        width="6"
+                        x="11"
+                        y="2"
+                      />
+                      <rect
+                        className="c27"
+                        height="6"
+                        width="6"
+                        x="20"
+                        y="2"
+                      />
+                    </svg>
+                  </div>
+                </button>
+              </span>
+            </div>
+          </div>
+          <div
+            className="c32"
+          >
+            <div
+              className="c33 c0"
+              height="0.0625rem"
+            />
+          </div>
+          <div
+            className="c0"
+          >
+            <div
+              className="c34"
+            >
+              <label
+                className="c35"
+                htmlFor=""
+              >
+                Short ID
+              </label>
+              <div
+                className="c36"
+              >
+                <input
+                  className="c37"
+                  disabled={false}
+                  id=""
+                  onBlur={null}
+                  value=""
+                />
+                <div
+                  onClick={undefined}
+                  onMouseEnter={[Function]}
+                  onMouseLeave={[Function]}
+                  tag={false}
+                >
+                  <svg
+                    className="c38"
+                    height="19"
+                    innerRef={undefined}
+                    onClick={[Function]}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 15 19"
+                    width="15"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="c0"
+          >
+            <div
+              className="c34"
+            >
+              <label
+                className="c35"
+                htmlFor=""
+              >
+                ID
+              </label>
+              <div
+                className="c36"
+              >
+                <input
+                  className="c37"
+                  disabled={false}
+                  id=""
+                  onBlur={null}
+                  value={undefined}
+                />
+                <div
+                  onClick={undefined}
+                  onMouseEnter={[Function]}
+                  onMouseLeave={[Function]}
+                  tag={false}
+                >
+                  <svg
+                    className="c38"
+                    height="19"
+                    innerRef={undefined}
+                    onClick={[Function]}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 15 19"
+                    width="15"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="c0"
+          >
+            <div
+              className="c34"
+            >
+              <label
+                className="c35"
+                htmlFor=""
+              >
+                CN UUID
+              </label>
+              <div
+                className="c36"
+              >
+                <input
+                  className="c37"
+                  disabled={false}
+                  id=""
+                  onBlur={null}
+                  value={undefined}
+                />
+                <div
+                  onClick={undefined}
+                  onMouseEnter={[Function]}
+                  onMouseLeave={[Function]}
+                  tag={false}
+                >
+                  <svg
+                    className="c38"
+                    height="19"
+                    innerRef={undefined}
+                    onClick={[Function]}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 15 19"
+                    width="15"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="c0"
+          >
+            <div
+              className="c34"
+            >
+              <label
+                className="c35"
+                htmlFor=""
+              >
+                Login
+              </label>
+              <div
+                className="c36"
+              >
+                <input
+                  className="c39"
+                  disabled={false}
+                  id=""
+                  onBlur={null}
+                  value="ssh root@undefined"
+                />
+                <div
+                  onClick={undefined}
+                  onMouseEnter={[Function]}
+                  onMouseLeave={[Function]}
+                  tag={false}
+                >
+                  <svg
+                    className="c38"
+                    height="19"
+                    innerRef={undefined}
+                    onClick={[Function]}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 15 19"
+                    width="15"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`renders <Summary state /> without throwing 1`] = `
+.c0 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c5 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c16 {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1 1 auto;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.c1 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c6 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
+.c17 {
+  box-sizing: border-box;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  padding-right: 0.625rem;
+  padding-left: 0.625rem;
+  display: block;
+}
+
 .c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
@@ -6107,7 +8447,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -6121,25 +8468,38 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
@@ -6148,64 +8508,124 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   cursor: pointer;
 }
 
-.c22 {
-  fill: rgb(59,70,204);
-  stroke: rgb(59,70,204);
-  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
-  animation: iCqDak 1.5s ease-out 0s infinite;
-}
-
-.c23 {
-  fill: rgb(59,70,204);
-  stroke: rgb(59,70,204);
-  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
-  animation: iCqDak 1.5s ease-out 0s infinite;
-  -webkit-animation-delay: 0.5s;
-  animation-delay: 0.5s;
-}
-
-.c24 {
-  fill: rgb(59,70,204);
-  stroke: rgb(59,70,204);
-  -webkit-animation: iCqDak 1.5s ease-out 0s infinite;
-  animation: iCqDak 1.5s ease-out 0s infinite;
-  -webkit-animation-delay: 1s;
-  animation-delay: 1s;
-}
-
-.c21 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-content: center;
-  -ms-flex-line-pack: center;
-  align-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 1.25rem;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-}
-
 .c19 {
   display: inline-block;
 }
 
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
 .c18 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c18:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c18:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c18[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c18:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c18:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c18:active,
+.c18:active:hover,
+.c18:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c18 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c18 svg {
+  max-height: 1.125rem;
+}
+
+.c22 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6266,7 +8686,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c18:focus {
+.c22:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -6274,68 +8694,68 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c18:hover {
+.c22:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c18[disabled] {
+.c22[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c18:focus {
+.c22:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c22:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
+.c22:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c18:hover {
+.c22:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c18 svg + span {
+.c22 svg + span {
   margin-left: 0.75rem;
 }
 
-.c18 svg {
+.c22 svg {
   max-height: 1.125rem;
 }
 
-.c25 {
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -6394,6 +8814,129 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
+.c24:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
 .c25:focus {
   outline: 0;
   -webkit-text-decoration: none;
@@ -6438,23 +8981,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
-.c25:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c25 svg + span {
   margin-left: 0.75rem;
 }
@@ -6510,11 +9036,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -6592,23 +9113,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(205,37,27);
 }
 
-.c27:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c27:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c27 svg + span {
   margin-left: 0.75rem;
 }
@@ -6664,11 +9168,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(210,67,58);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -6744,23 +9243,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(205,37,27);
 }
 
-.c28:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c28:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c28:active,
-.c28:active:hover,
-.c28:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c28 svg + span {
   margin-left: 0.75rem;
 }
@@ -6826,6 +9308,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   width: 0.9375rem;
   height: 0.9375rem;
   border-radius: 50%;
+  background-color: rgb(0,152,88);
   display: inline-block;
   margin-right: 0rem;
   margin-left: 0rem;
@@ -7268,10 +9751,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               >
                 <span
                   className="c12 c13"
-                  color={undefined}
+                  color="green"
                   size="0.9375rem"
                 />
-                
+                Running
               </div>
             </div>
             <div
@@ -7324,48 +9807,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="14"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 13.36 14"
+                    width="13.36"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M2.53,1.68a.81.81,0,0,1,.39.1l8.31,4.48a.84.84,0,0,1,0,1.48L2.92,12.22a.81.81,0,0,1-.39.1.85.85,0,0,1-.85-.85V2.53a.85.85,0,0,1,.85-.85M2.53,0A2.53,2.53,0,0,0,0,2.53v8.94A2.53,2.53,0,0,0,3.72,13.7L12,9.22a2.52,2.52,0,0,0,0-4.44L3.72.3A2.5,2.5,0,0,0,2.53,0Z"
+                      fill="rgb(216, 216, 216)"
+                    />
+                  </svg>
                 </button>
               </span>
               <span
@@ -7373,43 +9870,34 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="14"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 13.36 14"
+                    width="13.36"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M2.53,1.68a.81.81,0,0,1,.39.1l8.31,4.48a.84.84,0,0,1,0,1.48L2.92,12.22a.81.81,0,0,1-.39.1.85.85,0,0,1-.85-.85V2.53a.85.85,0,0,1,.85-.85M2.53,0A2.53,2.53,0,0,0,0,2.53v8.94A2.53,2.53,0,0,0,3.72,13.7L12,9.22a2.52,2.52,0,0,0,0-4.44L3.72.3A2.5,2.5,0,0,0,2.53,0Z"
+                      fill="rgb(216, 216, 216)"
+                    />
+                  </svg>
+                  <span>
+                    Start
+                  </span>
                 </button>
               </span>
               <span
@@ -7417,43 +9905,31 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
-                  disabled={true}
+                  className="c18 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="14"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 14 14"
+                    width="14"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M10.75,1.75a1.5,1.5,0,0,1,1.5,1.5v7.5a1.5,1.5,0,0,1-1.5,1.5H3.25a1.5,1.5,0,0,1-1.5-1.5V3.25a1.5,1.5,0,0,1,1.5-1.5h7.5m0-1.75H3.25A3.26,3.26,0,0,0,0,3.25v7.5A3.26,3.26,0,0,0,3.25,14h7.5A3.26,3.26,0,0,0,14,10.75V3.25A3.26,3.26,0,0,0,10.75,0Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
                 </button>
               </span>
               <span
@@ -7461,43 +9937,34 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c19 c20"
-                  disabled={true}
+                  className="c25 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="14"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 14 14"
+                    width="14"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M10.75,1.75a1.5,1.5,0,0,1,1.5,1.5v7.5a1.5,1.5,0,0,1-1.5,1.5H3.25a1.5,1.5,0,0,1-1.5-1.5V3.25a1.5,1.5,0,0,1,1.5-1.5h7.5m0-1.75H3.25A3.26,3.26,0,0,0,0,3.25v7.5A3.26,3.26,0,0,0,3.25,14h7.5A3.26,3.26,0,0,0,14,10.75V3.25A3.26,3.26,0,0,0,10.75,0Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                  <span>
+                    Stop
+                  </span>
                 </button>
               </span>
               <span
@@ -7505,43 +9972,47 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
-                  disabled={true}
+                  className="c18 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="21"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    version="1.1"
+                    viewBox="0 0 20 21"
+                    width="20"
+                    xmlns="http://www.w3.org/2000/svg"
+                    xmlnsXlink="http://www.w3.org/1999/xlink"
                   >
-                    <svg
-                      height="10"
-                      width="28"
+                    <g
+                      transform="translate(17997 -18577)"
                     >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
+                      <g>
+                        <use
+                          fill="rgba(73, 73, 73, 1)"
+                          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                          xlinkHref="#f"
+                        />
+                      </g>
+                    </g>
+                    <defs>
+                      <path
+                        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                        fillRule="evenodd"
+                        id="f"
                       />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    </defs>
+                  </svg>
                 </button>
               </span>
               <span
@@ -7549,43 +10020,50 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c25 c19 c20"
-                  disabled={true}
+                  className="c25 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="21"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    version="1.1"
+                    viewBox="0 0 20 21"
+                    width="20"
+                    xmlns="http://www.w3.org/2000/svg"
+                    xmlnsXlink="http://www.w3.org/1999/xlink"
                   >
-                    <svg
-                      height="10"
-                      width="28"
+                    <g
+                      transform="translate(17997 -18577)"
                     >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
+                      <g>
+                        <use
+                          fill="rgba(73, 73, 73, 1)"
+                          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
+                          xlinkHref="#f"
+                        />
+                      </g>
+                    </g>
+                    <defs>
+                      <path
+                        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
+                        fillRule="evenodd"
+                        id="f"
                       />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    </defs>
+                  </svg>
+                  <span>
+                    Reboot
+                  </span>
                 </button>
               </span>
             </div>
@@ -7597,43 +10075,31 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c27 c19 c20"
-                  disabled={true}
+                  className="c27 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="16"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 12 16"
+                    width="12"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
+                      fill="rgb(210, 67, 58)"
+                    />
+                  </svg>
                 </button>
               </span>
               <span
@@ -7641,43 +10107,34 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c28 c19 c20"
-                  disabled={true}
+                  className="c28 c19 c23"
+                  disabled={false}
                   href=""
                   icon={true}
                   onClick={[Function]}
                   type="button"
                 >
-                  <div
-                    className="c21"
+                  <svg
+                    className=""
+                    height="16"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 12 16"
+                    width="12"
+                    xmlns="http://www.w3.org/2000/svg"
                   >
-                    <svg
-                      height="10"
-                      width="28"
-                    >
-                      <rect
-                        className="c22"
-                        height="6"
-                        width="6"
-                        x="2"
-                        y="2"
-                      />
-                      <rect
-                        className="c23"
-                        height="6"
-                        width="6"
-                        x="11"
-                        y="2"
-                      />
-                      <rect
-                        className="c24"
-                        height="6"
-                        width="6"
-                        x="20"
-                        y="2"
-                      />
-                    </svg>
-                  </div>
+                    <path
+                      d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
+                      fill="rgb(210, 67, 58)"
+                    />
+                  </svg>
+                  <span>
+                    Remove
+                  </span>
                 </button>
               </span>
             </div>
@@ -7901,1992 +10358,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 </div>
 `;
 
-exports[`renders <Summary state /> without throwing 1`] = `
-.c0 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c5 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c16 {
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-flex-wrap: wrap;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-right: -0.625rem;
-  margin-left: -0.625rem;
-}
-
-.c1 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c6 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c17 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c24 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c29 {
-  box-sizing: border-box;
-  -webkit-flex: 0 0 auto;
-  -ms-flex: 0 0 auto;
-  flex: 0 0 auto;
-  padding-right: 0.625rem;
-  padding-left: 0.625rem;
-  display: block;
-}
-
-.c8 {
-  margin-top: 0.75rem;
-  margin-bottom: 1.125rem;
-}
-
-.c14 {
-  margin-top: 0.375rem;
-}
-
-.c27 {
-  margin-top: 1.5rem;
-  margin-bottom: 1.875rem;
-}
-
-.c4 {
-  padding: 1.5rem;
-}
-
-.c20 {
-  font-family: sans-serif;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0;
-  overflow: visible;
-  -webkit-text-transform: none;
-  text-transform: none;
-  -webkit-appearance: button;
-  -moz-appearance: button;
-  appearance: button;
-  min-width: 7.5rem;
-}
-
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
-  outline: 0.0625rem dotted ButtonText;
-}
-
-.c20 + button {
-  margin-left: 0.375rem;
-}
-
-.c12 {
-  margin-right: 0.375rem;
-}
-
-.c33 {
-  cursor: pointer;
-}
-
-.c19 {
-  display: inline-block;
-}
-
-.c18 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c18:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c18:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c18[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c18:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c18:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c18 svg {
-  max-height: 1.125rem;
-}
-
-.c21 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c21:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c21:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c21[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c21:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c21:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c21:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c21 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c21 svg {
-  max-height: 1.125rem;
-}
-
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c22:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.c23 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c23:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c23:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c23[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c23:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c23:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c23 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c23 svg {
-  max-height: 1.125rem;
-}
-
-.c25 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  float: right;
-}
-
-.c25:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c25:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c25[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c25:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c25:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c25:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c25:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c25 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c25 svg {
-  max-height: 1.125rem;
-}
-
-.c26 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  color: rgb(210,67,58);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(210,67,58);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-  float: right;
-}
-
-.c26:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c26:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c26[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c26:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c26:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c26:focus {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c26:hover {
-  color: rgb(205,37,27);
-  background-color: rgb(255,255,255);
-  border-color: rgb(205,37,27);
-}
-
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
-  background-color: rgba(210,67,58,0.1);
-  border-color: rgb(205,37,27);
-}
-
-.c26 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c26 svg {
-  max-height: 1.125rem;
-}
-
-.c10 {
-  font-size: 0.9375rem;
-  line-height: 1.125rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  -webkit-text-align: left;
-  text-align: left;
-}
-
-.c30 {
-  font-size: 0.9375rem;
-  line-height: 1.125rem;
-  font-style: normal;
-  font-stretch: normal;
-  display: block;
-  color: rgb(70,70,70);
-  -webkit-text-align: left;
-  text-align: left;
-  margin-right: 0.75rem;
-  font-weight: 600;
-  white-space: pre;
-  font-size: 0.8125rem;
-}
-
-.c7 {
-  color: rgba(73,73,73,1);
-  font-weight: normal;
-  line-height: 1.875rem;
-  font-size: 1.5rem;
-  margin: 0;
-}
-
-.c7 + p,
-.c7 + small,
-.c7 + h1,
-.c7 + h2,
-.c7 + label,
-.c7 + h3,
-.c7 + h4,
-.c7 + h5,
-.c7 + div,
-.c7 + span {
-  margin-top: 1.5rem;
-}
-
-.c28 {
-  background-color: rgb(216,216,216);
-  margin: 0;
-  height: 0.0625rem;
-}
-
-.c13 {
-  width: 0.9375rem;
-  height: 0.9375rem;
-  border-radius: 50%;
-  background-color: rgb(0,152,88);
-  display: inline-block;
-  margin-right: 0rem;
-  margin-left: 0rem;
-}
-
-.c2 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c3 {
-  box-sizing: content-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1 0 auto;
-  -ms-flex: 1 0 auto;
-  flex: 1 0 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  position: relative;
-  border-width: 0.0625rem;
-  border-style: solid;
-  -webkit-transition: all 300ms ease;
-  transition: all 300ms ease;
-  color: rgba(73,73,73,1);
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex: 1 1 auto;
-  -ms-flex: 1 1 auto;
-  flex: 1 1 auto;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  border-width: 0;
-  margin-bottom: 0;
-  background-color: transparent;
-}
-
-.c3 > [name='card']:not(:last-child) {
-  margin-bottom: 0.8125rem;
-}
-
-.c3 > [name='card']:last-child {
-  margin-bottom: 0.4375rem;
-}
-
-.c32 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  padding: 0.8125rem 1.125rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-family: "Roboto Mono",monospace;
-  width: 100%;
-  min-width: 100%;
-  -webkit-text-overflow: ellipsis;
-  text-overflow: ellipsis;
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-}
-
-.c32::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:invalid {
-  box-shadow: none;
-}
-
-.c32:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c32:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled::-moz-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c34 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  padding: 0.8125rem 1.125rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-family: "Roboto Mono",monospace;
-  width: 100%;
-  min-width: 100%;
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-}
-
-.c34::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34:invalid {
-  box-shadow: none;
-}
-
-.c34:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c34:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c34:disabled {
-  color: rgba(73,73,73,1);
-}
-
-.c34:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c34:disabled::-moz-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c34:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c34:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c31 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  margin-bottom: 0.625rem;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c31 input {
-  padding-right: 1.875rem;
-}
-
-.c31 div {
-  position: relative;
-  left: -1.625rem;
-}
-
-.c15 {
-  opacity: 0.5;
-  padding-right: 0.1875rem;
-}
-
-.c9 {
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-}
-
-.c11 {
-  width: 0.0625rem;
-  background: rgb(216,216,216);
-  height: 1.5rem;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-self: flex-end;
-  -ms-flex-item-align: end;
-  align-self: flex-end;
-  margin: 0 1.125rem;
-}
-
-@media only screen and (min-width:0em) {
-  .c5 {
-    -webkit-align-items: center;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c16 {
-    -webkit-box-pack: justify;
-    -webkit-justify-content: space-between;
-    -ms-flex-pack: justify;
-    justify-content: space-between;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c1 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:48em) {
-  .c1 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c1 {
-    -webkit-flex-basis: 75%;
-    -ms-flex-preferred-size: 75%;
-    flex-basis: 75%;
-    max-width: 75%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c6 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c17 {
-    -webkit-flex-basis: 75%;
-    -ms-flex-preferred-size: 75%;
-    flex-basis: 75%;
-    max-width: 75%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c24 {
-    -webkit-flex-basis: 25%;
-    -ms-flex-preferred-size: 25%;
-    flex-basis: 25%;
-    max-width: 25%;
-  }
-}
-
-@media only screen and (min-width:0em) {
-  .c29 {
-    -webkit-flex-basis: 100%;
-    -ms-flex-preferred-size: 100%;
-    flex-basis: 100%;
-    max-width: 100%;
-  }
-}
-
-@media only screen and (min-width:64em) {
-  .c29 {
-    -webkit-flex-basis: 58.333333333333336%;
-    -ms-flex-preferred-size: 58.333333333333336%;
-    flex-basis: 58.333333333333336%;
-    max-width: 58.333333333333336%;
-  }
-}
-
-@media (max-width:47.9375rem) {
-  .c9 {
-    display: block;
-  }
-}
-
-@media (max-width:47.9375rem) {
-  .c11 {
-    display: none;
-  }
-}
-
-<div
-  className="c0"
->
-  <div
-    className="c1"
-  >
-    <div
-      className="c2"
-      disabled={false}
-      name="card"
-    >
-      <div
-        className="c3"
-        name="card-outlet"
-      >
-        <div
-          className="c4"
-        >
-          <div
-            className="c5"
-          >
-            <div
-              className="c6"
-            >
-              <h2
-                className="c7"
-              />
-            </div>
-          </div>
-          <div
-            className="c8"
-          >
-            <div
-              className="c9"
-            >
-              <label
-                className="c10"
-              >
-                Custom Image
-              </label>
-              <div
-                className="c11"
-              />
-              <label
-                className="c10"
-              >
-                Hardware Virtual Machine
-              </label>
-              <div
-                className="c11"
-              />
-              <div
-                className="c9"
-              >
-                <span
-                  className="c12 c13"
-                  color="green"
-                  size="0.9375rem"
-                />
-                Running
-              </div>
-            </div>
-            <div
-              className="c14"
-            >
-              <div
-                className="c9"
-              >
-                <div
-                  className="c9"
-                >
-                  <label
-                    className="c15 c10"
-                  >
-                    Created: 
-                  </label>
-                  <label
-                    className="c10"
-                  >
-                     
-                    almost NaN years
-                     ago
-                  </label>
-                </div>
-                <div
-                  className="c11"
-                />
-                <div
-                  className="c9"
-                >
-                  <label
-                    className="c15 c10"
-                  >
-                    Updated: 
-                  </label>
-                  <label
-                    className="c10"
-                  >
-                     
-                    almost NaN years
-                     ago
-                  </label>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="c16"
-          >
-            <div
-              className="c17"
-            >
-              <span
-                name="react-responsive-mock"
-                query="only screen and (max-width: 47.9375rem)"
-              >
-                <button
-                  className="c18 c19 c20"
-                  disabled={true}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="14"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 13.36 14"
-                    width="13.36"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M2.53,1.68a.81.81,0,0,1,.39.1l8.31,4.48a.84.84,0,0,1,0,1.48L2.92,12.22a.81.81,0,0,1-.39.1.85.85,0,0,1-.85-.85V2.53a.85.85,0,0,1,.85-.85M2.53,0A2.53,2.53,0,0,0,0,2.53v8.94A2.53,2.53,0,0,0,3.72,13.7L12,9.22a2.52,2.52,0,0,0,0-4.44L3.72.3A2.5,2.5,0,0,0,2.53,0Z"
-                      fill="rgb(216, 216, 216)"
-                    />
-                  </svg>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (min-width: 48rem)"
-              >
-                <button
-                  className="c21 c19 c20"
-                  disabled={true}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="14"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 13.36 14"
-                    width="13.36"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M2.53,1.68a.81.81,0,0,1,.39.1l8.31,4.48a.84.84,0,0,1,0,1.48L2.92,12.22a.81.81,0,0,1-.39.1.85.85,0,0,1-.85-.85V2.53a.85.85,0,0,1,.85-.85M2.53,0A2.53,2.53,0,0,0,0,2.53v8.94A2.53,2.53,0,0,0,3.72,13.7L12,9.22a2.52,2.52,0,0,0,0-4.44L3.72.3A2.5,2.5,0,0,0,2.53,0Z"
-                      fill="rgb(216, 216, 216)"
-                    />
-                  </svg>
-                  <span>
-                    Start
-                  </span>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (max-width: 47.9375rem)"
-              >
-                <button
-                  className="c22 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="14"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 14 14"
-                    width="14"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10.75,1.75a1.5,1.5,0,0,1,1.5,1.5v7.5a1.5,1.5,0,0,1-1.5,1.5H3.25a1.5,1.5,0,0,1-1.5-1.5V3.25a1.5,1.5,0,0,1,1.5-1.5h7.5m0-1.75H3.25A3.26,3.26,0,0,0,0,3.25v7.5A3.26,3.26,0,0,0,3.25,14h7.5A3.26,3.26,0,0,0,14,10.75V3.25A3.26,3.26,0,0,0,10.75,0Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (min-width: 48rem)"
-              >
-                <button
-                  className="c23 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="14"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 14 14"
-                    width="14"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10.75,1.75a1.5,1.5,0,0,1,1.5,1.5v7.5a1.5,1.5,0,0,1-1.5,1.5H3.25a1.5,1.5,0,0,1-1.5-1.5V3.25a1.5,1.5,0,0,1,1.5-1.5h7.5m0-1.75H3.25A3.26,3.26,0,0,0,0,3.25v7.5A3.26,3.26,0,0,0,3.25,14h7.5A3.26,3.26,0,0,0,14,10.75V3.25A3.26,3.26,0,0,0,10.75,0Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                  <span>
-                    Stop
-                  </span>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (max-width: 47.9375rem)"
-              >
-                <button
-                  className="c22 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="21"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    version="1.1"
-                    viewBox="0 0 20 21"
-                    width="20"
-                    xmlns="http://www.w3.org/2000/svg"
-                    xmlnsXlink="http://www.w3.org/1999/xlink"
-                  >
-                    <g
-                      transform="translate(17997 -18577)"
-                    >
-                      <g>
-                        <use
-                          fill="rgba(73, 73, 73, 1)"
-                          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                          xlinkHref="#f"
-                        />
-                      </g>
-                    </g>
-                    <defs>
-                      <path
-                        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                        fillRule="evenodd"
-                        id="f"
-                      />
-                    </defs>
-                  </svg>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (min-width: 48rem)"
-              >
-                <button
-                  className="c23 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="21"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    version="1.1"
-                    viewBox="0 0 20 21"
-                    width="20"
-                    xmlns="http://www.w3.org/2000/svg"
-                    xmlnsXlink="http://www.w3.org/1999/xlink"
-                  >
-                    <g
-                      transform="translate(17997 -18577)"
-                    >
-                      <g>
-                        <use
-                          fill="rgba(73, 73, 73, 1)"
-                          transform="matrix(0.866025 0.5 -0.5 0.866025 -17988.7 18577.9)"
-                          xlinkHref="#f"
-                        />
-                      </g>
-                    </g>
-                    <defs>
-                      <path
-                        d="M 5.39661 3.57718L 5.3977 5.34469L 10.0255 2.67281L 5.39715 0L 5.39832 2.00201C 2.33086 2.5484 0.00065755 5.23112 0 8.45654C 0.000380483 12.0783 2.93556 15.0137 6.55562 15.0143C 10.1774 15.014 13.1128 12.0788 13.1124 8.45702L 11.5697 8.45687C 11.5697 11.2264 9.32527 13.4717 6.55578 13.4716C 3.78629 13.4716 1.54268 11.2262 1.5427 8.45669C 1.54135 6.08718 3.18616 4.10012 5.39661 3.57718Z"
-                        fillRule="evenodd"
-                        id="f"
-                      />
-                    </defs>
-                  </svg>
-                  <span>
-                    Reboot
-                  </span>
-                </button>
-              </span>
-            </div>
-            <div
-              className="c24"
-            >
-              <span
-                name="react-responsive-mock"
-                query="only screen and (max-width: 47.9375rem)"
-              >
-                <button
-                  className="c25 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="16"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 12 16"
-                    width="12"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
-                      fill="rgb(210, 67, 58)"
-                    />
-                  </svg>
-                </button>
-              </span>
-              <span
-                name="react-responsive-mock"
-                query="only screen and (min-width: 48rem)"
-              >
-                <button
-                  className="c26 c19 c20"
-                  disabled={false}
-                  href=""
-                  icon={true}
-                  onClick={[Function]}
-                  type="button"
-                >
-                  <svg
-                    className=""
-                    height="16"
-                    innerRef={undefined}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 12 16"
-                    width="12"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M2.67,0V1.5H0V3H12V1.5H9.33V0ZM0,4,1.33,16h9.34L12,4ZM8,5h2.51l-1,10H8ZM1.49,5H4V15H2.53ZM7,15H5V5H7Z"
-                      fill="rgb(210, 67, 58)"
-                    />
-                  </svg>
-                  <span>
-                    Remove
-                  </span>
-                </button>
-              </span>
-            </div>
-          </div>
-          <div
-            className="c27"
-          >
-            <div
-              className="c28 c0"
-              height="0.0625rem"
-            />
-          </div>
-          <div
-            className="c0"
-          >
-            <div
-              className="c29"
-            >
-              <label
-                className="c30"
-                htmlFor=""
-              >
-                Short ID
-              </label>
-              <div
-                className="c31"
-              >
-                <input
-                  className="c32"
-                  disabled={false}
-                  id=""
-                  onBlur={null}
-                  value=""
-                />
-                <div
-                  onClick={undefined}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                  tag={false}
-                >
-                  <svg
-                    className="c33"
-                    height="19"
-                    innerRef={undefined}
-                    onClick={[Function]}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 15 19"
-                    width="15"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="c0"
-          >
-            <div
-              className="c29"
-            >
-              <label
-                className="c30"
-                htmlFor=""
-              >
-                ID
-              </label>
-              <div
-                className="c31"
-              >
-                <input
-                  className="c32"
-                  disabled={false}
-                  id=""
-                  onBlur={null}
-                  value={undefined}
-                />
-                <div
-                  onClick={undefined}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                  tag={false}
-                >
-                  <svg
-                    className="c33"
-                    height="19"
-                    innerRef={undefined}
-                    onClick={[Function]}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 15 19"
-                    width="15"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="c0"
-          >
-            <div
-              className="c29"
-            >
-              <label
-                className="c30"
-                htmlFor=""
-              >
-                CN UUID
-              </label>
-              <div
-                className="c31"
-              >
-                <input
-                  className="c32"
-                  disabled={false}
-                  id=""
-                  onBlur={null}
-                  value={undefined}
-                />
-                <div
-                  onClick={undefined}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                  tag={false}
-                >
-                  <svg
-                    className="c33"
-                    height="19"
-                    innerRef={undefined}
-                    onClick={[Function]}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 15 19"
-                    width="15"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            className="c0"
-          >
-            <div
-              className="c29"
-            >
-              <label
-                className="c30"
-                htmlFor=""
-              >
-                Login
-              </label>
-              <div
-                className="c31"
-              >
-                <input
-                  className="c34"
-                  disabled={false}
-                  id=""
-                  onBlur={null}
-                  value="ssh root@undefined"
-                />
-                <div
-                  onClick={undefined}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                  tag={false}
-                >
-                  <svg
-                    className="c33"
-                    height="19"
-                    innerRef={undefined}
-                    onClick={[Function]}
-                    style={
-                      Object {
-                        "transform": "rotate(0deg)",
-                      }
-                    }
-                    viewBox="0 0 15 19"
-                    width="15"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M5,12l2-2v9H8V10l2,2,1-1L7.5,8,4,11ZM11,1h2a2.15,2.15,0,0,1,2,2V16a2.15,2.15,0,0,1-2,2H10V16h3V3H11V5H4V3H2V16H5v2H2a2.15,2.15,0,0,1-2-2V3A2.15,2.15,0,0,1,2,1H4V0h7ZM9,2H6V3H9V2Z"
-                      fill="rgba(73, 73, 73, 1)"
-                    />
-                  </svg>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
 exports[`renders <Summary state /> without throwing 2`] = `
 .c0 {
   box-sizing: border-box;
@@ -9975,7 +10446,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: block;
 }
 
-.c24 {
+.c26 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -9985,7 +10456,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: block;
 }
 
-.c29 {
+.c31 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -10004,7 +10475,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-top: 0.375rem;
 }
 
-.c27 {
+.c29 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -10013,7 +10484,14 @@ exports[`renders <Summary state /> without throwing 2`] = `
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c22 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -10027,30 +10505,43 @@ exports[`renders <Summary state /> without throwing 2`] = `
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c22::-moz-focus-inner,
+.c22[type='button']::-moz-focus-inner,
+.c22[type='reset']::-moz-focus-inner,
+.c22[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c22:-moz-focusring,
+.c22[type='button']:-moz-focusring,
+.c22[type='reset']:-moz-focusring,
+.c22[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c22 + button,
+.c22 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
 
-.c33 {
+.c35 {
   cursor: pointer;
 }
 
@@ -10058,262 +10549,9 @@ exports[`renders <Summary state /> without throwing 2`] = `
   display: inline-block;
 }
 
-.c22 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  padding: 0.5625rem 1.125rem;
-  font-size: 0.8125rem;
-  min-width: 0rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.c22:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.c23 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c23:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c23:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c23[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c23:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c23:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c23:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c23:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c23 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c23 svg {
-  max-height: 1.125rem;
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
 }
 
 .c18 {
@@ -10424,7 +10662,265 @@ exports[`renders <Summary state /> without throwing 2`] = `
   max-height: 1.125rem;
 }
 
-.c21 {
+.c24 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c24:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c24:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c24[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c24:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c24:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c24:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c24 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c24 svg {
+  max-height: 1.125rem;
+}
+
+.c25 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c25:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c25:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c25[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c25:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c25:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c25 svg {
+  max-height: 1.125rem;
+}
+
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -10478,7 +10974,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   font-weight: 500;
 }
 
-.c21:focus {
+.c23:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -10486,51 +10982,51 @@ exports[`renders <Summary state /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c23:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c23[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c23:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c23:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c21 svg + span {
+.c23 svg + span {
   margin-left: 0.75rem;
 }
 
-.c21 svg {
+.c23 svg {
   max-height: 1.125rem;
 }
 
-.c25 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -10591,7 +11087,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   float: right;
 }
 
-.c25:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -10599,70 +11095,70 @@ exports[`renders <Summary state /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c25[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c25:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c25:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c25:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c25:active,
-.c25:active:hover,
-.c25:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c25 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c25 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
-.c26 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -10721,7 +11217,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   float: right;
 }
 
-.c26:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -10729,66 +11225,66 @@ exports[`renders <Summary state /> without throwing 2`] = `
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
@@ -10803,7 +11299,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   text-align: left;
 }
 
-.c30 {
+.c32 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -10839,7 +11335,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-top: 1.5rem;
 }
 
-.c28 {
+.c30 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -10921,7 +11417,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c32 {
+.c34 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -10946,84 +11442,6 @@ exports[`renders <Summary state /> without throwing 2`] = `
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:invalid {
-  box-shadow: none;
-}
-
-.c32:disabled {
-  background-color: rgb(250,250,250);
-  color: rgb(216,216,216);
-  cursor: not-allowed;
-}
-
-.c32:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled::-moz-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,0.5);
-}
-
-.c32:disabled {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled::-webkit-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled::-moz-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:disabled:-ms-input-placeholder {
-  color: rgba(73,73,73,1);
-}
-
-.c32:focus {
-  border-color: rgb(59,70,204);
-  outline: 0;
-}
-
-.c34 {
-  box-sizing: border-box;
-  width: 18.75rem;
-  height: 3rem;
-  min-height: 3rem;
-  padding: 0.8125rem 1.125rem;
-  border-radius: 0.25rem;
-  background-color: rgb(255,255,255);
-  border: 0.0625rem solid rgb(216,216,216);
-  color: rgba(73,73,73,1);
-  font-family: "Roboto Mono",monospace;
-  width: 100%;
-  min-width: 100%;
-  font-size: 0.9375rem;
-  line-height: normal !important;
-  font-style: normal;
-  font-stretch: normal;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  outline: 0;
-}
-
 .c34::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
@@ -11079,7 +11497,85 @@ exports[`renders <Summary state /> without throwing 2`] = `
   outline: 0;
 }
 
-.c31 {
+.c36 {
+  box-sizing: border-box;
+  width: 18.75rem;
+  height: 3rem;
+  min-height: 3rem;
+  padding: 0.8125rem 1.125rem;
+  border-radius: 0.25rem;
+  background-color: rgb(255,255,255);
+  border: 0.0625rem solid rgb(216,216,216);
+  color: rgba(73,73,73,1);
+  font-family: "Roboto Mono",monospace;
+  width: 100%;
+  min-width: 100%;
+  font-size: 0.9375rem;
+  line-height: normal !important;
+  font-style: normal;
+  font-stretch: normal;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  outline: 0;
+}
+
+.c36::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36:invalid {
+  box-shadow: none;
+}
+
+.c36:disabled {
+  background-color: rgb(250,250,250);
+  color: rgb(216,216,216);
+  cursor: not-allowed;
+}
+
+.c36:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36:disabled::-moz-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,0.5);
+}
+
+.c36:disabled {
+  color: rgba(73,73,73,1);
+}
+
+.c36:disabled::-webkit-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c36:disabled::-moz-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c36:disabled:-ms-input-placeholder {
+  color: rgba(73,73,73,1);
+}
+
+.c36:focus {
+  border-color: rgb(59,70,204);
+  outline: 0;
+}
+
+.c33 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -11091,11 +11587,11 @@ exports[`renders <Summary state /> without throwing 2`] = `
   align-items: center;
 }
 
-.c31 input {
+.c33 input {
   padding-right: 1.875rem;
 }
 
-.c31 div {
+.c33 div {
   position: relative;
   left: -1.625rem;
 }
@@ -11198,7 +11694,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c24 {
+  .c26 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -11207,7 +11703,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -11216,7 +11712,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c29 {
+  .c31 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -11348,12 +11844,38 @@ exports[`renders <Summary state /> without throwing 2`] = `
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c18 c19 c22"
                   disabled={false}
                   href=""
                   icon={true}
@@ -11385,7 +11907,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c23 c19 c22"
                   disabled={false}
                   href=""
                   icon={true}
@@ -11420,7 +11942,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c24 c19 c22"
                   disabled={true}
                   href=""
                   icon={true}
@@ -11452,7 +11974,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c22"
                   disabled={true}
                   href=""
                   icon={true}
@@ -11487,7 +12009,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c22 c19 c20"
+                  className="c24 c19 c22"
                   disabled={true}
                   href=""
                   icon={true}
@@ -11535,7 +12057,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c25 c19 c22"
                   disabled={true}
                   href=""
                   icon={true}
@@ -11583,14 +12105,14 @@ exports[`renders <Summary state /> without throwing 2`] = `
               </span>
             </div>
             <div
-              className="c24"
+              className="c26"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c25 c19 c20"
+                  className="c27 c19 c22"
                   disabled={false}
                   href=""
                   icon={true}
@@ -11622,7 +12144,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c26 c19 c20"
+                  className="c28 c19 c22"
                   disabled={false}
                   href=""
                   icon={true}
@@ -11655,10 +12177,10 @@ exports[`renders <Summary state /> without throwing 2`] = `
             </div>
           </div>
           <div
-            className="c27"
+            className="c29"
           >
             <div
-              className="c28 c0"
+              className="c30 c0"
               height="0.0625rem"
             />
           </div>
@@ -11666,19 +12188,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -11691,7 +12213,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -11717,19 +12239,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -11742,7 +12264,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -11768,19 +12290,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c32"
+                  className="c34"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -11793,7 +12315,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -11819,19 +12341,19 @@ exports[`renders <Summary state /> without throwing 2`] = `
             className="c0"
           >
             <div
-              className="c29"
+              className="c31"
             >
               <label
-                className="c30"
+                className="c32"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c31"
+                className="c33"
               >
                 <input
-                  className="c34"
+                  className="c36"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -11844,7 +12366,7 @@ exports[`renders <Summary state /> without throwing 2`] = `
                   tag={false}
                 >
                   <svg
-                    className="c33"
+                    className="c35"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -11961,7 +12483,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: block;
 }
 
-.c22 {
+.c25 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -11971,7 +12493,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: block;
 }
 
-.c27 {
+.c30 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -11990,7 +12512,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-top: 0.375rem;
 }
 
-.c25 {
+.c28 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -11999,7 +12521,14 @@ exports[`renders <Summary state /> without throwing 3`] = `
   padding: 1.5rem;
 }
 
-.c20 {
+.c21 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c23 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -12013,30 +12542,43 @@ exports[`renders <Summary state /> without throwing 3`] = `
   min-width: 7.5rem;
 }
 
-.c20::-moz-focus-inner,
-.c20[type='button']::-moz-focus-inner,
-.c20[type='reset']::-moz-focus-inner,
-.c20[type='submit']::-moz-focus-inner {
+.c23::-moz-focus-inner,
+.c23[type='button']::-moz-focus-inner,
+.c23[type='reset']::-moz-focus-inner,
+.c23[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c20:-moz-focusring,
-.c20[type='button']:-moz-focusring,
-.c20[type='reset']:-moz-focusring,
-.c20[type='submit']:-moz-focusring {
+.c23:-moz-focusring,
+.c23[type='button']:-moz-focusring,
+.c23[type='reset']:-moz-focusring,
+.c23[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c20 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
+.c20 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c20:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c12 {
   margin-right: 0.375rem;
 }
 
-.c31 {
+.c34 {
   cursor: pointer;
 }
 
@@ -12044,6 +12586,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   display: inline-block;
 }
 
+.c19 + button,
+.c19 + a {
+  margin-left: 0.375rem;
+}
+
 .c18 {
   box-sizing: border-box;
   display: inline-block;
@@ -12087,11 +12634,6 @@ exports[`renders <Summary state /> without throwing 3`] = `
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -12149,23 +12691,6 @@ exports[`renders <Summary state /> without throwing 3`] = `
   border-color: rgb(216,216,216);
 }
 
-.c18:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c18:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c18:active,
-.c18:active:hover,
-.c18:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c18 svg + span {
   margin-left: 0.75rem;
 }
@@ -12174,7 +12699,137 @@ exports[`renders <Summary state /> without throwing 3`] = `
   max-height: 1.125rem;
 }
 
-.c21 {
+.c22 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  padding: 0.5625rem 1.125rem;
+  font-size: 0.8125rem;
+  min-width: 0rem;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c22:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c22:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c22[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c22:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c22:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c22:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22:active,
+.c22:active:hover,
+.c22:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c22 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c22 svg {
+  max-height: 1.125rem;
+}
+
+.c24 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -12233,7 +12888,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   font-weight: 500;
 }
 
-.c21:focus {
+.c24:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -12241,68 +12896,68 @@ exports[`renders <Summary state /> without throwing 3`] = `
   border-color: rgb(45,56,132);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c21[disabled] {
+.c24[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c21:focus {
+.c24:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c21:focus {
+.c24:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c21:hover {
+.c24:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c21:active,
-.c21:active:hover,
-.c21:active:focus {
+.c24:active,
+.c24:active:hover,
+.c24:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c21 svg + span {
+.c24 svg + span {
   margin-left: 0.75rem;
 }
 
-.c21 svg {
+.c24 svg {
   max-height: 1.125rem;
 }
 
-.c23 {
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -12368,7 +13023,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   float: right;
 }
 
-.c23:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -12376,87 +13031,87 @@ exports[`renders <Summary state /> without throwing 3`] = `
   border-color: rgb(45,56,132);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c23[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c23:focus {
+.c26:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c23:focus {
+.c26:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c23:hover {
+.c26:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c23:focus {
+.c26:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c23:hover {
+.c26:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23:active,
-.c23:active:hover,
-.c23:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c23 svg + span {
+.c26 svg + span {
   margin-left: 0.75rem;
 }
 
-.c23 svg {
+.c26 svg {
   max-height: 1.125rem;
 }
 
-.c24 {
+.c27 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -12520,7 +13175,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   float: right;
 }
 
-.c24:focus {
+.c27:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -12528,83 +13183,83 @@ exports[`renders <Summary state /> without throwing 3`] = `
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c27[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c27:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24:focus {
+.c27:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c24:hover {
+.c27:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c24:focus {
+.c27:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c27:hover {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c27:active,
+.c27:active:hover,
+.c27:active:focus {
   background-color: rgb(250,250,250);
   border-color: rgb(250,250,250);
 }
 
-.c24 svg + span {
+.c27 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
+.c27 svg {
   max-height: 1.125rem;
 }
 
@@ -12619,7 +13274,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   text-align: left;
 }
 
-.c28 {
+.c31 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -12655,7 +13310,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-top: 1.5rem;
 }
 
-.c26 {
+.c29 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -12737,7 +13392,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
   margin-bottom: 0.4375rem;
 }
 
-.c30 {
+.c33 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -12762,62 +13417,62 @@ exports[`renders <Summary state /> without throwing 3`] = `
   outline: 0;
 }
 
-.c30::-webkit-input-placeholder {
+.c33::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30::-moz-placeholder {
+.c33::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:-ms-input-placeholder {
+.c33:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:invalid {
+.c33:invalid {
   box-shadow: none;
 }
 
-.c30:disabled {
+.c33:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c30:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c30:disabled {
+.c33:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled::-webkit-input-placeholder {
+.c33:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled::-moz-placeholder {
+.c33:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:disabled:-ms-input-placeholder {
+.c33:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c30:focus {
+.c33:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c32 {
+.c35 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -12840,62 +13495,62 @@ exports[`renders <Summary state /> without throwing 3`] = `
   outline: 0;
 }
 
-.c32::-webkit-input-placeholder {
+.c35::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32::-moz-placeholder {
+.c35::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:-ms-input-placeholder {
+.c35:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:invalid {
+.c35:invalid {
   box-shadow: none;
 }
 
-.c32:disabled {
+.c35:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c32:disabled {
+.c35:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c32:focus {
+.c35:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c29 {
+.c32 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -12907,11 +13562,11 @@ exports[`renders <Summary state /> without throwing 3`] = `
   align-items: center;
 }
 
-.c29 input {
+.c32 input {
   padding-right: 1.875rem;
 }
 
-.c29 div {
+.c32 div {
   position: relative;
   left: -1.625rem;
 }
@@ -13014,7 +13669,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c22 {
+  .c25 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -13023,7 +13678,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:0em) {
-  .c27 {
+  .c30 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -13032,7 +13687,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
 }
 
 @media only screen and (min-width:64em) {
-  .c27 {
+  .c30 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -13164,12 +13819,38 @@ exports[`renders <Summary state /> without throwing 3`] = `
             <div
               className="c17"
             >
+              <a
+                className="c18 c19 c20 c21"
+                href="http://localhost:3070/~create/undefined"
+                icon={true}
+                rel="noopener noreferrer"
+                target="__blank"
+              >
+                <svg
+                  className=""
+                  height="20"
+                  innerRef={undefined}
+                  style={
+                    Object {
+                      "transform": "rotate(0deg)",
+                    }
+                  }
+                  viewBox="0 0 16.67 20"
+                  width="16.67"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                    fill="rgba(73, 73, 73, 1)"
+                  />
+                </svg>
+              </a>
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13201,7 +13882,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13236,7 +13917,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13268,7 +13949,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13303,7 +13984,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c18 c19 c20"
+                  className="c22 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13351,7 +14032,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c21 c19 c20"
+                  className="c24 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13399,14 +14080,14 @@ exports[`renders <Summary state /> without throwing 3`] = `
               </span>
             </div>
             <div
-              className="c22"
+              className="c25"
             >
               <span
                 name="react-responsive-mock"
                 query="only screen and (max-width: 47.9375rem)"
               >
                 <button
-                  className="c23 c19 c20"
+                  className="c26 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13438,7 +14119,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                 query="only screen and (min-width: 48rem)"
               >
                 <button
-                  className="c24 c19 c20"
+                  className="c27 c19 c23"
                   disabled={true}
                   href=""
                   icon={true}
@@ -13471,10 +14152,10 @@ exports[`renders <Summary state /> without throwing 3`] = `
             </div>
           </div>
           <div
-            className="c25"
+            className="c28"
           >
             <div
-              className="c26 c0"
+              className="c29 c0"
               height="0.0625rem"
             />
           </div>
@@ -13482,19 +14163,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 Short ID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13507,7 +14188,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -13533,19 +14214,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 ID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13558,7 +14239,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -13584,19 +14265,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 CN UUID
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c30"
+                  className="c33"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13609,7 +14290,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
@@ -13635,19 +14316,19 @@ exports[`renders <Summary state /> without throwing 3`] = `
             className="c0"
           >
             <div
-              className="c27"
+              className="c30"
             >
               <label
-                className="c28"
+                className="c31"
                 htmlFor=""
               >
                 Login
               </label>
               <div
-                className="c29"
+                className="c32"
               >
                 <input
-                  className="c32"
+                  className="c35"
                   disabled={false}
                   id=""
                   onBlur={null}
@@ -13660,7 +14341,7 @@ exports[`renders <Summary state /> without throwing 3`] = `
                   tag={false}
                 >
                   <svg
-                    className="c31"
+                    className="c34"
                     height="19"
                     innerRef={undefined}
                     onClick={[Function]}
diff --git a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
index 1595e8ed..7c7c7cd3 100644
--- a/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
+++ b/packages/my-joy-beta/src/components/instances/__tests__/__snapshots__/toolbar.spec.js.snap
@@ -58,7 +58,8 @@ exports[`renders <Toolbar /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -66,6 +67,11 @@ exports[`renders <Toolbar /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -394,7 +400,8 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -402,6 +409,11 @@ exports[`renders <Toolbar actionLabel /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -730,7 +742,8 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -738,6 +751,11 @@ exports[`renders <Toolbar actionable /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -1088,7 +1106,8 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -1096,6 +1115,11 @@ exports[`renders <Toolbar onActionClick /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -1424,7 +1448,8 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -1432,6 +1457,11 @@ exports[`renders <Toolbar searchLabel /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -1760,7 +1790,8 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -1768,6 +1799,11 @@ exports[`renders <Toolbar searchPlaceholder /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
@@ -2096,7 +2132,8 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c10 + button {
+.c10 + button,
+.c10 + a {
   margin-left: 0.375rem;
 }
 
@@ -2104,6 +2141,11 @@ exports[`renders <Toolbar searchable /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c9 + button,
+.c9 + a {
+  margin-left: 0.375rem;
+}
+
 .c8 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/components/instances/list.js b/packages/my-joy-beta/src/components/instances/list.js
index 9b72adac..f94defd4 100644
--- a/packages/my-joy-beta/src/components/instances/list.js
+++ b/packages/my-joy-beta/src/components/instances/list.js
@@ -41,6 +41,12 @@ const A = styled(Anchor)`
   font-weight: ${props => props.theme.font.weight.semibold};
 `;
 
+const ItemAnchor = styled(Anchor)`
+  color: ${props => props.theme.text};
+  -webkit-text-fill-color: currentcolor;
+  text-decoration: none;
+`;
+
 export const Item = ({
   id = '',
   name,
@@ -48,6 +54,7 @@ export const Item = ({
   created,
   allowedActions = {},
   mutating = false,
+  onCreateImage,
   onStart,
   onStop,
   onReboot,
@@ -60,7 +67,7 @@ export const Item = ({
       </FormGroup>
     </TableTd>
     <TableTd middle left>
-      <A to={`/instances/${name}`} component={Link}>
+      <A to={`/${name}`} component={Link}>
         {name}
       </A>
     </TableTd>
@@ -97,6 +104,16 @@ export const Item = ({
               Reboot
             </PopoverItem>
             <PopoverDivider />
+            <PopoverItem disabled={false} onClick={onCreateImage}>
+              <ItemAnchor
+                href={`http://localhost:3070/~create/${name}`}
+                target="__blank"
+                rel="noopener noreferrer"
+              >
+                Create Image
+              </ItemAnchor>
+            </PopoverItem>
+            <PopoverDivider />
             <PopoverItem disabled={!allowedActions.remove} onClick={onRemove}>
               Remove
             </PopoverItem>
diff --git a/packages/my-joy-beta/src/components/instances/summary.js b/packages/my-joy-beta/src/components/instances/summary.js
index af7b162b..3f9c9c38 100644
--- a/packages/my-joy-beta/src/components/instances/summary.js
+++ b/packages/my-joy-beta/src/components/instances/summary.js
@@ -14,12 +14,13 @@ import {
   Button,
   H2,
   Label,
+  CopiableField,
   QueryBreakpoints,
   DotIcon,
   DeleteIcon,
   StartIcon,
   StopIcon,
-  CopiableField
+  InstanceTypeIcon
 } from 'joyent-ui-toolkit';
 
 const { SmallOnly, Medium } = QueryBreakpoints;
@@ -129,6 +130,16 @@ export default withTheme(
               <Meta {...instance} />
               <Row between="xs">
                 <Col xs={9}>
+                  <Button
+                    href={`http://localhost:3070/~create/${instance.name}`}
+                    target="__blank"
+                    rel="noopener noreferrer"
+                    secondary
+                    small
+                    icon
+                  >
+                    <InstanceTypeIcon />
+                  </Button>
                   <SmallOnly>
                     <Button
                       type="button"
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/footer.spec..js.snap b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/footer.spec..js.snap
index e6949e37..5001cc6a 100644
--- a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/footer.spec..js.snap
+++ b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/footer.spec..js.snap
@@ -43,7 +43,8 @@ exports[`renders <Footer/> without throwing 1`] = `
     <a
       className="c2"
       href="https://www.joyent.com/about/policies"
-      target="_blank"
+      rel="noopener noreferrer"
+      target="__blank"
     >
       Policies
     </a>
@@ -54,6 +55,8 @@ exports[`renders <Footer/> without throwing 1`] = `
     <a
       className="c2"
       href="https://www.joyent.com/networking-and-security/security-compliance"
+      rel="noopener noreferrer"
+      target="__blank"
     >
       Compliance
     </a>
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
index 858dd46b..e2a310d4 100644
--- a/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
+++ b/packages/my-joy-beta/src/components/navigation/__tests__/__snapshots__/menu.spec.js.snap
@@ -96,7 +96,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/summary"
+          to="/:name/summary"
         >
           summary
         </a>
@@ -106,7 +106,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/tags"
+          to="/:name/tags"
         >
           tags
         </a>
@@ -116,7 +116,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/metadata"
+          to="/:name/metadata"
         >
           metadata
         </a>
@@ -126,7 +126,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/networks"
+          to="/:name/networks"
         >
           networks
         </a>
@@ -136,7 +136,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/firewall"
+          to="/:name/firewall"
         >
           firewall
         </a>
@@ -146,7 +146,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/dns"
+          to="/:name/dns"
         >
           dns
         </a>
@@ -156,7 +156,7 @@ exports[`renders <Menu links /> without throwing 1`] = `
       >
         <a
           className="c4 c5 c6"
-          to="/instances/:name/snapshots"
+          to="/:name/snapshots"
         >
           snapshots
         </a>
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/menu.spec.js b/packages/my-joy-beta/src/components/navigation/__tests__/menu.spec.js
index 4fccaebb..76b00858 100644
--- a/packages/my-joy-beta/src/components/navigation/__tests__/menu.spec.js
+++ b/packages/my-joy-beta/src/components/navigation/__tests__/menu.spec.js
@@ -21,31 +21,31 @@ it('renders <Menu links /> without throwing', () => {
   const links = [
     {
       name: 'summary',
-      pathname: '/instances/:name/summary'
+      pathname: '/:name/summary'
     },
     {
       name: 'tags',
-      pathname: '/instances/:name/tags'
+      pathname: '/:name/tags'
     },
     {
       name: 'metadata',
-      pathname: '/instances/:name/metadata'
+      pathname: '/:name/metadata'
     },
     {
       name: 'networks',
-      pathname: '/instances/:name/networks'
+      pathname: '/:name/networks'
     },
     {
       name: 'firewall',
-      pathname: '/instances/:name/firewall'
+      pathname: '/:name/firewall'
     },
     {
       name: 'dns',
-      pathname: '/instances/:name/dns'
+      pathname: '/:name/dns'
     },
     {
       name: 'snapshots',
-      pathname: '/instances/:name/snapshots'
+      pathname: '/:name/snapshots'
     }
   ];
 
diff --git a/packages/my-joy-beta/src/components/navigation/__tests__/menu.ui.js b/packages/my-joy-beta/src/components/navigation/__tests__/menu.ui.js
index 5a8b6e18..0358e607 100644
--- a/packages/my-joy-beta/src/components/navigation/__tests__/menu.ui.js
+++ b/packages/my-joy-beta/src/components/navigation/__tests__/menu.ui.js
@@ -23,31 +23,31 @@ it('<Menu links />', async () => {
   const links = [
     {
       name: 'summary',
-      pathname: '/instances/:name/summary'
+      pathname: '/:name/summary'
     },
     {
       name: 'tags',
-      pathname: '/instances/:name/tags'
+      pathname: '/:name/tags'
     },
     {
       name: 'metadata',
-      pathname: '/instances/:name/metadata'
+      pathname: '/:name/metadata'
     },
     {
       name: 'networks',
-      pathname: '/instances/:name/networks'
+      pathname: '/:name/networks'
     },
     {
       name: 'firewall',
-      pathname: '/instances/:name/firewall'
+      pathname: '/:name/firewall'
     },
     {
       name: 'dns',
-      pathname: '/instances/:name/dns'
+      pathname: '/:name/dns'
     },
     {
       name: 'snapshots',
-      pathname: '/instances/:name/snapshots'
+      pathname: '/:name/snapshots'
     }
   ];
 
diff --git a/packages/my-joy-beta/src/components/navigation/footer.js b/packages/my-joy-beta/src/components/navigation/footer.js
index 64a6cf61..4ab37271 100644
--- a/packages/my-joy-beta/src/components/navigation/footer.js
+++ b/packages/my-joy-beta/src/components/navigation/footer.js
@@ -30,12 +30,20 @@ const Link = styled.a`
 export default () => (
   <List>
     <ListItem>
-      <Link href="https://www.joyent.com/about/policies" target="_blank">
+      <Link
+        href="https://www.joyent.com/about/policies"
+        target="__blank"
+        rel="noopener noreferrer"
+      >
         Policies
       </Link>
     </ListItem>
     <ListItem>
-      <Link href="https://www.joyent.com/networking-and-security/security-compliance">
+      <Link
+        href="https://www.joyent.com/networking-and-security/security-compliance"
+        target="__blank"
+        rel="noopener noreferrer"
+      >
         Compliance
       </Link>
     </ListItem>
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png
index 525f9e43..9c3d0b79 100644
Binary files a/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png and b/packages/my-joy-beta/src/containers/create-instance/__tests__/__image_snapshots__/networks-ui-js-networks-loading-expanded-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
index 6079a86c..4aad1d11 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/metadata.spec.js.snap
@@ -447,7 +447,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -468,6 +469,11 @@ Array [
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -1562,7 +1568,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -1570,6 +1577,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2052,7 +2064,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2060,6 +2073,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2423,7 +2441,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -2444,6 +2463,11 @@ Array [
   display: inline-block;
 }
 
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
 .c23 {
   box-sizing: border-box;
   display: inline-block;
@@ -3556,7 +3580,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -3577,6 +3602,11 @@ Array [
   display: inline-block;
 }
 
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
 .c23 {
   box-sizing: border-box;
   display: inline-block;
@@ -4960,7 +4990,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -4981,6 +5012,11 @@ Array [
   display: inline-block;
 }
 
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
 .c23 {
   box-sizing: border-box;
   display: inline-block;
@@ -6112,7 +6148,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c25 + button {
+.c25 + button,
+.c25 + a {
   margin-left: 0.375rem;
 }
 
@@ -6133,6 +6170,11 @@ Array [
   display: inline-block;
 }
 
+.c24 + button,
+.c24 + a {
+  margin-left: 0.375rem;
+}
+
 .c23 {
   box-sizing: border-box;
   display: inline-block;
@@ -7264,7 +7306,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -7272,6 +7315,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
index 02f3e6b0..c9cc518f 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/networks.spec.js.snap
@@ -2278,7 +2278,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2286,6 +2287,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2852,7 +2858,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2860,6 +2867,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
index 830525b7..69e58dfd 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/tag.spec.js.snap
@@ -449,7 +449,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -457,6 +458,11 @@ Array [
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -1506,7 +1512,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -1514,6 +1521,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2005,7 +2017,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2013,6 +2026,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2647,7 +2665,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2655,6 +2674,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
index aa8ee337..bcdda957 100644
--- a/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/__tests__/__snapshots__/user-script.spec.js.snap
@@ -171,7 +171,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -192,6 +193,11 @@ Array [
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -1375,7 +1381,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -1396,6 +1403,11 @@ Array [
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -2359,7 +2371,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2367,6 +2380,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -2798,7 +2816,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -2806,6 +2825,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -3237,7 +3261,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -3258,6 +3283,11 @@ Array [
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -4221,7 +4251,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -4229,6 +4260,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -4563,7 +4599,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -4584,6 +4621,11 @@ Array [
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -5577,7 +5619,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -5585,6 +5628,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -5919,7 +5967,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -5940,6 +5989,11 @@ Array [
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -6933,7 +6987,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -6941,6 +6996,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
@@ -7200,7 +7260,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c23 + button {
+.c23 + button,
+.c23 + a {
   margin-left: 0.375rem;
 }
 
@@ -7221,6 +7282,11 @@ Array [
   display: inline-block;
 }
 
+.c22 + button,
+.c22 + a {
+  margin-left: 0.375rem;
+}
+
 .c21 {
   box-sizing: border-box;
   display: inline-block;
@@ -8184,7 +8250,8 @@ Array [
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c3 + button {
+.c3 + button,
+.c3 + a {
   margin-left: 0.375rem;
 }
 
@@ -8192,6 +8259,11 @@ Array [
   display: inline-block;
 }
 
+.c2 + button,
+.c2 + a {
+  margin-left: 0.375rem;
+}
+
 .c1 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/create-instance/affinity.js b/packages/my-joy-beta/src/containers/create-instance/affinity.js
index cce6a1c6..509150f2 100644
--- a/packages/my-joy-beta/src/containers/create-instance/affinity.js
+++ b/packages/my-joy-beta/src/containers/create-instance/affinity.js
@@ -158,7 +158,7 @@ export default compose(
   })),
   connect(null, (dispatch, { affinityRules = [], history }) => ({
     handleEdit: () => {
-      return history.push(`/instances/~create/affinity`);
+      return history.push(`/~create/affinity${history.location.search}`);
     },
     handleAddAffinityRules: ({ ...rule }) => {
       const toggleToClosed = set({
diff --git a/packages/my-joy-beta/src/containers/create-instance/cns.js b/packages/my-joy-beta/src/containers/create-instance/cns.js
index 85d83311..12b4a314 100644
--- a/packages/my-joy-beta/src/containers/create-instance/cns.js
+++ b/packages/my-joy-beta/src/containers/create-instance/cns.js
@@ -162,9 +162,9 @@ export default compose(
   connect(null, (dispatch, { history, cnsEnabled, serviceNames = [] }) => ({
     handleNext: () => {
       dispatch(set({ name: `${CNS_FORM}-proceeded`, value: true }));
-      return history.push(`/instances/~create/affinity`);
+      return history.push(`/~create/affinity${history.location.search}`);
     },
-    handleEdit: () => history.push(`/instances/~create/cns`),
+    handleEdit: () => history.push(`/~create/cns${history.location.search}`),
     handleToggleCnsEnabled: ({ target }) =>
       dispatch(set({ name: `${CNS_FORM}-enabled`, value: !cnsEnabled })),
     handleAddService: ({ name }) => {
diff --git a/packages/my-joy-beta/src/containers/create-instance/firewall.js b/packages/my-joy-beta/src/containers/create-instance/firewall.js
index 2e91a70c..6b7f641c 100644
--- a/packages/my-joy-beta/src/containers/create-instance/firewall.js
+++ b/packages/my-joy-beta/src/containers/create-instance/firewall.js
@@ -165,10 +165,10 @@ export default compose(
           set({ name: 'create-instance-firewall-proceeded', value: true })
         );
 
-        return history.push('/instances/~create/cns');
+        return history.push(`/~create/cns${history.location.search}`);
       },
       handleEdit: () => {
-        return history.push('/instances/~create/firewall');
+        return history.push(`/~create/firewall${history.location.search}`);
       }
     })
   ),
diff --git a/packages/my-joy-beta/src/containers/create-instance/image.js b/packages/my-joy-beta/src/containers/create-instance/image.js
index 5abd2a49..7953bc1d 100644
--- a/packages/my-joy-beta/src/containers/create-instance/image.js
+++ b/packages/my-joy-beta/src/containers/create-instance/image.js
@@ -20,10 +20,23 @@ import Animated from '@containers/create-instance/animated';
 import Description from '@components/description';
 import imageData from '@data/images-map.json';
 import GetImages from '@graphql/get-images.gql';
+import GetImage from '@graphql/get-image.gql';
+
+const HarcodedImage = image => (
+  <Fragment>
+    <Title icon={<InstanceTypeIcon />} collapsed={false}>
+      Instance type and image
+    </Title>
+    <Margin bottom={7}>
+      <Preview {...image} />
+    </Margin>
+  </Fragment>
+);
 
 const ImageContainer = ({
   expanded,
   proceeded,
+  queryImage,
   image = {},
   handleNext,
   handleEdit,
@@ -32,7 +45,11 @@ const ImageContainer = ({
   images,
   vms,
   step
-}) => (
+}) => queryImage ? (
+  <Fragment>
+    <HarcodedImage {...queryImage} />
+  </Fragment>
+) : (
   <Fragment>
     <Title
       id={step}
@@ -119,9 +136,10 @@ export default compose(
       handleNext: () => {
         dispatch(set({ name: 'create-instance-image-proceeded', value: true }));
 
-        return history.push(`/instances/~create/package`);
+        return history.push(`/~create/package${history.location.search}`);
       },
-      handleEdit: () => history.push(`/instances/~create/image`),
+      handleEdit: () =>
+        history.push(`/~create/image${history.location.search}`),
       handleSelectLatest: ({ versions }) => {
         const id = versions[0].id;
         return dispatch(change('create-instance-image', 'image', id));
@@ -130,9 +148,13 @@ export default compose(
   ),
   graphql(GetImages, {
     props: ({ ownProps, data }) => {
-      const { image = '' } = ownProps;
+      const { image = '', query } = ownProps;
       const { loading = false, images = [] } = data;
 
+      const queryImage = query.image
+        ? find(images, ['name', query.image])
+        : null;
+
       const values = images
         .reduce((acc, img) => {
           const isVm = !includes(img.type, 'DATASET');
@@ -186,6 +208,7 @@ export default compose(
       return {
         loading,
         images: values,
+        queryImage,
         image: {
           ...selected,
           isVm: !includes(selected.type || '', 'DATASET')
diff --git a/packages/my-joy-beta/src/containers/create-instance/index.js b/packages/my-joy-beta/src/containers/create-instance/index.js
index eb149387..c3196636 100644
--- a/packages/my-joy-beta/src/containers/create-instance/index.js
+++ b/packages/my-joy-beta/src/containers/create-instance/index.js
@@ -1,4 +1,5 @@
 /* eslint-disable camelcase */
+
 import React from 'react';
 import { Margin } from 'styled-components-spacing';
 import ReduxForm from 'declarative-redux-form';
@@ -8,6 +9,7 @@ import { destroyAll } from 'react-redux-values';
 import { graphql, compose } from 'react-apollo';
 import intercept from 'apr-intercept';
 import constantCase from 'constant-case';
+import queryString from 'query-string';
 import get from 'lodash.get';
 import omit from 'lodash.omit';
 import uniqBy from 'lodash.uniqby';
@@ -29,23 +31,43 @@ import parseError from '@state/parse-error';
 
 const CREATE_FORM = 'CREATE-INSTANCE';
 
-const CreateInstance = ({ step, disabled, handleSubmit, history, match }) => (
+const CreateInstance = ({
+  step,
+  disabled,
+  handleSubmit,
+  history,
+  match,
+  query
+}) => (
   <ViewContainer>
     <Margin top={4} bottom={4}>
       <H2>Create Instances</H2>
     </Margin>
+    {query.image ? (
+      <Image
+        history={history}
+        match={match}
+        query={query}
+        step="image"
+        expanded={step === 'image'}
+      />
+    ) : null}
     <Name
       history={history}
       match={match}
+      query={query}
       step="name"
       expanded={step === 'name'}
     />
-    <Image
-      history={history}
-      match={match}
-      step="image"
-      expanded={step === 'image'}
-    />
+    {!query.image ? (
+      <Image
+        history={history}
+        match={match}
+        query={query}
+        step="image"
+        expanded={step === 'image'}
+      />
+    ) : null}
     <Package
       history={history}
       match={match}
@@ -105,7 +127,8 @@ const CreateInstance = ({ step, disabled, handleSubmit, history, match }) => (
 
 export default compose(
   graphql(CreateInstanceMutation, { name: 'createInstance' }),
-  connect(({ form, values }, { match }) => {
+  connect(({ form, values }, { match, location }) => {
+    const query = queryString.parse(location.search);
     const FORM_NAME = 'create-instance-name';
     const step = get(match, 'params.step', 'name');
     const nameFilled = get(form, `${FORM_NAME}.values.name`, '');
@@ -117,7 +140,11 @@ export default compose(
     );
 
     if (disabled) {
-      return { disabled, step };
+      return {
+        query,
+        disabled,
+        step
+      };
     }
 
     const name = get(
@@ -162,6 +189,7 @@ export default compose(
     }
 
     return {
+      query,
       forms: Object.keys(form), // improve this
       name,
       pkg,
@@ -265,7 +293,7 @@ export default compose(
 
         dispatch([destroyAll(), forms.map(name => destroy(name))]);
 
-        history.push(`/instances/${res.data.createMachine.name}`);
+        history.push(`/${res.data.createMachine.name}`);
       }
     };
   })
diff --git a/packages/my-joy-beta/src/containers/create-instance/metadata.js b/packages/my-joy-beta/src/containers/create-instance/metadata.js
index 69405c2e..2e1022e6 100644
--- a/packages/my-joy-beta/src/containers/create-instance/metadata.js
+++ b/packages/my-joy-beta/src/containers/create-instance/metadata.js
@@ -157,10 +157,10 @@ export default compose(
         set({ name: 'create-instance-metadata-proceeded', value: true })
       );
 
-      return history.push('/instances/~create/user-script');
+      return history.push(`/~create/user-script${history.location.search}`);
     },
     handleEdit: () => {
-      return history.push(`/instances/~create/metadata`);
+      return history.push(`/~create/metadata${history.location.search}`);
     },
     handleAddMetadata: value => {
       const toggleToClosed = set({
diff --git a/packages/my-joy-beta/src/containers/create-instance/name.js b/packages/my-joy-beta/src/containers/create-instance/name.js
index 72a75dd9..e147ab65 100644
--- a/packages/my-joy-beta/src/containers/create-instance/name.js
+++ b/packages/my-joy-beta/src/containers/create-instance/name.js
@@ -114,7 +114,7 @@ export default compose(
         name
       };
     },
-    (dispatch, { history }) => ({
+    (dispatch, { history, query }) => ({
       shouldAsyncValidate: ({ trigger }) => trigger === 'submit',
       handleAsyncValidation: async ({ name }) => {
         const sanitized = punycode.encode(name).replace(/-$/, '');
@@ -160,10 +160,13 @@ export default compose(
       },
       handleNext: () => {
         dispatch(set({ name: 'create-instance-name-proceeded', value: true }));
-
-        return history.push(`/instances/~create/image`);
+        return history.push(
+          `/~create/${query.image ? 'package' : 'image'}${
+            history.location.search
+          }`
+        );
       },
-      handleEdit: () => history.push(`/instances/~create/name`),
+      handleEdit: () => history.push(`/~create/name${history.location.search}`),
       handleRandomize: async () => {
         dispatch(
           set({ name: 'create-instance-name-randomizing', value: true })
diff --git a/packages/my-joy-beta/src/containers/create-instance/networks.js b/packages/my-joy-beta/src/containers/create-instance/networks.js
index 8449d245..bee217af 100644
--- a/packages/my-joy-beta/src/containers/create-instance/networks.js
+++ b/packages/my-joy-beta/src/containers/create-instance/networks.js
@@ -165,10 +165,10 @@ export default compose(
           set({ name: 'create-instance-networks-proceeded', value: true })
         );
 
-        return history.push('/instances/~create/firewall');
+        return history.push(`/~create/firewall${history.location.search}`);
       },
       handleEdit: () => {
-        return history.push('/instances/~create/networks');
+        return history.push(`/~create/networks${history.location.search}`);
       },
       setInfoExpanded: (id, expanded) => {
         return dispatch(
diff --git a/packages/my-joy-beta/src/containers/create-instance/package.js b/packages/my-joy-beta/src/containers/create-instance/package.js
index 7076c93d..4993b9cc 100644
--- a/packages/my-joy-beta/src/containers/create-instance/package.js
+++ b/packages/my-joy-beta/src/containers/create-instance/package.js
@@ -228,9 +228,10 @@ export default compose(
           set({ name: 'create-instance-package-proceeded', value: true })
         );
 
-        return history.push('/instances/~create/tags');
+        return history.push(`/~create/tags${history.location.search}`);
       },
-      handleEdit: () => history.push('/instances/~create/package'),
+      handleEdit: () =>
+        history.push(`/~create/package${history.location.search}`),
       handleResetFilters: () => {
         dispatch(destroy(`${FORM_NAME}-filters`));
       },
diff --git a/packages/my-joy-beta/src/containers/create-instance/tags.js b/packages/my-joy-beta/src/containers/create-instance/tags.js
index 7d58c8b6..6ba12d9e 100644
--- a/packages/my-joy-beta/src/containers/create-instance/tags.js
+++ b/packages/my-joy-beta/src/containers/create-instance/tags.js
@@ -137,10 +137,10 @@ export default compose(
     handleNext: () => {
       dispatch(set({ name: 'create-instance-tags-proceeded', value: true }));
 
-      return history.push(`/instances/~create/metadata`);
+      return history.push(`/~create/metadata${history.location.search}`);
     },
     handleEdit: () => {
-      return history.push(`/instances/~create/tags`);
+      return history.push(`/~create/tags${history.location.search}`);
     },
     handleAddTag: value => {
       const toggleToClosed = set({
diff --git a/packages/my-joy-beta/src/containers/create-instance/user-script.js b/packages/my-joy-beta/src/containers/create-instance/user-script.js
index da1a5617..255f2f7e 100644
--- a/packages/my-joy-beta/src/containers/create-instance/user-script.js
+++ b/packages/my-joy-beta/src/containers/create-instance/user-script.js
@@ -116,13 +116,14 @@ export default compose(
       };
     },
     (dispatch, { history }) => ({
-      handleEdit: () => history.push(`/instances/~create/user-script`),
+      handleEdit: () =>
+        history.push(`/~create/user-script${history.location.search}`),
       handleNext: () => {
         dispatch(
           set({ name: 'create-instance-user-script-proceeded', value: true })
         );
 
-        return history.push(`/instances/~create/networks`);
+        return history.push(`/~create/networks${history.location.search}`);
       },
       handleChangeOpenForm: value => {
         return dispatch([
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png
index cc883c5c..7fa2ada3 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/cns-ui-js-cns-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png
index 063815ce..3d412556 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png
index 238b3883..b72bee9d 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/metadata-ui-js-metadata-metadata-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png
index 18f02c89..b57541ca 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/networks-ui-js-networks-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png
index f4b18e28..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png
index a141971c..217b0c57 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png
index 31737473..c672f70e 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-mutation-error-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png
index 29443b7b..e9a1d9c3 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-2-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-2-snap.png
index ec050e51..e31ba45a 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-2-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-2-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-3-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-3-snap.png
index 1f50b099..1a6ff87b 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-3-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/summary-ui-js-summary-starting-stopping-rebooting-removing-3-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png
index 13bb6643..e9d1d744 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-editing-removing-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png
index 4c7042f6..da97d79b 100644
Binary files a/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png and b/packages/my-joy-beta/src/containers/instances/__tests__/__image_snapshots__/tags-ui-js-tags-loading-1-snap.png differ
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
index daf1f414..aea4352d 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/cns.spec.js.snap
@@ -67,7 +67,8 @@ exports[`renders <Cns /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c24 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
@@ -82,6 +83,11 @@ exports[`renders <Cns /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c23 + button,
+.c23 + a {
+  margin-left: 0.375rem;
+}
+
 .c22 {
   box-sizing: border-box;
   display: inline-block;
@@ -1226,7 +1232,8 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c33 + button {
+.c33 + button,
+.c33 + a {
   margin-left: 0.375rem;
 }
 
@@ -1245,6 +1252,11 @@ exports[`renders <Cns hostnames /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c32 + button,
+.c32 + a {
+  margin-left: 0.375rem;
+}
+
 .c31 {
   box-sizing: border-box;
   display: inline-block;
@@ -3028,7 +3040,8 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c29 + button {
+.c29 + button,
+.c29 + a {
   margin-left: 0.375rem;
 }
 
@@ -3052,6 +3065,11 @@ exports[`renders <Cns loadingError /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c28 + button,
+.c28 + a {
+  margin-left: 0.375rem;
+}
+
 .c27 {
   box-sizing: border-box;
   display: inline-block;
@@ -3733,7 +3751,8 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c38 + button {
+.c38 + button,
+.c38 + a {
   margin-left: 0.375rem;
 }
 
@@ -3752,6 +3771,11 @@ exports[`renders <Cns mutating /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c37 + button,
+.c37 + a {
+  margin-left: 0.375rem;
+}
+
 .c36 {
   box-sizing: border-box;
   display: inline-block;
@@ -5466,7 +5490,8 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c29 + button {
+.c29 + button,
+.c29 + a {
   margin-left: 0.375rem;
 }
 
@@ -5490,6 +5515,11 @@ exports[`renders <Cns mutationError /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c28 + button,
+.c28 + a {
+  margin-left: 0.375rem;
+}
+
 .c27 {
   box-sizing: border-box;
   display: inline-block;
@@ -6332,7 +6362,8 @@ exports[`renders <Cns services /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c30 + button {
+.c30 + button,
+.c30 + a {
   margin-left: 0.375rem;
 }
 
@@ -6352,6 +6383,11 @@ exports[`renders <Cns services /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c29 + button,
+.c29 + a {
+  margin-left: 0.375rem;
+}
+
 .c28 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
index f665818e..125d0c2e 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/list.spec.js.snap
@@ -42,7 +42,8 @@ exports[`renders <List /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -131,6 +132,11 @@ exports[`renders <List /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -1303,7 +1309,8 @@ exports[`renders <List error /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -1401,6 +1408,11 @@ exports[`renders <List error /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -2627,7 +2639,8 @@ exports[`renders <List instances /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -2726,6 +2739,11 @@ exports[`renders <List instances /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -3726,7 +3744,7 @@ exports[`renders <List instances /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/2252839a"
+              to="/2252839a"
             >
               2252839a
             </a>
@@ -3853,7 +3871,7 @@ exports[`renders <List instances /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/f1bd1730"
+              to="/f1bd1730"
             >
               f1bd1730
             </a>
@@ -3974,7 +3992,8 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -4073,6 +4092,11 @@ exports[`renders <List instances selected /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -5789,7 +5813,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/2252839a"
+              to="/2252839a"
             >
               2252839a
             </a>
@@ -5916,7 +5940,7 @@ exports[`renders <List instances selected /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/f1bd1730"
+              to="/f1bd1730"
             >
               f1bd1730
             </a>
@@ -6357,7 +6381,8 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -6456,6 +6481,11 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -8172,7 +8202,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/2252839a"
+              to="/2252839a"
             >
               2252839a
             </a>
@@ -8299,7 +8329,7 @@ exports[`renders <List instances selected=all /> without throwing 1`] = `
           >
             <a
               className="c34 c35 c36"
-              to="/instances/f1bd1730"
+              to="/f1bd1730"
             >
               f1bd1730
             </a>
@@ -8740,7 +8770,8 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -8839,6 +8870,11 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
@@ -10768,7 +10804,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
           >
             <a
               className="c34 c35 c36"
-              to="/instances/2252839a"
+              to="/2252839a"
             >
               2252839a
             </a>
@@ -10895,7 +10931,7 @@ exports[`renders <List instances selected=all allowedActions /> without throwing
           >
             <a
               className="c34 c35 c36"
-              to="/instances/f1bd1730"
+              to="/f1bd1730"
             >
               f1bd1730
             </a>
@@ -11329,7 +11365,8 @@ exports[`renders <List loading /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c12 + button {
+.c12 + button,
+.c12 + a {
   margin-left: 0.375rem;
 }
 
@@ -11407,6 +11444,11 @@ exports[`renders <List loading /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c11 + button,
+.c11 + a {
+  margin-left: 0.375rem;
+}
+
 .c10 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
index e5cbc766..ec21673d 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/metadata.spec.js.snap
@@ -38,7 +38,8 @@ exports[`renders <Metadata /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -46,6 +47,11 @@ exports[`renders <Metadata /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -509,7 +515,8 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -530,6 +537,11 @@ exports[`renders <Metadata addOpen /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -1901,7 +1913,8 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -1918,6 +1931,11 @@ exports[`renders <Metadata error /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -2422,7 +2440,8 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -2500,6 +2519,11 @@ exports[`renders <Metadata loading /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -2985,7 +3009,8 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -3059,6 +3084,11 @@ exports[`renders <Metadata metadata /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
index 44ff65b1..39ec320f 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/summary.spec.js.snap
@@ -909,7 +909,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 0.375rem;
 }
 
-.c28 {
+.c30 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -918,7 +918,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -932,30 +939,43 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 7.5rem;
 }
 
-.c21::-moz-focus-inner,
-.c21[type='button']::-moz-focus-inner,
-.c21[type='reset']::-moz-focus-inner,
-.c21[type='submit']::-moz-focus-inner {
+.c24::-moz-focus-inner,
+.c24[type='button']::-moz-focus-inner,
+.c24[type='reset']::-moz-focus-inner,
+.c24[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c21:-moz-focusring,
-.c21[type='button']:-moz-focusring,
-.c21[type='reset']:-moz-focusring,
-.c21[type='submit']:-moz-focusring {
+.c24:-moz-focusring,
+.c24[type='button']:-moz-focusring,
+.c24[type='reset']:-moz-focusring,
+.c24[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c21 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
+.c21 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c21:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c13 {
   margin-right: 0.375rem;
 }
 
-.c34 {
+.c36 {
   cursor: pointer;
 }
 
@@ -963,6 +983,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: inline-block;
 }
 
+.c20 + button,
+.c20 + a {
+  margin-left: 0.375rem;
+}
+
 .c19 {
   box-sizing: border-box;
   display: inline-block;
@@ -1006,11 +1031,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -1068,23 +1088,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
-.c19:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c19:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c19:active,
-.c19:active:hover,
-.c19:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c19 svg + span {
   margin-left: 0.75rem;
 }
@@ -1093,7 +1096,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1141,129 +1144,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c22:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.c23 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -1321,6 +1201,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.c23:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c23 svg + span {
   margin-left: 0.75rem;
 }
@@ -1329,7 +1226,135 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c25:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c25:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c25[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c25:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c25:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c25 svg {
+  max-height: 1.125rem;
+}
+
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1383,7 +1408,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c24:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1391,51 +1416,51 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c26:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c26:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 svg + span {
+.c26 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
+.c26 svg {
   max-height: 1.125rem;
 }
 
-.c26 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1496,7 +1521,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c26:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1504,70 +1529,70 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
-.c27 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -1626,7 +1651,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c27:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1634,66 +1659,66 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -1708,7 +1733,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-align: left;
 }
 
-.c31 {
+.c33 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -1819,7 +1844,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c25 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1829,7 +1854,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c30 {
+.c32 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -1860,7 +1885,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c29 {
+.c31 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -1942,7 +1967,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c33 {
+.c35 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -1965,62 +1990,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c35::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c35::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c35:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c35:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c35:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled {
+.c35:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:focus {
+.c35:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c32 {
+.c34 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2032,16 +2057,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c32 input {
+.c34 input {
   padding-right: 1.875rem;
 }
 
-.c32 div {
+.c34 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c35 {
+.c37 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2054,11 +2079,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c35 input {
+.c37 input {
   padding-right: 1.875rem;
 }
 
-.c35 div {
+.c37 div {
   position: relative;
   left: -1.625rem;
 }
@@ -2186,7 +2211,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c27 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -2195,7 +2220,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c32 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -2204,7 +2229,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c30 {
+  .c32 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -2341,12 +2366,38 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               <div
                 className="c18"
               >
+                <a
+                  className="c19 c20 c21 c22"
+                  href="http://localhost:3070/~create/undefined"
+                  icon={true}
+                  rel="noopener noreferrer"
+                  target="__blank"
+                >
+                  <svg
+                    className=""
+                    height="20"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 16.67 20"
+                    width="16.67"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </a>
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c19 c20 c21"
+                    className="c23 c20 c24"
                     disabled={true}
                     href=""
                     icon={true}
@@ -2378,7 +2429,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c22 c20 c21"
+                    className="c25 c20 c24"
                     disabled={true}
                     href=""
                     icon={true}
@@ -2413,7 +2464,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c20 c21"
+                    className="c19 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2445,7 +2496,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c24 c20 c21"
+                    className="c26 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2480,7 +2531,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c20 c21"
+                    className="c19 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2528,7 +2579,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c24 c20 c21"
+                    className="c26 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2576,14 +2627,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c25"
+                className="c27"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c20 c21"
+                    className="c28 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2615,7 +2666,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c20 c21"
+                    className="c29 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -2648,10 +2699,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c28"
+              className="c30"
             >
               <div
-                className="c29 c1"
+                className="c31 c1"
                 height="0.0625rem"
               />
             </div>
@@ -2659,19 +2710,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2684,7 +2735,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2710,19 +2761,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2735,7 +2786,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2761,19 +2812,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2786,7 +2837,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2812,19 +2863,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2837,7 +2888,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2863,19 +2914,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2888,7 +2939,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2914,19 +2965,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   IP address 1
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2939,7 +2990,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -2965,19 +3016,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   IP address 2
                 </label>
                 <div
-                  className="c35"
+                  className="c37"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -2990,7 +3041,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -3030,7 +3081,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 0.375rem;
 }
 
-.c28 {
+.c30 {
   margin-top: 1.5rem;
   margin-bottom: 1.875rem;
 }
@@ -3039,7 +3090,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   padding: 1.5rem;
 }
 
-.c21 {
+.c22 {
+  background-color: transparent;
+  -webkit-text-decoration-skip: objects;
+  text-decoration-skip: objects;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+}
+
+.c24 {
   font-family: sans-serif;
   font-size: 100%;
   line-height: 1.15;
@@ -3053,30 +3111,43 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   min-width: 7.5rem;
 }
 
-.c21::-moz-focus-inner,
-.c21[type='button']::-moz-focus-inner,
-.c21[type='reset']::-moz-focus-inner,
-.c21[type='submit']::-moz-focus-inner {
+.c24::-moz-focus-inner,
+.c24[type='button']::-moz-focus-inner,
+.c24[type='reset']::-moz-focus-inner,
+.c24[type='submit']::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }
 
-.c21:-moz-focusring,
-.c21[type='button']:-moz-focusring,
-.c21[type='reset']:-moz-focusring,
-.c21[type='submit']:-moz-focusring {
+.c24:-moz-focusring,
+.c24[type='button']:-moz-focusring,
+.c24[type='reset']:-moz-focusring,
+.c24[type='submit']:-moz-focusring {
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c21 + button {
+.c24 + button,
+.c24 + a {
   margin-left: 0.375rem;
 }
 
+.c21 {
+  color: rgb(59,70,204);
+  -webkit-text-fill-color: currentcolor;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+}
+
+.c21:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
 .c13 {
   margin-right: 0.375rem;
 }
 
-.c34 {
+.c36 {
   cursor: pointer;
 }
 
@@ -3084,6 +3155,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: inline-block;
 }
 
+.c20 + button,
+.c20 + a {
+  margin-left: 0.375rem;
+}
+
 .c19 {
   box-sizing: border-box;
   display: inline-block;
@@ -3127,11 +3203,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   -webkit-text-fill-color: currentcolor;
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
-  cursor: not-allowed;
-  pointer-events: none;
-  color: rgb(216,216,216);
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -3189,23 +3260,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
-.c19:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c19:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c19:active,
-.c19:active:hover,
-.c19:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
 .c19 svg + span {
   margin-left: 0.75rem;
 }
@@ -3214,7 +3268,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c22 {
+.c23 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3262,129 +3316,6 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   color: rgb(216,216,216);
   background-color: rgb(250,250,250);
   border-color: rgb(216,216,216);
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  font-weight: 500;
-}
-
-.c22:focus {
-  outline: 0;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  background-color: rgb(59,70,204);
-  border-color: rgb(45,56,132);
-}
-
-.c22:hover {
-  background-color: rgb(72,83,217);
-  border: solid 0.0625rem rgb(45,56,132);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-image: none;
-  outline: 0;
-  background-color: rgb(45,56,132);
-  border-color: rgb(45,56,132);
-}
-
-.c22[disabled] {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.c22:focus {
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(247,247,247);
-  border-color: rgb(216,216,216);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(230,230,230);
-  border-color: rgb(216,216,216);
-}
-
-.c22:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(216,216,216);
-}
-
-.c22:hover {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22:active,
-.c22:active:hover,
-.c22:active:focus {
-  background-color: rgb(250,250,250);
-  border-color: rgb(250,250,250);
-}
-
-.c22 svg + span {
-  margin-left: 0.75rem;
-}
-
-.c22 svg {
-  max-height: 1.125rem;
-}
-
-.c23 {
-  box-sizing: border-box;
-  display: inline-block;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  min-height: 3rem;
-  height: 3rem;
-  min-width: 7.5rem;
-  padding: 0.9375rem 1.125rem;
-  position: relative;
-  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
-  font-size: 0.9375rem;
-  -webkit-text-align: center;
-  text-align: center;
-  font-style: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-letter-spacing: normal;
-  -moz-letter-spacing: normal;
-  -ms-letter-spacing: normal;
-  letter-spacing: normal;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  vertical-align: middle;
-  touch-action: manipulation;
-  cursor: pointer;
-  color: rgb(255,255,255);
-  -webkit-text-fill-color: currentcolor;
-  background-image: none;
-  background-color: rgb(59,70,204);
-  border-radius: 0.25rem;
-  border: solid 0.0625rem rgb(45,56,132);
-  color: rgb(70,70,70);
-  -webkit-text-fill-color: currentcolor;
-  background-color: rgb(255,255,255);
-  border-color: rgb(216,216,216);
   padding: 0.5625rem 1.125rem;
   font-size: 0.8125rem;
   min-width: 0rem;
@@ -3442,6 +3373,23 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(216,216,216);
 }
 
+.c23:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c23:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c23:active,
+.c23:active:hover,
+.c23:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
 .c23 svg + span {
   margin-left: 0.75rem;
 }
@@ -3450,7 +3398,135 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   max-height: 1.125rem;
 }
 
-.c24 {
+.c25 {
+  box-sizing: border-box;
+  display: inline-block;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 3rem;
+  height: 3rem;
+  min-width: 7.5rem;
+  padding: 0.9375rem 1.125rem;
+  position: relative;
+  font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
+  font-size: 0.9375rem;
+  -webkit-text-align: center;
+  text-align: center;
+  font-style: normal;
+  font-stretch: normal;
+  line-height: normal;
+  -webkit-letter-spacing: normal;
+  -moz-letter-spacing: normal;
+  -ms-letter-spacing: normal;
+  letter-spacing: normal;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: middle;
+  touch-action: manipulation;
+  cursor: pointer;
+  color: rgb(255,255,255);
+  -webkit-text-fill-color: currentcolor;
+  background-image: none;
+  background-color: rgb(59,70,204);
+  border-radius: 0.25rem;
+  border: solid 0.0625rem rgb(45,56,132);
+  color: rgb(70,70,70);
+  -webkit-text-fill-color: currentcolor;
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+  cursor: not-allowed;
+  pointer-events: none;
+  color: rgb(216,216,216);
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  font-weight: 500;
+}
+
+.c25:focus {
+  outline: 0;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  background-color: rgb(59,70,204);
+  border-color: rgb(45,56,132);
+}
+
+.c25:hover {
+  background-color: rgb(72,83,217);
+  border: solid 0.0625rem rgb(45,56,132);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-image: none;
+  outline: 0;
+  background-color: rgb(45,56,132);
+  border-color: rgb(45,56,132);
+}
+
+.c25[disabled] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.c25:focus {
+  background-color: rgb(255,255,255);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(247,247,247);
+  border-color: rgb(216,216,216);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(230,230,230);
+  border-color: rgb(216,216,216);
+}
+
+.c25:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(216,216,216);
+}
+
+.c25:hover {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25:active,
+.c25:active:hover,
+.c25:active:focus {
+  background-color: rgb(250,250,250);
+  border-color: rgb(250,250,250);
+}
+
+.c25 svg + span {
+  margin-left: 0.75rem;
+}
+
+.c25 svg {
+  max-height: 1.125rem;
+}
+
+.c26 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3504,7 +3580,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   font-weight: 500;
 }
 
-.c24:focus {
+.c26:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3512,51 +3588,51 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c24:hover {
+.c26:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c24[disabled] {
+.c26[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c24:focus {
+.c26:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c24:hover {
+.c26:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c24:active,
-.c24:active:hover,
-.c24:active:focus {
+.c26:active,
+.c26:active:hover,
+.c26:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c24 svg + span {
+.c26 svg + span {
   margin-left: 0.75rem;
 }
 
-.c24 svg {
+.c26 svg {
   max-height: 1.125rem;
 }
 
-.c26 {
+.c28 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3617,7 +3693,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c26:focus {
+.c28:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3625,70 +3701,70 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c26[disabled] {
+.c28[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c26:focus {
+.c28:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c26:hover {
+.c28:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c26:focus {
+.c28:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:hover {
+.c28:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c26:active,
-.c26:active:hover,
-.c26:active:focus {
+.c28:active,
+.c28:active:hover,
+.c28:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c26 svg + span {
+.c28 svg + span {
   margin-left: 0.75rem;
 }
 
-.c26 svg {
+.c28 svg {
   max-height: 1.125rem;
 }
 
-.c27 {
+.c29 {
   box-sizing: border-box;
   display: inline-block;
   -webkit-box-pack: center;
@@ -3747,7 +3823,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   float: right;
 }
 
-.c27:focus {
+.c29:focus {
   outline: 0;
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -3755,66 +3831,66 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   border-color: rgb(45,56,132);
 }
 
-.c27:hover {
+.c29:hover {
   background-color: rgb(72,83,217);
   border: solid 0.0625rem rgb(45,56,132);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-image: none;
   outline: 0;
   background-color: rgb(45,56,132);
   border-color: rgb(45,56,132);
 }
 
-.c27[disabled] {
+.c29[disabled] {
   cursor: not-allowed;
   pointer-events: none;
 }
 
-.c27:focus {
+.c29:focus {
   background-color: rgb(255,255,255);
   border-color: rgb(216,216,216);
 }
 
-.c27:hover {
+.c29:hover {
   background-color: rgb(247,247,247);
   border-color: rgb(216,216,216);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgb(230,230,230);
   border-color: rgb(216,216,216);
 }
 
-.c27:focus {
+.c29:focus {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:hover {
+.c29:hover {
   color: rgb(205,37,27);
   background-color: rgb(255,255,255);
   border-color: rgb(205,37,27);
 }
 
-.c27:active,
-.c27:active:hover,
-.c27:active:focus {
+.c29:active,
+.c29:active:hover,
+.c29:active:focus {
   background-color: rgba(210,67,58,0.1);
   border-color: rgb(205,37,27);
 }
 
-.c27 svg + span {
+.c29 svg + span {
   margin-left: 0.75rem;
 }
 
-.c27 svg {
+.c29 svg {
   max-height: 1.125rem;
 }
 
@@ -3829,7 +3905,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   text-align: left;
 }
 
-.c31 {
+.c33 {
   font-size: 0.9375rem;
   line-height: 1.125rem;
   font-style: normal;
@@ -3940,7 +4016,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c25 {
+.c27 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3950,7 +4026,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   display: block;
 }
 
-.c30 {
+.c32 {
   box-sizing: border-box;
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
@@ -3981,7 +4057,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-top: 1.5rem;
 }
 
-.c29 {
+.c31 {
   background-color: rgb(216,216,216);
   margin: 0;
   height: 0.0625rem;
@@ -4063,7 +4139,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0.4375rem;
 }
 
-.c33 {
+.c35 {
   box-sizing: border-box;
   width: 18.75rem;
   height: 3rem;
@@ -4086,62 +4162,62 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   outline: 0;
 }
 
-.c33::-webkit-input-placeholder {
+.c35::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33::-moz-placeholder {
+.c35::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:-ms-input-placeholder {
+.c35:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:invalid {
+.c35:invalid {
   box-shadow: none;
 }
 
-.c33:disabled {
+.c35:disabled {
   background-color: rgb(250,250,250);
   color: rgb(216,216,216);
   cursor: not-allowed;
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,0.5);
 }
 
-.c33:disabled {
+.c35:disabled {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-webkit-input-placeholder {
+.c35:disabled::-webkit-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled::-moz-placeholder {
+.c35:disabled::-moz-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:disabled:-ms-input-placeholder {
+.c35:disabled:-ms-input-placeholder {
   color: rgba(73,73,73,1);
 }
 
-.c33:focus {
+.c35:focus {
   border-color: rgb(59,70,204);
   outline: 0;
 }
 
-.c32 {
+.c34 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4153,16 +4229,16 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   align-items: center;
 }
 
-.c32 input {
+.c34 input {
   padding-right: 1.875rem;
 }
 
-.c32 div {
+.c34 div {
   position: relative;
   left: -1.625rem;
 }
 
-.c35 {
+.c37 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4175,11 +4251,11 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
   margin-bottom: 0rem;
 }
 
-.c35 input {
+.c37 input {
   padding-right: 1.875rem;
 }
 
-.c35 div {
+.c37 div {
   position: relative;
   left: -1.625rem;
 }
@@ -4307,7 +4383,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c25 {
+  .c27 {
     -webkit-flex-basis: 25%;
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
@@ -4316,7 +4392,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:0em) {
-  .c30 {
+  .c32 {
     -webkit-flex-basis: 100%;
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
@@ -4325,7 +4401,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
 }
 
 @media only screen and (min-width:64em) {
-  .c30 {
+  .c32 {
     -webkit-flex-basis: 58.333333333333336%;
     -ms-flex-preferred-size: 58.333333333333336%;
     flex-basis: 58.333333333333336%;
@@ -4462,12 +4538,38 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               <div
                 className="c18"
               >
+                <a
+                  className="c19 c20 c21 c22"
+                  href="http://localhost:3070/~create/undefined"
+                  icon={true}
+                  rel="noopener noreferrer"
+                  target="__blank"
+                >
+                  <svg
+                    className=""
+                    height="20"
+                    innerRef={undefined}
+                    style={
+                      Object {
+                        "transform": "rotate(0deg)",
+                      }
+                    }
+                    viewBox="0 0 16.67 20"
+                    width="16.67"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M12.83,8v6h-9V8h9m0-1h-9a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h9a1,1,0,0,0,1-1V8a1,1,0,0,0-1-1Zm-7,5.5v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,5.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,7.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,9.83,12.5Zm2,0v-3a.5.5,0,0,0-.5-.5h0a.5.5,0,0,0-.5.5v3a.5.5,0,0,0,.5.5h0A.5.5,0,0,0,11.83,12.5Zm3.73-8.06L12.22,1.11,11.11,0h-10A1.11,1.11,0,0,0,0,1.11V18.89A1.11,1.11,0,0,0,1.11,20H15.56a1.11,1.11,0,0,0,1.11-1.11V5.56ZM14.83,5h-3V2Zm-13,13V2h9V6h4V18Z"
+                      fill="rgba(73, 73, 73, 1)"
+                    />
+                  </svg>
+                </a>
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c19 c20 c21"
+                    className="c23 c20 c24"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4499,7 +4601,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c22 c20 c21"
+                    className="c25 c20 c24"
                     disabled={true}
                     href=""
                     icon={true}
@@ -4534,7 +4636,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c20 c21"
+                    className="c19 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4566,7 +4668,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c24 c20 c21"
+                    className="c26 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4601,7 +4703,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c23 c20 c21"
+                    className="c19 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4649,7 +4751,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c24 c20 c21"
+                    className="c26 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4697,14 +4799,14 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                 </span>
               </div>
               <div
-                className="c25"
+                className="c27"
               >
                 <span
                   name="react-responsive-mock"
                   query="only screen and (max-width: 47.9375rem)"
                 >
                   <button
-                    className="c26 c20 c21"
+                    className="c28 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4736,7 +4838,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                   query="only screen and (min-width: 48rem)"
                 >
                   <button
-                    className="c27 c20 c21"
+                    className="c29 c20 c24"
                     disabled={false}
                     href=""
                     icon={true}
@@ -4769,10 +4871,10 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               </div>
             </div>
             <div
-              className="c28"
+              className="c30"
             >
               <div
-                className="c29 c1"
+                className="c31 c1"
                 height="0.0625rem"
               />
             </div>
@@ -4780,19 +4882,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Short ID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -4805,7 +4907,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -4831,19 +4933,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   ID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -4856,7 +4958,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -4882,19 +4984,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   CN UUID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -4907,7 +5009,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -4933,19 +5035,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Image UUID
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -4958,7 +5060,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -4984,19 +5086,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   Login
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5009,7 +5111,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5035,19 +5137,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   IP address 1
                 </label>
                 <div
-                  className="c32"
+                  className="c34"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5060,7 +5162,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
@@ -5086,19 +5188,19 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
               className="c1"
             >
               <div
-                className="c30"
+                className="c32"
               >
                 <label
-                  className="c31"
+                  className="c33"
                   htmlFor=""
                 >
                   IP address 2
                 </label>
                 <div
-                  className="c35"
+                  className="c37"
                 >
                   <input
-                    className="c33"
+                    className="c35"
                     disabled={false}
                     id=""
                     onBlur={null}
@@ -5111,7 +5213,7 @@ exports[`renders <Summary starting stopping rebooting removing /> without throwi
                     tag={false}
                   >
                     <svg
-                      className="c34"
+                      className="c36"
                       height="19"
                       innerRef={undefined}
                       onClick={[Function]}
diff --git a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
index 60694bf9..a9f2bae5 100644
--- a/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/__tests__/__snapshots__/tags.spec.js.snap
@@ -39,7 +39,8 @@ exports[`renders <Tags /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -47,6 +48,11 @@ exports[`renders <Tags /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -526,7 +532,8 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -534,6 +541,11 @@ exports[`renders <Tags addOpen /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -1896,7 +1908,8 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -1904,6 +1917,11 @@ exports[`renders <Tags editable /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -2383,7 +2401,8 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -2391,6 +2410,11 @@ exports[`renders <Tags editing /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c34 {
   box-sizing: border-box;
   display: inline-block;
@@ -3806,7 +3830,8 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -3867,6 +3892,11 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c34 {
   box-sizing: border-box;
   display: inline-block;
@@ -5300,7 +5330,8 @@ exports[`renders <Tags error /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -5308,6 +5339,11 @@ exports[`renders <Tags error /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -5769,7 +5805,8 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -5847,6 +5884,11 @@ exports[`renders <Tags loading /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
@@ -6299,7 +6341,8 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   outline: 0.0625rem dotted ButtonText;
 }
 
-.c11 + button {
+.c11 + button,
+.c11 + a {
   margin-left: 0.375rem;
 }
 
@@ -6307,6 +6350,11 @@ exports[`renders <Tags tags /> without throwing 1`] = `
   display: inline-block;
 }
 
+.c10 + button,
+.c10 + a {
+  margin-left: 0.375rem;
+}
+
 .c9 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/my-joy-beta/src/containers/instances/list.js b/packages/my-joy-beta/src/containers/instances/list.js
index 5e8d3d6c..e6258321 100644
--- a/packages/my-joy-beta/src/containers/instances/list.js
+++ b/packages/my-joy-beta/src/containers/instances/list.js
@@ -55,6 +55,7 @@ export const List = ({
   submitting,
   handleAction,
   toggleSelectAll,
+  handleCreateImage,
   handleSortBy,
   history
 }) => {
@@ -110,6 +111,7 @@ export const List = ({
               key={id}
               id={id}
               {...rest}
+              onCreateImage={() => handleCreateImage(rest)}
               onStart={() => handleStart([{ id }])}
               onStop={() => handleStop([{ id }])}
               onReboot={() => handleReboot([{ id }])}
@@ -153,7 +155,7 @@ export const List = ({
             searchLabel="Filter instances"
             searchable={!_loading}
             actionLabel="Create Instance"
-            onActionClick={() => history.push(`/instances/~create`)}
+            onActionClick={() => history.push(`/~create`)}
           />
         )}
       </ReduxForm>
@@ -260,6 +262,8 @@ export default compose(
       };
     },
     (dispatch, { refetch, ...ownProps }) => ({
+      handleCreateImage: ({ name }) =>
+        window.open(`http://localhost:3070/~create/${name}`, '_blank').focus(),
       handleSortBy: ({ sortBy: currentSortBy, sortOrder }) => newSortBy => {
         // sort prop is the same, toggle
         if (currentSortBy === newSortBy) {
diff --git a/packages/my-joy-beta/src/containers/instances/snapshots.js b/packages/my-joy-beta/src/containers/instances/snapshots.js
index b9b4df71..7e132a54 100644
--- a/packages/my-joy-beta/src/containers/instances/snapshots.js
+++ b/packages/my-joy-beta/src/containers/instances/snapshots.js
@@ -167,7 +167,6 @@ export default compose(
     props: ({ data: { loading, error, variables, refetch, ...rest } }) => {
       const { name } = variables;
       const instance = find(get(rest, 'machines', []), ['name', name]);
-
       const snapshots = get(instance, 'snapshots', []);
 
       const index = GenIndex(
@@ -312,6 +311,8 @@ export default compose(
             );
           }
 
+          await refetch();
+
           dispatch(
             set({
               name: `snapshots-create-open`,
diff --git a/packages/my-joy-beta/src/containers/instances/summary.js b/packages/my-joy-beta/src/containers/instances/summary.js
index 9cf7e4c5..b00b57a2 100644
--- a/packages/my-joy-beta/src/containers/instances/summary.js
+++ b/packages/my-joy-beta/src/containers/instances/summary.js
@@ -138,7 +138,7 @@ export default compose(
 
         if (!err && action === 'remove') {
           const { history } = ownProps;
-          return history.push(`/instances/`);
+          return history.push(`/`);
         }
 
         // after mutation, sets loading back to false
diff --git a/packages/my-joy-beta/src/containers/navigation/breadcrumb.js b/packages/my-joy-beta/src/containers/navigation/breadcrumb.js
index 379a307e..3624f374 100644
--- a/packages/my-joy-beta/src/containers/navigation/breadcrumb.js
+++ b/packages/my-joy-beta/src/containers/navigation/breadcrumb.js
@@ -11,14 +11,14 @@ export default ({ match }) => {
   const links = [
     {
       name: 'Instances',
-      pathname: '/instances'
+      pathname: '/'
     }
   ]
     .concat(
       instance && [
         {
           name: paramCase(instance),
-          pathname: `/instances/${instance}`
+          pathname: `/${instance}`
         }
       ]
     )
diff --git a/packages/my-joy-beta/src/containers/navigation/menu.js b/packages/my-joy-beta/src/containers/navigation/menu.js
index 6c77485f..33219576 100644
--- a/packages/my-joy-beta/src/containers/navigation/menu.js
+++ b/packages/my-joy-beta/src/containers/navigation/menu.js
@@ -10,7 +10,7 @@ export default connect((state, { match }) => {
 
   const links = sections.map(({ name, pathname }) => ({
     name,
-    pathname: `/instances/${instanceSlug}/${pathname}`
+    pathname: `/${instanceSlug}/${pathname}`
   }));
 
   return {
diff --git a/packages/my-joy-beta/src/graphql/get-image.gql b/packages/my-joy-beta/src/graphql/get-image.gql
new file mode 100644
index 00000000..59ec861d
--- /dev/null
+++ b/packages/my-joy-beta/src/graphql/get-image.gql
@@ -0,0 +1,9 @@
+query Image($name: String) {
+  images(name: $name) {
+    id
+    name
+    os
+    version
+    type
+  }
+}
diff --git a/packages/my-joy-beta/src/router.js b/packages/my-joy-beta/src/router.js
index 8713d0ea..d030ed05 100644
--- a/packages/my-joy-beta/src/router.js
+++ b/packages/my-joy-beta/src/router.js
@@ -25,76 +25,46 @@ export default () => (
     <PageContainer>
       {/* Breadcrumb */}
       <Switch>
-        <Route
-          path="/instances/~create/:section?"
-          exact
-          component={Breadcrumb}
-        />
-        <Route
-          path="/instances/~:action/:instance?"
-          exact
-          component={Breadcrumb}
-        />
-        <Route path="/instances/:instance?" component={Breadcrumb} />
+        <Route path="/~create/:section?" exact component={Breadcrumb} />
+        <Route path="/~:action/:instance?" exact component={Breadcrumb} />
+        <Route path="/:instance?" component={Breadcrumb} />
       </Switch>
 
       {/* Menu */}
       <Switch>
-        <Route path="/instances/~:action/:id?" exact component={Menu} />
-        <Route path="/instances/:instance?/:section?" component={Menu} />
+        <Route path="/~:action/:id?" exact component={Menu} />
+        <Route path="/:instance?/:section?" component={Menu} />
       </Switch>
 
       {/* Instances List */}
       <Switch>
-        <Route path="/instances" exact component={Instances} />
+        <Route path="/" exact component={Instances} />
       </Switch>
 
       {/* Instance Sections */}
       <Switch>
-        <Route path="/instances/~:action" component={() => null} />
+        <Route path="/~:action" component={() => null} />
+        <Route path="/:instance/summary" exact component={InstanceSummary} />
+        <Route path="/:instance/tags" exact component={InstanceTags} />
+        <Route path="/:instance/metadata" exact component={InstanceMetadata} />
+        <Route path="/:instance/networks" exact component={InstanceNetworks} />
+        <Route path="/:instance/firewall" exact component={InstanceFirewall} />
         <Route
-          path="/instances/:instance/summary"
-          exact
-          component={InstanceSummary}
-        />
-        <Route
-          path="/instances/:instance/tags"
-          exact
-          component={InstanceTags}
-        />
-        <Route
-          path="/instances/:instance/metadata"
-          exact
-          component={InstanceMetadata}
-        />
-        <Route
-          path="/instances/:instance/networks"
-          exact
-          component={InstanceNetworks}
-        />
-        <Route
-          path="/instances/:instance/firewall"
-          exact
-          component={InstanceFirewall}
-        />
-        <Route
-          path="/instances/:instance/snapshots"
+          path="/:instance/snapshots"
           exact
           component={InstanceSnapshots}
         />
-        <Route path="/instances/:instance/cns" exact component={InstanceCns} />
+        <Route path="/:instance/cns" exact component={InstanceCns} />
         <Route
-          path="/instances/:instance/user-script"
+          path="/:instance/user-script"
           exact
           component={InstanceUserScript}
         />
         <Route
-          path="/instances/:instance"
+          path="/:instance"
           exact
           component={({ match }) => (
-            <Redirect
-              to={`/instances/${get(match, 'params.instance')}/summary`}
-            />
+            <Redirect to={`/${get(match, 'params.instance')}/summary`} />
           )}
         />
       </Switch>
@@ -103,14 +73,14 @@ export default () => (
       <Switch>
         {/* Create Instance */}
         <Route
-          path="/instances/~create/"
+          path="/~create/"
           exact
-          component={() => <Redirect to="/instances/~create/name" />}
+          component={({ match, location }) => (
+            <Redirect to={`/~create/name${location.search}`} />
+          )}
         />
-        <Route path="/instances/~create/:step" component={CreateInstance} />
+        <Route path="/~create/:step" component={CreateInstance} />
       </Switch>
-
-      <Route path="/" exact component={() => <Redirect to="/instances" />} />
       <Footer />
     </PageContainer>
   </BrowserRouter>
diff --git a/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap b/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap
index 44207c4d..31f11739 100644
--- a/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap
+++ b/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap
@@ -22,6 +22,11 @@ exports[`Button Default Button 1`] = `
   display: inline-block;
 }
 
+.c1 + button,
+.c1 + a {
+  margin-left: 0.375rem;
+}
+
 .c0 {
   box-sizing: border-box;
   display: inline-block;
@@ -128,6 +133,11 @@ exports[`Button Disabled Button 1`] = `
   display: inline-block;
 }
 
+.c1 + button,
+.c1 + a {
+  margin-left: 0.375rem;
+}
+
 .c0 {
   box-sizing: border-box;
   display: inline-block;
@@ -249,6 +259,11 @@ exports[`Button Error Button 1`] = `
   display: inline-block;
 }
 
+.c1 + button,
+.c1 + a {
+  margin-left: 0.375rem;
+}
+
 .c0 {
   box-sizing: border-box;
   display: inline-block;
@@ -378,6 +393,11 @@ exports[`Button Loading Button 1`] = `
   display: inline-block;
 }
 
+.c1 + button,
+.c1 + a {
+  margin-left: 0.375rem;
+}
+
 .c0 {
   box-sizing: border-box;
   display: inline-block;
@@ -501,6 +521,11 @@ exports[`Button Secondary Button 1`] = `
   display: inline-block;
 }
 
+.c1 + button,
+.c1 + a {
+  margin-left: 0.375rem;
+}
+
 .c0 {
   box-sizing: border-box;
   display: inline-block;
diff --git a/packages/ui-toolkit/src/button/index.js b/packages/ui-toolkit/src/button/index.js
index 4cf85ac8..6db00d38 100644
--- a/packages/ui-toolkit/src/button/index.js
+++ b/packages/ui-toolkit/src/button/index.js
@@ -12,7 +12,8 @@ import StatusLoader from '../status-loader';
 const StyledButton = NButton.extend`
   min-width: ${remcalc(120)};
 
-  & + button {
+  & + button,
+  & + a {
     margin-left: ${remcalc(6)};
   }
 `;
@@ -21,6 +22,11 @@ const InlineAnchor = styled(({ component, children, ...rest }) =>
   React.createElement(component, rest, children)
 )`
   display: inline-block;
+
+  & + button,
+  & + a {
+    margin-left: ${remcalc(6)};
+  }
 `;
 
 /**
diff --git a/yarn.lock b/yarn.lock
index 6b104aac..a2361a5e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4938,8 +4938,8 @@ graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.4,
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.11.tgz#0e8bdfe4d1ddb8854d64e04ea7c00e2a026e5658"
 
 graphi@^5.3.0:
-  version "5.3.1"
-  resolved "https://registry.yarnpkg.com/graphi/-/graphi-5.3.1.tgz#83715e0a8c433705fe94ca2d5a98a375a309873f"
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/graphi/-/graphi-5.3.2.tgz#ec427db244f576845163dd30dff780366d18933d"
   dependencies:
     boom "7.x.x"
     graphql "0.12.x"
@@ -8620,6 +8620,14 @@ query-string@^4.1.0:
     object-assign "^4.1.0"
     strict-uri-encode "^1.0.0"
 
+query-string@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/query-string/-/query-string-5.1.0.tgz#9583b15fd1307f899e973ed418886426a9976469"
+  dependencies:
+    decode-uri-component "^0.2.0"
+    object-assign "^4.1.0"
+    strict-uri-encode "^1.0.0"
+
 querystring-es3@^0.2.0:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73"