chore: layout the details page better + fix exoframe config
+ 103
- 73
@@ -1,5 +1,5 @@
 {
-  "_generatedAtUnix": 1663710346170,
+  "_generatedAtUnix": 1663711620152,
   "_hashAlgorithm": "sha1",
   "_version": 2,
   "islands": {

...
@@ -58,7 +58,7 @@
       "pathSource": "./app/views/repository/RepositoryCreateView.tsx"
     },
     "RepositoryDetailsView": {
-      "hash": "9bd8849b7ac7baab21e1c6d0c8bd40549257bf72",
+      "hash": "fc8217689030be68927684cf6273eed9ea1550c5",
       "pathSource": "./app/views/repository/RepositoryDetailsView.tsx"
     },
     "RepositoryExploreView": {

app/views/repository/RepositoryDetailsView.tsx
@@ -11,7 +11,13 @@ import type {
   RepositoryFile,
   RepositoryFileContent,
 } from "../../types";
-import { Card, Layout, MarkdownToJsx, PageWrapper } from "../../components";
+import {
+  Card,
+  Grid,
+  Layout,
+  MarkdownToJsx,
+  PageWrapper,
+} from "../../components";
 // app islands
 import RepositoryInitialSetup from "../../islands/RepositoryInitialSetup";
 import RepositoryTreeView from "../../islands/RepositoryTreeView";

...
@@ -62,70 +68,93 @@ const RepositoryDetailsView: ReactView<RepositoryDetailsViewProps> = ({
             ({repo.visibility.toLowerCase()})
           </span>
         </h1>
-        <div>
-          <p>{repo.shortDescription}</p>
-          {repo.websiteUrl != null && (
-            <p>
-              <a
-                href={repo.websiteUrl}
-                target={"_blank"}
-                rel={"noopener noreferer noreferrer"}
+        <Grid.Row fluid style={{ marginTop: 32 }}>
+          <Grid.Col fluid flex={1}>
+            {repoHead == null ? (
+              <Card
+                data-islandid={`${RepositoryInitialSetup.name}$$0`}
+                style={{ width: "100%" }}
+                themeScheme={commonProps.themeScheme}
+              >
+                <RepositoryInitialSetup
+                  cloneUrl={cloneUrl}
+                  currentUser={currentUser}
+                  ref={ref}
+                  repo={repo}
+                />
+              </Card>
+            ) : (
+              <Card
+                data-islandid={`${RepositoryTreeView.name}$$0`}
+                style={{ width: "100%" }}
+                themeScheme={commonProps.themeScheme}
               >
-                {repo.websiteUrl}
-              </a>
-            </p>
-          )}
-        </div>
-        <div>
-          {repo.keywords.map((keyword, idx, arr) => (
-            <React.Fragment key={[idx, keyword].join(":")}>
-              <span>{keyword}</span>
-              {idx < arr.length - 1 ? ", " : "."}
-            </React.Fragment>
-          ))}
-        </div>
-        <div>
-          <p>
-            HTTP Clone: <code>{cloneUrl.http}</code>
-          </p>
-          <p>
-            SSH Clone: <code>{cloneUrl.ssh}</code>
-          </p>
-        </div>
-        {repoHead == null ? (
-          <div data-islandid={`${RepositoryInitialSetup.name}$$0`}>
-            <RepositoryInitialSetup
-              cloneUrl={cloneUrl}
-              currentUser={currentUser}
-              ref={ref}
-              repo={repo}
-            />
-          </div>
-        ) : (
-          <div data-islandid={`${RepositoryTreeView.name}$$0`}>
-            <RepositoryTreeView
-              currPath={path}
-              orgSlug={parentOrg.slug}
-              repoHead={repoHead}
-              repoFiles={repoFiles}
-              repoSlug={repo.slug}
-            />
-          </div>
-        )}
-        {readmeFileContent != null && (
-          <div style={{ width: "100%" }}>
-            <h3>Read Me</h3>
+                <RepositoryTreeView
+                  currPath={path}
+                  orgSlug={parentOrg.slug}
+                  repoHead={repoHead}
+                  repoFiles={repoFiles}
+                  repoSlug={repo.slug}
+                />
+              </Card>
+            )}
+            {readmeFileContent != null && (
+              <div style={{ width: "100%" }}>
+                <h3>Read Me</h3>
+                <Card
+                  style={{ width: "100%" }}
+                  themeScheme={commonProps.themeScheme}
+                >
+                  <MarkdownToJsx
+                    markdown={readmeFileContent.content}
+                    themeScheme={commonProps.themeScheme}
+                  />
+                </Card>
+              </div>
+            )}
+          </Grid.Col>
+          <Grid.Col flex={0.3} nowrap style={{ marginLeft: 24 }}>
             <Card
               style={{ width: "100%" }}
               themeScheme={commonProps.themeScheme}
             >
-              <MarkdownToJsx
-                markdown={readmeFileContent.content}
-                themeScheme={commonProps.themeScheme}
-              />
+              <div>
+                <p>{repo.shortDescription}</p>
+                {repo.websiteUrl != null && (
+                  <p>
+                    <a
+                      href={repo.websiteUrl}
+                      target={"_blank"}
+                      rel={"noopener noreferer noreferrer"}
+                    >
+                      {repo.websiteUrl}
+                    </a>
+                  </p>
+                )}
+              </div>
+              <div>
+                {repo.keywords.map((keyword, idx, arr) => (
+                  <React.Fragment key={[idx, keyword].join(":")}>
+                    <span>{keyword}</span>
+                    {idx < arr.length - 1 ? ", " : "."}
+                  </React.Fragment>
+                ))}
+              </div>
+              <div>
+                <p>
+                  <strong>HTTP Clone:</strong>
+                  <br />
+                  <code>{cloneUrl.http}</code>
+                </p>
+                <p>
+                  <strong>SSH Clone:</strong>
+                  <br />
+                  <code>{cloneUrl.ssh}</code>
+                </p>
+              </div>
             </Card>
-          </div>
-        )}
+          </Grid.Col>
+        </Grid.Row>
       </PageWrapper>
     </Layout>
   );

@@ -1,22 +1,23 @@
 {
-  "name": "react_monolith_docs",
+  "name": "git_ethicdevs_com",
   "template": "exoframe-template-node-16-lts",
-  "hostname": "react-monolith.ethicdevs.com",
-  "domain": "react-monolith.ethicdevs.com",
-  "restart": "always",
+  "hostname": "git.ethicdevs.com",
+  "domain": "git.ethicdevs.com",
   "port": "1337",
+  "restart": "always",
+  "compress": true,
+  "letsencrypt": true,
   "env": {
     "NODE_ENV": "production",
     "HOST": "0.0.0.0",
     "PORT": 1337,
-    "DEPLOYMENT_DOMAIN": "react-monolith.ethicdevs.com",
-    "DEPLOYMENT_SCHEME": "https",
-    "COOKIE_SECRET": "no-session-only-cookies"
+    "COOKIE_NAME": "git_ethicdevs_ssid",
+    "COOKIE_SECRET": "no-session-only-cookies",
+    "DEPLOYMENT_DOMAIN": "git.ethicdevs.com",
+    "DEPLOYMENT_SCHEME": "https"
   },
   "labels": {
-    "traefik.http.routers.teamtodo_v2_web.entrypoints": "web",
-    "traefik.http.routers.teamtodo_v2_web.rule": "Host(`react-monolith.ethicdevs.com`)"
-  },
-  "compress": true,
-  "letsencrypt": true
+    "traefik.http.routers.git_ethicdevs_com_web.entrypoints": "web",
+    "traefik.http.routers.git_ethicdevs_com_web.rule": "Host(`git.ethicdevs.com`)"
+  }
 }