Add tooltip to menu.

This commit is contained in:
Paulo Gustavo Veiga
2012-03-19 23:29:52 -03:00
parent c6acc88fd7
commit ce53e8e726
12 changed files with 238 additions and 121 deletions

View File

@@ -51,6 +51,14 @@ div#small_error_icon {
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
}
.keyboardShortcutTip {
background-color: black;
padding: 5px 15px;
color: white;
font-weight: bold;
font-size: 11px;
}
/* */
.btn-primary {
cursor: pointer;

View File

@@ -120,75 +120,75 @@
<div id="toolbar">
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn" title="Save">
<div id="save" class="buttonOn">
<img src="images/save.png"/>
</div>
<div id="discard" class="buttonOn" title="Discard">
<div id="discard" class="buttonOn">
<img src="images/discard.png"/>
</div>
<div id="export" class="buttonOn" title="Export">
<div id="export" class="buttonOn">
<img src="images/export.png"/>
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn" title="Undo Edition">
<div id="undoEdition" class="buttonOn">
<img src="images/undo.png"/>
</div>
<div id="redoEdition" class="buttonOn" title="Redo Edition">
<div id="redoEdition" class="buttonOn">
<img src="images/redo.png"/>
</div>
</div>
<div id="zoom" class="buttonContainer">
<div id="zoomIn" class="buttonOn" title="Zoom In">
<div id="zoomIn" class="buttonOn">
<img src="images/zoom-in.png"/>
</div>
<div id="zoomOut" class="buttonOn" title="Zoom Out">
<div id="zoomOut" class="buttonOn">
<img src="images/zoom-out.png"/>
</div>
</div>
<div id="node" class="buttonContainer">
<div id="topicShape" class="buttonExtOn" title="Topic Shape">
<div id="topicShape" class="buttonExtOn">
<img src="images/topic-shape.png"/>
</div>
<div id="addTopic" class="buttonOn" title="Add Topic">
<div id="addTopic" class="buttonOn">
<img src="images/topic-add.png"/>
</div>
<div id="deleteTopic" class="buttonOn" title="Delete">
<div id="deleteTopic" class="buttonOn">
<img src="images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonExtOn" title="Border Color">
<div id="topicBorder" class="buttonExtOn">
<img src="images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
<div id="topicColor" class="buttonExtOn">
<img src="images/topic-color.png"/>
</div>
<div id="topicIcon" class="buttonExtOn" title="Add Icon">
<div id="topicIcon" class="buttonExtOn">
<img src="images/topic-icon.png"/>
</div>
<div id="topicNote" class="buttonOn" title="Add Note">
<div id="topicNote" class="buttonOn">
<img src="images/topic-note.png"/>
</div>
<div id="topicLink" class="buttonOn" title="Add Link">
<div id="topicLink" class="buttonOn">
<img src="images/topic-link.png"/>
</div>
<div id="topicRelation" class="buttonOn" title="Add Relationship">
<div id="topicRelation" class="buttonOn">
<img src="images/topic-relation.png"/>
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonExtOn" title="Font Style">
<div id="fontFamily" class="buttonExtOn">
<img src="images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">
<div id="fontSize" class="buttonExtOn">
<img src="images/font-size.png"/>
</div>
<div id="fontBold" class="buttonOn" title="Bold Style">
<div id="fontBold" class="buttonOn">
<img src="images/font-bold.png"/>
</div>
<div id="fontItalic" class="buttonOn" title="Italic Style">
<div id="fontItalic" class="buttonOn">
<img src="images/font-italic.png"/>
</div>
<div id="fontColor" class="buttonExtOn" title="Font Color" style="padding-top:4px">
<div id="fontColor" class="buttonExtOn" style="padding-top:4px">
<img src="images/font-color.png"/>
</div>
</div>

View File

@@ -47,75 +47,75 @@
<div id="toolbar">
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn" title="Save">
<div id="save" class="buttonOn">
<img src="images/save.png"/>
</div>
<div id="discard" class="buttonOn" title="Discard">
<div id="discard" class="buttonOn">
<img src="images/discard.png"/>
</div>
<div id="export" class="buttonOn" title="Export">
<div id="export" class="buttonOn">
<img src="images/export.png"/>
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn" title="Undo Edition">
<div id="undoEdition" class="buttonOn">
<img src="images/undo.png"/>
</div>
<div id="redoEdition" class="buttonOn" title="Redo Edition">
<div id="redoEdition" class="buttonOn">
<img src="images/redo.png"/>
</div>
</div>
<div id="zoom" class="buttonContainer">
<div id="zoomIn" class="buttonOn" title="Zoom In">
<div id="zoomIn" class="buttonOn">
<img src="images/zoom-in.png"/>
</div>
<div id="zoomOut" class="buttonOn" title="Zoom Out">
<div id="zoomOut" class="buttonOn">
<img src="images/zoom-out.png"/>
</div>
</div>
<div id="node" class="buttonContainer">
<div id="topicShape" class="buttonExtOn" title="Topic Shape">
<div id="topicShape" class="buttonExtOn">
<img src="images/topic-shape.png"/>
</div>
<div id="addTopic" class="buttonOn" title="Add Topic">
<div id="addTopic" class="buttonOn">
<img src="images/topic-add.png"/>
</div>
<div id="deleteTopic" class="buttonOn" title="Delete">
<div id="deleteTopic" class="buttonOn">
<img src="images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonExtOn" title="Border Color">
<div id="topicBorder" class="buttonExtOn">
<img src="images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
<div id="topicColor" class="buttonExtOn">
<img src="images/topic-color.png"/>
</div>
<div id="topicIcon" class="buttonExtOn" title="Add Icon">
<div id="topicIcon" class="buttonExtOn">
<img src="images/topic-icon.png"/>
</div>
<div id="topicNote" class="buttonOn" title="Add Note">
<div id="topicNote" class="buttonOn">
<img src="images/topic-note.png"/>
</div>
<div id="topicLink" class="buttonOn" title="Add Link">
<div id="topicLink" class="buttonOn">
<img src="images/topic-link.png"/>
</div>
<div id="topicRelation" class="buttonOn" title="Add Relationship">
<div id="topicRelation" class="buttonOn">
<img src="images/topic-relation.png"/>
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonExtOn" title="Font Style">
<div id="fontFamily" class="buttonExtOn">
<img src="images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">
<div id="fontSize" class="buttonExtOn">
<img src="images/font-size.png"/>
</div>
<div id="fontBold" class="buttonOn" title="Bold Style">
<div id="fontBold" class="buttonOn">
<img src="images/font-bold.png"/>
</div>
<div id="fontItalic" class="buttonOn" title="Italic Style">
<div id="fontItalic" class="buttonOn">
<img src="images/font-italic.png"/>
</div>
<div id="fontColor" class="buttonExtOn" title="Font Color" style="padding-top:4px">
<div id="fontColor" class="buttonExtOn" style="padding-top:4px">
<img src="images/font-color.png"/>
</div>
</div>

View File

@@ -57,72 +57,72 @@
<div id="toolbar">
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn" title="Save">
<div id="save" class="buttonOn">
<img src="images/save.png"/>
</div>
<div id="discard" class="buttonOn" title="Discard">
<div id="discard" class="buttonOn">
<img src="images/discard.png"/>
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn" title="Undo Edition">
<div id="undoEdition" class="buttonOn">
<img src="images/undo.png"/>
</div>
<div id="redoEdition" class="buttonOn" title="Redo Edition">
<div id="redoEdition" class="buttonOn">
<img src="images/redo.png"/>
</div>
</div>
<div id="zoom" class="buttonContainer">
<div id="zoomIn" class="buttonOn" title="Zoom In">
<div id="zoomIn" class="buttonOn">
<img src="images/zoom-in.png"/>
</div>
<div id="zoomOut" class="buttonOn" title="Zoom Out">
<div id="zoomOut" class="buttonOn">
<img src="images/zoom-out.png"/>
</div>
</div>
<div id="node" class="buttonContainer">
<div id="topicShape" class="buttonExtOn" title="Topic Shape">
<div id="topicShape" class="buttonExtOn">
<img src="images/topic-shape.png"/>
</div>
<div id="addTopic" class="buttonOn" title="Add Topic">
<div id="addTopic" class="buttonOn">
<img src="images/topic-add.png"/>
</div>
<div id="deleteTopic" class="buttonOn" title="Delete">
<div id="deleteTopic" class="buttonOn">
<img src="images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonOn" title="Border Color">
<div id="topicBorder" class="buttonOn">
<img src="images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
<div id="topicColor" class="buttonExtOn">
<img src="images/topic-color.png"/>
</div>
<div id="topicIcon" class="buttonExtOn" title="Add Icon">
<div id="topicIcon" class="buttonExtOn">
<img src="images/topic-icon.png"/>
</div>
<div id="topicNote" class="buttonOn" title="Add Note">
<div id="topicNote" class="buttonOn">
<img src="images/topic-note.png"/>
</div>
<div id="topicLink" class="buttonOn" title="Add Link">
<div id="topicLink" class="buttonOn">
<img src="images/topic-link.png"/>
</div>
<div id="topicRelation" class="buttonOn" title="Add Relationship">
<div id="topicRelation" class="buttonOn">
<img src="images/topic-relation.png"/>
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonOn" title="Font Style">
<div id="fontFamily" class="buttonOn">
<img src="images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">
<div id="fontSize" class="buttonExtOn">
<img src="images/font-size.png"/>
</div>
<div id="fontBold" class="buttonOn" title="Bold Style">
<div id="fontBold" class="buttonOn">
<img src="images/font-bold.png"/>
</div>
<div id="fontItalic" class="buttonOn" title="Italic Style">
<div id="fontItalic" class="buttonOn">
<img src="images/font-italic.png"/>
</div>
<div id="fontColor" class="buttonExtOn" title="Fond Color" style="padding-top:4px">
<div id="fontColor" class="buttonExtOn" style="padding-top:4px">
<img src="images/font-color.png"/>
</div>