4 files changed, 20 insertions, 12 deletions
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 82cb3bc88..159a1cded 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -643,7 +643,7 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
         //add this new doc to props.Document
         const curPres = Cast(CurrentUserUtils.UserDocument.curPresentation, Doc) as Doc;
         if (curPres) {
-            const pinDoc = Docs.Create.PresElementBoxDocument({ backgroundColor: "transparent" });
+            const pinDoc = Docs.Create.PresElementBoxDocument({ backgroundColor: "transparent", _xMargin: 5 });
             Doc.GetProto(pinDoc).presentationTargetDoc = doc;
             Doc.GetProto(pinDoc).title = ComputedField.MakeFunction('(this.presentationTargetDoc instanceof Doc) && this.presentationTargetDoc.title?.toString()');
             const data = Cast(curPres.data, listSpec(Doc));
diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss
index e5a79ab11..01e7f4834 100644
--- a/src/client/views/nodes/PresBox.scss
+++ b/src/client/views/nodes/PresBox.scss
@@ -6,7 +6,7 @@
     top: 0;
     bottom: 0;
     width: 100%;
-    min-width: 200px;
+    min-width: 100px;
     height: 100%;
     min-height: 50px;
     letter-spacing: 2px;
@@ -16,8 +16,6 @@
 
     .presBox-listCont {
         position: relative;
-        padding-left: 10px;
-        padding-right: 10px;
     }
 
     .presBox-buttons {
diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx
index 428e9aa7b..8d53f45a6 100644
--- a/src/client/views/nodes/PresBox.tsx
+++ b/src/client/views/nodes/PresBox.tsx
@@ -42,7 +42,7 @@ export class PresBox extends React.Component<FieldViewProps> {
             if (value) {
                 value.forEach((item, i) => {
                     if (item instanceof Doc && item.type !== DocumentType.PRESELEMENT) {
-                        const pinDoc = Docs.Create.PresElementBoxDocument({ backgroundColor: "transparent" });
+                        const pinDoc = Docs.Create.PresElementBoxDocument({ backgroundColor: "transparent", _xMargin: 5 });
                         Doc.GetProto(pinDoc).presentationTargetDoc = item;
                         Doc.GetProto(pinDoc).title = ComputedField.MakeFunction('this.presentationTargetDoc?.title?.toString()');
                         value.splice(i, 1, pinDoc);
@@ -337,7 +337,7 @@ export class PresBox extends React.Component<FieldViewProps> {
     @action
     initializeScaleViews = (docList: Doc[], viewtype: number) => {
         this.props.Document._chromeStatus = "disabled";
-        const hgt = (viewtype === CollectionViewType.Tree) ? 50 : 72;
+        const hgt = (viewtype === CollectionViewType.Tree) ? 50 : 42;
         docList.forEach((doc: Doc) => {
             doc.presBox = this.props.Document;
             doc.presBoxKey = this.props.fieldKey;
@@ -357,7 +357,7 @@ export class PresBox extends React.Component<FieldViewProps> {
     }
 
     getTransform = () => {
-        return this.props.ScreenToLocalTransform().translate(-10, -50);// listBox padding-left and pres-box-cont minHeight
+        return this.props.ScreenToLocalTransform().translate(0, -50);// listBox padding-left and pres-box-cont minHeight
     }
     render() {
         this.initializeScaleViews(this.childDocs, NumCast(this.props.Document._viewType));
diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss
index ac78babef..b74b07224 100644
--- a/src/client/views/presentationview/PresElementBox.scss
+++ b/src/client/views/presentationview/PresElementBox.scss
@@ -6,14 +6,17 @@
     width: 100%;
     outline-color: maroon;
     outline-style: dashed;
-    border-radius: 12px;
+    border-radius: 6px;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
-    transition: all .1s;
+    transition: all .1s; 
+    padding: 0px;
+    padding-left: 5px;
+    padding-bottom: 3px;
 
     .documentView-node {
         position: absolute;
@@ -32,13 +35,13 @@
 .presElementBox-item:hover {
     transition: all .1s;
     background: #AAAAAA;
-    border-radius: 12px;
+    border-radius: 6px;
 }
 
 .presElementBox-selected {
     background: gray;
     color: black;
-    border-radius: 12px;
+    border-radius: 6px;
     box-shadow: black 2px 2px 5px;
 }
 
@@ -48,20 +51,27 @@
     position: absolute;
     right: 0;
     top: 0;
+    padding: 8px;
 }
 
 .presElementBox-interaction {
     color: gray;
     float: left;
+    padding: 0px;
+    width: 20px;
+    height: 20px;
 }
 
 .presElementBox-interaction-selected {
     color: white;
     float: left;
+    padding: 0px;
+    width: 22px;
+    height: 22px;
 }
 
 .presElementBox-name {
-    font-size: 15px;
+    font-size: 12px;
     position: absolute;
     display: inline-block;
     width: calc(100% - 45px);