From 101f04d82e49335fb2a55301a4ef4e7b04f081e6 Mon Sep 17 00:00:00 2001
From: geireann <60007097+geireann@users.noreply.github.com>
Date: Mon, 23 Aug 2021 22:15:40 -0400
Subject: menu getting closer :cry:

---
 src/client/views/collections/TabDocView.scss       | 30 +++++++++++++---------
 src/client/views/collections/TabDocView.tsx        | 12 +++++++--
 .../collectionLinearView/CollectionLinearView.scss |  2 +-
 .../collectionLinearView/CollectionLinearView.tsx  | 10 +++++---
 4 files changed, 36 insertions(+), 18 deletions(-)

(limited to 'src/client/views/collections')

diff --git a/src/client/views/collections/TabDocView.scss b/src/client/views/collections/TabDocView.scss
index a963f1cb9..7f62ecaa0 100644
--- a/src/client/views/collections/TabDocView.scss
+++ b/src/client/views/collections/TabDocView.scss
@@ -1,3 +1,6 @@
+@import "../global/globalCssVariables.scss";
+
+
 input.lm_title:focus,
 input.lm_title {
     max-width: unset !important;
@@ -57,12 +60,11 @@ input.lm_title {
     }
 }
 
-.miniMap-hidden,
 .miniMap {
     position: absolute;
     overflow: hidden;
-    right: 10;
-    bottom: 10;
+    right: 15;
+    bottom: 15;
     border: solid 1px;
     box-shadow: black 0.4vw 0.4vw 0.8vw;
     width: 100%;
@@ -82,17 +84,21 @@ input.lm_title {
 }
 
 .miniMap-hidden {
+    cursor: pointer;
     position: absolute;
-    bottom: 0;
-    right: 0;
-    width: 45px;
-    height: 45px;
-    transform: translate(20px, 20px) rotate(45deg);
-    border-radius: 30px;
+    bottom: 5;
+    display: flex;
+    right: 5;
+    width: 25px;
+    height: 25px;
+    border-radius: 3px;
     padding: 2px;
+    justify-content: center;
+    align-items: center;
+    align-content: center;
+    background-color: $light-gray;
 
-    >svg {
-        margin-top: 3px;
-        transform: translate(0px, 7px);
+    &:hover {
+        box-shadow: none;
     }
 }
\ No newline at end of file
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 00de36400..a999512cc 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -34,6 +34,7 @@ import { CollectionView, CollectionViewType } from './CollectionView';
 import "./TabDocView.scss";
 import React = require("react");
 import Color = require('color');
+import { Colors, Shadows } from '../global/globalEnums';
 const _global = (window /* browser */ || global /* node */) as any;
 
 interface TabDocViewProps {
@@ -386,8 +387,15 @@ export class TabDocView extends React.Component<TabDocViewProps> {
                     background={this.miniMapColor}
                     document={this._document}
                     tabView={this.tabView} />
-                <Tooltip style={{ display: this.disableMinimap() ? "none" : undefined }} key="ttip" title={<div className="dash-tooltip">{"toggle minimap"}</div>}>
-                    <div className="miniMap-hidden" onPointerDown={e => e.stopPropagation()} onClick={action(e => { e.stopPropagation(); this._document!.hideMinimap = !this._document!.hideMinimap; })} >
+                <Tooltip style={{ display: this.disableMinimap() ? "none" : undefined }} key="ttip" title={<div className="dash-tooltip">{this._document.hideMinimap ? "Open minimap" : "Close minimap"}</div>}>
+                    <div className="miniMap-hidden"
+                        style={{
+                            color: this._document.hideMinimap ? Colors.BLACK : Colors.WHITE,
+                            backgroundColor: this._document.hideMinimap ? Colors.LIGHT_GRAY : Colors.MEDIUM_BLUE,
+                            boxShadow: this._document.hideMinimap ? Shadows.STANDARD_SHADOW : undefined
+                        }}
+                        onPointerDown={e => e.stopPropagation()}
+                        onClick={action(e => { e.stopPropagation(); this._document!.hideMinimap = !this._document!.hideMinimap; })} >
                         <FontAwesomeIcon icon={"globe-asia"} size="lg" />
                     </div>
                 </Tooltip>
diff --git a/src/client/views/collections/collectionLinearView/CollectionLinearView.scss b/src/client/views/collections/collectionLinearView/CollectionLinearView.scss
index 44752e034..24c9bc9cb 100644
--- a/src/client/views/collections/collectionLinearView/CollectionLinearView.scss
+++ b/src/client/views/collections/collectionLinearView/CollectionLinearView.scss
@@ -89,7 +89,7 @@
             padding: 5;
             border-radius: 2px;
             height: 25;
-
+            min-width: 25;
             margin: 0;
             color: $white;
             display: flex;
diff --git a/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx b/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
index 48f50cf2d..990c2e4b2 100644
--- a/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
+++ b/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
@@ -17,7 +17,7 @@ import { StyleProp } from '../../StyleProvider';
 import "./CollectionLinearView.scss";
 import { CollectionSubView } from '.././CollectionSubView';
 import { CollectionViewType } from '.././CollectionView';
-import { Colors } from '../../global/globalEnums';
+import { Colors, Shadows } from '../../global/globalEnums';
 
 
 type LinearDocument = makeInterface<[typeof documentSchema,]>;
@@ -112,6 +112,8 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
         const flexDir: any = StrCast(this.Document.flexDirection); // Specify direction of linear view content
         const flexGap: number = NumCast(this.Document.flexGap); // Specify the gap between linear view content
         const expandable: boolean = BoolCast(this.props.Document.linearViewExpandable); // Specify whether it is expandable or not
+        const floating: boolean = BoolCast(this.props.Document.linearViewFloating); // Specify whether it is expandable or not
+
         const backgroundColor = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.BackgroundColor);
         const color = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.Color);
         const icon: string = StrCast(this.props.Document.icon); // Menu opener toggle
@@ -121,7 +123,9 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
                 backgroundColor: backgroundColor === color ? "black" : BoolCast(this.layoutDoc.linearViewIsExpanded) ? undefined : Colors.LIGHT_GRAY
             }}
             onPointerDown={e => e.stopPropagation()} >
-            <div className="collectionLinearView-menuOpener">
+            <div className="collectionLinearView-menuOpener"
+                style={{ boxShadow: floating ? Shadows.STANDARD_SHADOW : undefined }}
+            >
                 {BoolCast(this.layoutDoc.linearViewIsExpanded) ? icon ? icon : "–" : icon ? icon : "+"}
             </div>
         </label>;
@@ -181,7 +185,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
                         </div>;
                     })}
                 </div>
-                {DocumentLinksButton.StartLink ? <span className="bottomPopup-background" style={{
+                {DocumentLinksButton.StartLink && StrCast(this.layoutDoc.title) === "docked buttons" ? <span className="bottomPopup-background" style={{
                     pointerEvents: "all"
                 }}
                     onPointerDown={e => e.stopPropagation()} >
-- 
cgit v1.2.3-70-g09d2