Add share and account actions

This commit is contained in:
Paulo Gustavo Veiga 2022-01-06 18:41:21 -08:00
parent 672013aa34
commit 0b025be797
20 changed files with 78 additions and 49 deletions

View File

@ -35,7 +35,6 @@ class ToolbarNotifier {
this.container.data('transitioning', true);
this.container.text(msg);
this.container.css({
top: '5px',
left: ($(window).width() - this.container.width()) / 2 - 9,
});
this.container.show().fadeOut(5000);

View File

@ -120,16 +120,6 @@ div.shareModalDialog {
width: 550px;
}
#tutorialVideo {
background: url(../images/help.png) no-repeat left center;
padding-left: 19px;
}
#keyboardShortcuts {
background: url(../images/help.png) no-repeat left center;
padding-left: 19px;
}
.panelIcon {
width: 20px;
height: 20px;
@ -187,3 +177,10 @@ div#bottom-logo {
#zoom-minus {
border-radius: 0 0 8px 8px;
}
div#shotcuts > img{
margin: 20px 0;
width: 40px;
height: 40px;
}

View File

@ -20,42 +20,63 @@ div#headerActions a {
text-decoration: none;
}
div#headerMapTitle {
min-width: 200px;
height: @header-info-height - 13;
text-align: left;
padding-top: 13px;
padding-left: 50px;
color: white;
float: left;
font-style: italic;
}
div#headerMapTitle span {
padding: 4px 50px;
border: 1px solid rgb(90, 90, 90);
background-color: rgb(45, 45, 45);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
white-space: nowrap;
}
div#headerNotifier {
border: 1px solid rgb(241, 163, 39);
background-color: rgb(252, 235, 192);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
position: absolute;
position: fixed;
padding: 5px 9px;
color: back;
white-space: nowrap;
margin-top: 5px;
/*margin-top:-34px;*/
display: none;
/*right: 5px;*/
bottom: 10px;
display: inline;
}
div#toolbarRight {
float: right;
white-space: nowrap;
vertical-align: middle;
justify-content: center;
margin: 6px 10px;
height: 100%;
}
#account {
float: right;
display: inline;
}
#account >img {
width: 36x;
height: 36px;
}
#share {
margin: 0 30px;
}
.actionButton {
cursor: pointer;
margin: 0px 10px;
font-family: Arial, Helvetica, sans-serif;
user-select: none;
vertical-align: middle;
justify-content: center;
padding: 10px 34px 10px 34px;
font-size: 15px;
min-width: 64px;
box-sizing: border-box;
font-weight: 600;
border-radius: 9px;
color: white;
float: right;
background-color: #ffa800;
}
.actionButton:hover {
transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}
@import "toolbar.less";

View File

@ -24,9 +24,6 @@
<div id="discard" class="buttonOn">
<img src="images/discard.svg" />
</div>
<div id="export" class="buttonOn">
<img src="images/export.svg" />
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn">
@ -83,21 +80,37 @@
</div>
</div>
</div>
<div id="toolbarRight">
<div id="account">
<img src="images/account.svg"/>
</div>
<div id="share" class="actionButton">Share</div>
<div id="export" class="buttonOn">
<img src="images/export.svg" />
</div>
</div>
</div>
<div id="headerNotifier"></div>
</div>
<div id="mindplot" onselectstart="return false;"></div>
<!-- Side Actions -->
<div id="floating-panel">
<div id="shotcuts" class="buttonExtOn">
<img src="images/keyboard.svg"/>
</div>
<div id="zoom-button">
<button id="zoom-plus">
<img src="images/add-icon.svg" />
<img src="images/add.svg" />
</button>
<button id="zoom-minus">
<img src="images/minus-icon.svg" />
<img src="images/minus.svg" />
</button>
</div>
</div>
<div id="bottom-logo"></div>
<div id="headerNotifier"></div>
</body>
</html>

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" style="color: black;">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"></path>
</svg>

After

Width:  |  Height:  |  Size: 382 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 571 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 553 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

Before

Width:  |  Height:  |  Size: 391 B

After

Width:  |  Height:  |  Size: 391 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/><path d="M12 10h-2v2H9v-2H7V9h2V7h1v2h2v1z"/></svg>

Before

Width:  |  Height:  |  Size: 438 B

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14zM7 9h5v1H7z"/></svg>

Before

Width:  |  Height:  |  Size: 404 B

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/><path d="M12 10h-2v2H9v-2H7V9h2V7h1v2h2v1z"/></svg>

Before

Width:  |  Height:  |  Size: 438 B

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14zM7 9h5v1H7z"/></svg>

Before

Width:  |  Height:  |  Size: 404 B