Work in progress new style

This commit is contained in:
Paulo Gustavo Veiga 2022-01-05 22:16:30 -08:00
parent 33b08cf3a0
commit 3629113e9f
7 changed files with 41 additions and 81 deletions

View File

@ -407,19 +407,6 @@ class Menu extends IMenu {
event.preventDefault();
});
}
const videoElem = $('#tutorialVideo');
if (videoElem) {
const width = 900;
const height = 500;
const left = (window.screen.width / 2) - (width / 2);
const top = (window.screen.height / 2) - (height / 2);
videoElem.bind('click', (event) => {
window.open('https://www.youtube.com/tv?vq=medium#/watch?v=rKxZwNKs9cE', '_blank', `toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, copyhistory=no, width=${width}, height=${height}, top=${top}, left=${left}`);
event.preventDefault();
});
}
}
_registerEvents(designer) {

View File

@ -50,7 +50,7 @@ class ToolbarPaneItem extends ToolbarItem {
className: 'toolbarPaneTip',
trigger: 'manual',
template:
'<div class="popover popoverGray" role="tooltip"><div class="arrow arrowGray"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
'<div class="popover" role="tooltip"><div class="arrow arrowGray"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
});
this._tip.addEvent('hide', () => {

View File

@ -85,15 +85,6 @@ div.modalDialog {
border: 1px solid #999;
padding: 10px;
overflow: auto;
/* IE6-7 */
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;
background-clip: padding-box;
@ -151,21 +142,13 @@ div.shareModalDialog {
background-color: #efefef;
}
.popoverBlack {
background: black;
// TODO: Review position.
div#bottom-logo {
position: absolute;
bottom: 220px;
right: 0;
background: url(../images/logo-text-black.svg) no-repeat;
width: 100px;
height: 40px;
z-index: 10000;
}
.popoverBlack.bottom .arrow:after {
border-bottom-color: black;
}
.popoverGray {
background: #e4e2d2;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
border: 3px double #bebebe;
max-width: none;
}
.popoverGray.bottom .arrow:after {
border-bottom-color: #e4e2d2;
}

View File

@ -59,28 +59,3 @@ div#headerNotifier {
}
@import "toolbar.less";
/* FIXME: duplicate in mindmapList
---------------------------- Scrollbar --------------------------------- */
::-webkit-scrollbar {
width: 8px;
direction: rtl;
text-align: left;
position: relative;
left: 10px;
}
::-webkit-scrollbar-track {
border-radius: 10px;
background-color: #eaeaea;
border-left: 1px solid #ccc;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color: #c6c6c6;
}
::-webkit-scrollbar-thumb:hover {
background-color: #08c;
}

View File

@ -1,21 +1,33 @@
div#toolbar {
width: 100%;
height: 50px;
padding: 8px 15px;
box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
background-color: #fff;
}
div#toolbar .buttonContainer {
height: @header-toolbar-height;
padding-top: 8px;
padding-right: 10px;
padding-left: 10px;
float: left;
margin-left: 20px;
border-left: 1px solid lightgray;
}
div#logo-text {
background: url(../images/logo-text-black.svg) no-repeat center top;
div#mapName >span {
border-radius: 4px;
float: left;
padding: 8px;
min-width: 30px;
font-weight: bold;
}
div#back {
background: url(../images/back-icon.svg) no-repeat center top;
height: 40px;
width: 80px;
float: left;
margin: 8px 0px;
}
/******************************************************************************************/
@ -40,17 +52,17 @@ div#toolbar .buttonOn:hover {
div#toolbar .buttonOn:hover {
cursor: pointer;
opacity: 1;
background: url(../images/btn-bg-hover.png) no-repeat center top;
// background: url(../images/btn-bg-hover.png) no-repeat center top;
}
div#toolbar .buttonOn {
opacity: 0.8;
background: url(../images/btn-bg-normal.png) no-repeat center top;
// background: url(../images/btn-bg-normal.png) no-repeat center top;
}
div#toolbar .buttonOff {
opacity: 0.4;
background: url(../images/btn-bg-normal.png) no-repeat center top;
// background: url(../images/btn-bg-normal.png) no-repeat center top;
}
div#exportAnchor {
@ -78,24 +90,24 @@ div#toolbar .buttonExtOn:hover {
div#toolbar .buttonExtOn:hover {
opacity: 1;
background: url(../images/btne-bg-hover.png) no-repeat center top;
// background: url(../images/btne-bg-hover.png) no-repeat center top;
}
div#toolbar .buttonExtActive {
opacity: 1;
background: url(../images/btne-bg-selected.png) no-repeat center top;
// background: url(../images/btne-bg-selected.png) no-repeat center top;
}
div#toolbar .buttonExtOn {
opacity: 0.8;
background: url(../images/btne-bg-normal.png) no-repeat center top;
cursor: pointer
// background: url(../images/btne-bg-normal.png) no-repeat center top;
}
div#toolbar .buttonExtOff {
opacity: 0.4;
background: url(../images/btne-bg-normal.png) no-repeat center top;
// background: url(../images/btne-bg-normal.png) no-repeat center top;
}
div#exportAnchor {

View File

@ -12,7 +12,10 @@
<body>
<div id="header">
<div id="toolbar">
<div id="logo-text"></div>
<div id="back"></div>
<div id="mapName" class="buttonContainer">
<span>Welcome</span>
</div>
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn">
@ -82,9 +85,8 @@
</div>
</div>
<div id="headerNotifier"></div>
<div id="footer">
<div id="footerLogo"></div>
</div>
</div>
<div id="bottom-logo">
</div>
<div id="mindplot" onselectstart="return false;"></div>

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M11.67 3.87L9.9 2.1 0 12l9.9 9.9 1.77-1.77L3.54 12z"/></svg>

After

Width:  |  Height:  |  Size: 189 B