Merge pull request #26 from Tauffer-Consulting/docs/workspace-permiss…

…ions improve responsiveness and add workspace permissions
Tauffer-Consulting · Mar 28, 2024 · 1069d10 · 1069d10
2 parents 9c56723 + 211e93d
commit 1069d10
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 14 deletions.
diff --git a/docs/domino_components/domino_components_gui.md b/docs/domino_components/domino_components_gui.md
@@ -11,7 +11,7 @@ The Domino frontend service is a React application that provides the GUI for eas
     <summary>
         <strong>Sign up and login</strong>
     </summary>
-    Sign up and login to use the Domino platform. 
+    Sign up and login to use the Domino platform.
     <br/><br/>
 
 ![Sign-up](/img/domino_components/gui/signup.gif)
@@ -25,6 +25,7 @@ The Domino frontend service is a React application that provides the GUI for eas
         <strong>Create your workspace</strong>
     </summary>
     Create a new workspace and add your github access token.
+    Workspaces are isolated environments where you can create and run workflows.
     <br/><br/>
 
 ![Create-workspace](/img/domino_components/gui/create-workspace.gif)
@@ -38,8 +39,16 @@ The Domino frontend service is a React application that provides the GUI for eas
     </summary>
     In Domino UI you can create different workspaces and invite other users to collaborate with you.
     For each workspace you can select the users that will have access to it and the pieces repositories you want to install on it.
+    <br/>
+    You can provide different access levels to the users of your workspace:
+    <ul>
+        <li> <span style={{fontWeight: 'bold'}}>Admin:</span> can invite other users and remove them from the workspace, create and run workflows, install pieces and edit secrets.</li>
+        <li> <span style={{fontWeight: 'bold'}}>Write:</span> can create and run workflows.</li>
+        <li> <span style={{fontWeight: 'bold'}}>Read:</span> can only see the workflows runs and their logs.</li>
+    </ul>
     <br/><br/>
 
+
 ![Invite User](/img/domino_components/gui/invite-to-workspace.gif)
 
 </details>
@@ -64,7 +73,7 @@ The Domino frontend service is a React application that provides the GUI for eas
     <summary>
         <strong>Remove an user from workspace</strong>
     </summary>
-    If you are the owner of a workspace, you can remove an user from it.
+    If you are the owner or admin of a workspace, you can remove an user from it.
     <br/><br/>
 
 ![Remove user](/img/domino_components/gui/remove-user-from-workspace.gif)
@@ -83,7 +92,7 @@ If you are not the owner, you can leave the workspace by yourself.
     <summary>
         <strong>Install Pieces repositories</strong>
     </summary>
-    Install bundles of Pieces to your Domino Workspaces direclty from Github repositories, and use them in your Workflows. 
+    Install bundles of Pieces to your Domino Workspaces direclty from Github repositories, and use them in your Workflows.
     <br/><br/>
 
 ![Add Pieces](/img/domino_components/gui/add-pieces-to-workspace.gif)
@@ -95,7 +104,7 @@ If you are not the owner, you can leave the workspace by yourself.
     <summary>
         <strong>Create Workflows</strong>
     </summary>
-    Create Workflows by dragging and dropping Pieces to the canvas, and connecting them. 
+    Create Workflows by dragging and dropping Pieces to the canvas, and connecting them.
     <br/><br/>
 
 ![Domino create workflow](/img/intro/create-workflow.gif)

diff --git a/src/components/Home/Session1/TitleGroup/index.css b/src/components/Home/Session1/TitleGroup/index.css
@@ -10,7 +10,7 @@ h1#title {
 
   font-style: normal;
   font-weight: 400;
-  font-size: 6vw;
+  font-size: calc(90px + 1vw);
   color: #101820;
 }
 
@@ -34,7 +34,7 @@ div#subtitle-container {
 }
 
 h3#subtitle {
-  font-size: 1.4vw;
+  font-size: calc(20px + 0.2vw);
   font-weight: 400;
 }
 
@@ -44,6 +44,7 @@ h3#subtitle > b {
 
 div#button-container {
   margin-top: 6%;
+  margin-bottom: 3%;
 }
 
 div#button-container > button {
@@ -55,21 +56,22 @@ div#button-container > button {
   margin-right: 36px;
 }
 
-@media only screen and (min-width: 979px) and (max-width: 1368px) {  
+@media only screen and (min-width: 979px) and (max-width: 1368px) {
   #title-container {
     margin-top: 24px;
   }
 
   h1#title {
-    font-size: 7vw;
+    font-size: calc(90px + 1vw);
   }
 
   div#subtitle-container {
     max-width: 70%;
   }
 
   h3#subtitle {
-    font-size: 2vw;
+    /* font-size: 2vw; */
+    font-size: calc(20px + 0.2vw);
   }
 
   div#subtitle-container {
@@ -80,7 +82,7 @@ div#button-container > button {
     margin-bottom: 24px;
     margin-top: 8px;
   }
-  
+
   div#button-container > button {
     font-size: 26px;
   }
@@ -94,11 +96,13 @@ div#button-container > button {
   }
 
   h1#title {
-    font-size: 10vw;
+    /* font-size: 10vw; */
+    font-size: calc(90px + 1vw);
   }
 
   h3#subtitle  {
-    font-size: 3vw;
+    /* font-size: 3vw; */
+    font-size: calc(20px + 0.2vw);
   }
 
   div#button-container{
@@ -109,4 +113,11 @@ div#button-container > button {
   div#button-container > button {
     font-size: 18px;
   }
+}
+
+
+@media only screen and (max-width: 1144px) {
+  h1#title {
+    font-size: calc(36px + 1vw);
+  }
 }
diff --git a/src/components/Home/Session1/index.css b/src/components/Home/Session1/index.css
@@ -1,7 +1,7 @@
 
 section#section-1 {
   padding: 0 6%;
-  height: calc(100vh - 144px - 64px);
+  min-height: calc(100vh - 144px - 64px);
 }
 
 div#container {
@@ -10,7 +10,7 @@ div#container {
   padding-top: 80px;
 }
 
-@media only screen and (min-width: 979px) and (max-width: 1368px) {  
+@media only screen and (min-width: 979px) and (max-width: 1368px) {
   div#container {
     flex-direction: column;
     justify-content: space-between;