aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/client/goldenLayout.js37
-rw-r--r--src/client/views/DocumentButtonBar.scss6
-rw-r--r--src/client/views/_nodeModuleOverrides.scss3
-rw-r--r--src/client/views/collections/CollectionDockingView.scss6
-rw-r--r--src/client/views/global/globalCssVariables.scss2
-rw-r--r--src/client/views/topbar/TopBar.scss52
-rw-r--r--src/client/views/topbar/TopBar.tsx34
7 files changed, 69 insertions, 71 deletions
diff --git a/src/client/goldenLayout.js b/src/client/goldenLayout.js
index b118a5f44..238f1ac0a 100644
--- a/src/client/goldenLayout.js
+++ b/src/client/goldenLayout.js
@@ -1571,11 +1571,11 @@
tabControlOffset: 10
},
dimensions: {
- borderWidth: 5,
+ borderWidth: 3,
borderGrabWidth: 5,
minItemHeight: 10,
- minItemWidth: 10,
- headerHeight: 22,
+ minItemWidth: 20,
+ headerHeight: 27,
dragProxyWidth: 300,
dragProxyHeight: 200
},
@@ -2477,20 +2477,21 @@
}
}
- if (this.layoutManager.config.settings.reorderOnTabMenuClick) {
- /**
- * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
- * This will make sure the most used tabs stay visible.
- */
- if (this._lastVisibleTabIndex !== -1 && this.parent.config.activeItemIndex > this._lastVisibleTabIndex) {
- activeTab = this.tabs[this.parent.config.activeItemIndex];
- for (j = this.parent.config.activeItemIndex; j > 0; j--) {
- this.tabs[j] = this.tabs[j - 1];
- }
- this.tabs[0] = activeTab;
- this.parent.config.activeItemIndex = 0;
- }
- }
+ // glr: removed for new tab manager
+ // if (this.layoutManager.config.settings.reorderOnTabMenuClick) {
+ // /**
+ // * If the tab selected was in the dropdown, move everything down one to make way for this one to be the first.
+ // * This will make sure the most used tabs stay visible.
+ // */
+ // if (this._lastVisibleTabIndex !== -1 && this.parent.config.activeItemIndex > this._lastVisibleTabIndex) {
+ // activeTab = this.tabs[this.parent.config.activeItemIndex];
+ // for (j = this.parent.config.activeItemIndex; j > 0; j--) {
+ // this.tabs[j] = this.tabs[j - 1];
+ // }
+ // this.tabs[0] = activeTab;
+ // this.parent.config.activeItemIndex = 0;
+ // }
+ // }
this._updateTabSizes();
this.parent.emitBubblingEvent('stateChanged');
@@ -4872,7 +4873,7 @@
this.layoutManager.dropTargetIndicator.highlightArea({
x1: headerOffset.left,
x2: headerOffset.left + 100,
- y1: headerOffset.top + this.header.element.height() - 20,
+ y1: headerOffset.top + this.header.element.height() - 25,
y2: headerOffset.top + this.header.element.height()
});
diff --git a/src/client/views/DocumentButtonBar.scss b/src/client/views/DocumentButtonBar.scss
index 2a0b494f5..621c2bf1b 100644
--- a/src/client/views/DocumentButtonBar.scss
+++ b/src/client/views/DocumentButtonBar.scss
@@ -44,18 +44,16 @@ $linkGap : 3px;
}
.documentButtonBar {
- margin-top: $linkGap;
- grid-column: 1/4;
- width: max-content;
- height: auto;
display: flex;
flex-direction: row;
+ gap: 3px;
}
.documentButtonBar-button {
pointer-events: auto;
padding-right: 5px;
width: 25px;
+ height: 25px;
}
.documentButtonBar-linker {
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index 140be2140..fd0ac9d5c 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -5,6 +5,7 @@
div .lm_header {
background: $dark-gray;
overflow: hidden;
+ height: 27px !important;
}
/* Width */
@@ -62,7 +63,7 @@ div .lm_header {
border-radius: 5px;
display: flex;
justify-content: space-evenly;
- height: 18px;
+ height: 23px;
width: 65px;
}
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index b8180fe24..77e7b86ea 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -39,7 +39,7 @@
padding: 0px;
opacity: 0.7;
box-shadow: none;
- height: 19px;
+ height: 24px;
// border-bottom: 1px black;
.collectionDockingView-gear {
@@ -52,7 +52,7 @@
opacity: 1;
margin: 0;
box-shadow: none;
- height: 22px;
+ height: 27px;
margin-right: 2px;
// border-bottom: unset;
@@ -357,8 +357,6 @@
background: transparent url("../../../../node_modules/flexlayout-react/images/restore.png") no-repeat center;
}
- .flexlayout__popup_menu {}
-
.flexlayout__popup_menu_item {
padding: 2px 10px 2px 10px;
color: #ddd;
diff --git a/src/client/views/global/globalCssVariables.scss b/src/client/views/global/globalCssVariables.scss
index 72adc171b..a9f33c4da 100644
--- a/src/client/views/global/globalCssVariables.scss
+++ b/src/client/views/global/globalCssVariables.scss
@@ -11,6 +11,8 @@ $medium-blue: #4476F7;
$pink: #E0217D;
$yellow: #F5D747;
+$logout-red: #ca4444;
+
$drop-shadow: "#32323215";
//padding
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index ce6636080..adb968948 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -20,11 +20,34 @@
align-items: center;
background-color: $dark-gray;
+ .topBar-icon {
+ cursor: pointer;
+ font-size: 12px;
+ width: fit-content;
+ display: flex;
+ justify-content: center;
+ gap: 4px;
+ align-items: center;
+ justify-self: center;
+ align-self: center;
+ border-radius: 5px;
+ padding: 5px;
+ transition: linear 0.1s;
+ color: $black;
+ background-color: $light-gray;
+ }
+
+ .topBar-icon:hover {
+ background-color: $light-blue;
+ }
+
+
.topbar-center {
grid-column: 2;
display: inline-flex;
justify-content: center;
align-items: center;
+ gap: 5px;
.topbar-lozenge-dashboard {
display: flex;
@@ -48,37 +71,13 @@
}
}
- .topBar-icon {
- color: black;
- cursor: pointer;
- font-size: 15px;
- height: 30;
- width: 30;
- display: flex;
- justify-content: center;
- align-items: center;
- margin-right: 5px;
- justify-self: center;
- align-self: center;
- border-radius: 100%;
- transition: linear 0.1s;
- background-color: #92adb900;
- }
-
- .topBar-icon:hover {
- background-color: rgba(0, 0, 0, 0.15);
- }
.topbar-right {
grid-column: 3;
position: relative;
display: flex;
justify-content: flex-end;
-
-
-
-
-
+ gap: 5px;
}
.topbar-left {
@@ -88,6 +87,7 @@
position: relative;
display: flex;
width: 450;
+ gap: 5px;
.topbar-lozenge-user,
.topbar-lozenge {
@@ -98,10 +98,10 @@
font-weight: 400;
padding: 4px;
align-self: center;
+ margin-left: 7px;
margin-right: 7px;
display: flex;
align-items: center;
- border: white 1px solid;
.topbar-dashSelect {
border: none;
diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx
index 02b597078..6e4d4fe15 100644
--- a/src/client/views/topbar/TopBar.tsx
+++ b/src/client/views/topbar/TopBar.tsx
@@ -27,9 +27,9 @@ export class TopBar extends React.Component {
<div className="topbar-left">
<div className="topbar-lozenge-user">
{`${Doc.CurrentUserEmail}`}
- <div className="topbar-logoff" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
- Logoff
- </div>
+ </div>
+ <div className="topbar-icon" onClick={() => window.location.assign(Utils.prepend("/logout"))}>
+ {"Logoff"}<FontAwesomeIcon icon="sign-out"></FontAwesomeIcon>
</div>
</div>
<div className="topbar-center" >
@@ -39,26 +39,24 @@ export class TopBar extends React.Component {
style={{ color: Colors.WHITE }}>
{myDashboards.map((dash, i) => <option key={dash[Id]} value={i}> {StrCast(dash.title)} </option>)}
</select>
- <div className="topbar-dashboards">
- <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
- style={{ color: Colors.WHITE }}>
- <FontAwesomeIcon icon="plus"></FontAwesomeIcon>{"New"}
- </div>
- <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
- style={{ color: Colors.WHITE }}>
- <FontAwesomeIcon icon="camera"></FontAwesomeIcon>{"Snapshot"}
- </div>
+ </div>
+ <div className="topbar-dashboards">
+ <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.createNewDashboard(Doc.UserDoc()))}
+ >
+ {"New"}<FontAwesomeIcon icon="plus"></FontAwesomeIcon>
</div>
+ {Doc.UserDoc().noviceMode ? (null) : <div className="topbar-icon" onClick={undoBatch(() => CurrentUserUtils.snapshotDashboard(Doc.UserDoc()))}
+ >
+ {"Snapshot"}<FontAwesomeIcon icon="camera"></FontAwesomeIcon>
+ </div>}
</div>
</div>
<div className="topbar-right" >
- <div className="topbar-icon"
- style={{ color: Colors.WHITE }}>
- <FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
+ <div className="topbar-icon">
+ {"Help"}<FontAwesomeIcon icon="question-circle"></FontAwesomeIcon>
</div>
- <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}
- style={{ color: Colors.WHITE }}>
- <FontAwesomeIcon icon="cog"></FontAwesomeIcon>
+ <div className="topbar-icon" onClick={() => SettingsManager.Instance.open()}>
+ {"Settings"}<FontAwesomeIcon icon="cog"></FontAwesomeIcon>
</div>
</div>