4 files changed, 48 insertions, 22 deletions
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index e84969565..5b142ffda 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -28,10 +28,11 @@
     left: 0;
     width: 100%;
     height: 100%;
-    pointer-events:none;
+    pointer-events: none;
 }
 
-.mainView-container, .mainView-container-dark {
+.mainView-container,
+.mainView-container-dark {
     width: 100%;
     height: 100%;
     position: absolute;
@@ -40,40 +41,50 @@
     left: 0;
     z-index: 1;
     touch-action: none;
+
     .searchBox-container {
         background: lightgray;
     }
 }
 
 .mainView-container {
-    color:dimgray;
+    color: dimgray;
+
     .lm_title {
         background: #cacaca;
-        color:black;
+        color: black;
     }
 }
 
 .mainView-container-dark {
     color: lightgray;
+
     .lm_goldenlayout {
         background: dimgray;
     }
+
     .lm_title {
         background: black;
-        color:unset;
+        color: unset;
     }
+
     .marquee {
         border-color: white;
     }
+
     #search-input {
         background: lightgray;
     }
-    .searchBox-container  {
-        background: rgb(45,45,45);
+
+    .searchBox-container {
+        background: rgb(45, 45, 45);
     }
-    .contextMenu-cont, .contextMenu-item {
+
+    .contextMenu-cont,
+    .contextMenu-item {
         background: dimGray;
     }
+
     .contextMenu-item:hover {
         background: gray;
     }
@@ -108,20 +119,27 @@
     overflow: hidden;
 }
 
+.buttonContainer {
 
-.mainView-settings {
     position: absolute;
-    left: 0;
     bottom: 0;
-    border-radius: 25%;
-    margin-left: -5px;
-    background: darkblue;
-}
 
-.mainView-settings:hover {
-    transform: none !important;
+    .mainView-settings {
+        // position: absolute;
+        // left: 0;
+        // bottom: 0;
+        border-radius: 25%;
+        margin-left: -5px;
+        background: darkblue;
+    }
+
+    .mainView-settings:hover {
+        transform: none !important;
+    }
 }
 
+
+
 .mainView-logout {
     position: absolute;
     right: 0;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index d6c46e3b0..e301b2be6 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -29,6 +29,7 @@ import { HistoryUtil } from '../util/History';
 import RichTextMenu from './nodes/formattedText/RichTextMenu';
 import { Scripting } from '../util/Scripting';
 import SettingsManager from '../util/SettingsManager';
+import GroupManager from '../util/GroupManager';
 import SharingManager from '../util/SharingManager';
 import { Transform } from '../util/Transform';
 import { CollectionDockingView } from './collections/CollectionDockingView';
@@ -448,9 +449,14 @@ export class MainView extends React.Component {
                     docFilters={returnEmptyFilter}
                     ContainingCollectionView={undefined}
                     ContainingCollectionDoc={undefined} />
-                <button className="mainView-settings" key="settings" onClick={() => SettingsManager.Instance.open()}>
-                    <FontAwesomeIcon icon="cog" size="lg" />
-                </button>
+                <div className="buttonContainer" >
+                    <button className="mainView-settings" key="settings" onClick={() => SettingsManager.Instance.open()}>
+                        <FontAwesomeIcon icon="cog" size="lg" />
+                    </button>
+                    <button className="mainView-settings" key="groups" onClick={() => GroupManager.Instance.open()}>
+                        <FontAwesomeIcon icon="columns" size="lg" />
+                    </button>
+                </div>
             </div>
             {this.docButtons}
         </div>;
@@ -567,6 +573,7 @@ export class MainView extends React.Component {
             <DictationOverlay />
             <SharingManager />
             <SettingsManager />
+            <GroupManager />
             <GoogleAuthenticationManager />
             <DocumentDecorations />
             <GestureOverlay>
diff --git a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
index b60ed853b..eb48d87c8 100644
--- a/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
+++ b/src/client/views/collections/CollectionStackingViewFieldColumn.tsx
@@ -362,7 +362,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
                 {this.props.parent.Document.hideHeadings ? (null) : headingView}
                 {
                     this.collapsed ? (null) :
-                        <div>
+                        <div style={{ marginTop: 5 }}>
                             <div key={`${heading}-stack`} className={`collectionStackingView-masonry${singleColumn ? "Single" : "Grid"}`}
                                 style={{
                                     padding: singleColumn ? `${columnYMargin}px ${0}px ${style.yMargin}px ${0}px` : `${columnYMargin}px ${0}px`,
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 6f3c46be6..57b6f2bb4 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -673,7 +673,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
 
     @undoBatch
     @action
-    setAcl = (acl: "readOnly" | "addOnly" | "ownerOnly") => {
+    setAcl = (acl: "readOnly" | "addOnly" | "ownerOnly" | "write") => {
         this.dataDoc.ACL = this.props.Document.ACL = acl;
         DocListCast(this.dataDoc[Doc.LayoutFieldKey(this.dataDoc)]).map(d => {
             if (d.author === Doc.CurrentUserEmail) d.ACL = acl;
@@ -683,7 +683,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
     }
     @undoBatch
     @action
-    testAcl = (acl: "readOnly" | "addOnly" | "ownerOnly") => {
+    testAcl = (acl: "readOnly" | "addOnly" | "ownerOnly" | "write") => {
         this.dataDoc.author = this.props.Document.author = "ADMIN";
         this.dataDoc.ACL = this.props.Document.ACL = acl;
         DocListCast(this.dataDoc[Doc.LayoutFieldKey(this.dataDoc)]).map(d => {
@@ -797,6 +797,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
         aclItems.push({ description: "Make Add Only", event: () => this.setAcl("addOnly"), icon: "concierge-bell" });
         aclItems.push({ description: "Make Read Only", event: () => this.setAcl("readOnly"), icon: "concierge-bell" });
         aclItems.push({ description: "Make Private", event: () => this.setAcl("ownerOnly"), icon: "concierge-bell" });
+        aclItems.push({ description: "Make Editable", event: () => this.setAcl("write"), icon: "concierge-bell" });
         aclItems.push({ description: "Test Private", event: () => this.testAcl("ownerOnly"), icon: "concierge-bell" });
         aclItems.push({ description: "Test Readonly", event: () => this.testAcl("readOnly"), icon: "concierge-bell" });
         !existingAcls && cm.addItem({ description: "Privacy...", subitems: aclItems, icon: "question" });