mirror of
				https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
				synced 2025-11-03 20:02:47 +00:00 
			
		
		
		
	better tooltips
This commit is contained in:
		@@ -6,6 +6,28 @@
 | 
			
		||||
    background-color: #9e9e9e;
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
  }
 | 
			
		||||
  .material-tooltip {
 | 
			
		||||
      padding: 5px 20px 20px;
 | 
			
		||||
      border-radius: 10px;
 | 
			
		||||
      background: rgba(37, 36, 36);
 | 
			
		||||
      overflow: visible;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .material-tooltip .backdrop {
 | 
			
		||||
      display: none !important;
 | 
			
		||||
  }
 | 
			
		||||
  .material-tooltip:after {
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    content: "";
 | 
			
		||||
    top: 100%;
 | 
			
		||||
    left: 50%;
 | 
			
		||||
    margin-left: -8px;
 | 
			
		||||
    width: 0;
 | 
			
		||||
    height: 0;
 | 
			
		||||
    border-style: solid;
 | 
			
		||||
    border-width: 15px 13px 0 13px;
 | 
			
		||||
    border-color: rgba(37, 36, 36) transparent transparent transparent;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
<div class="col s12 m3 sticky">
 | 
			
		||||
@@ -239,15 +261,29 @@
 | 
			
		||||
 | 
			
		||||
  function addToolTipToTokenElement(tokenElement, token) {
 | 
			
		||||
    M.Tooltip.init(tokenElement,
 | 
			
		||||
                   {"html": `<p>Token information</p>
 | 
			
		||||
                             <p class="left-align">
 | 
			
		||||
                               word: ${token["word"]}<br>
 | 
			
		||||
                               lemma: ${token["lemma"]}<br>
 | 
			
		||||
                               pos: ${token["pos"]}<br>
 | 
			
		||||
                               simple_pos: ${token["simple_pos"]}<br>
 | 
			
		||||
                               text: ${result["text_loopup"][token["text_id"]]["title"]}
 | 
			
		||||
                             </p>`,
 | 
			
		||||
                   "position": "top"});
 | 
			
		||||
                   {"html": `<table>
 | 
			
		||||
                               <tr>
 | 
			
		||||
                                 <th>Token information</th>
 | 
			
		||||
                                 <th>Source information</th>
 | 
			
		||||
                               </tr>
 | 
			
		||||
                               <tr>
 | 
			
		||||
                                 <td class="left-align">
 | 
			
		||||
                                   word: ${token["word"]}<br>
 | 
			
		||||
                                   lemma: ${token["lemma"]}<br>
 | 
			
		||||
                                   pos: ${token["pos"]}<br>
 | 
			
		||||
                                   simple_pos: ${token["simple_pos"]}
 | 
			
		||||
                                 </td>
 | 
			
		||||
                                 <td class="left-align">
 | 
			
		||||
                                   Title: ${result["text_loopup"][token["text_id"]]["title"]}<br>
 | 
			
		||||
                                   Author: ${result["text_loopup"][token["text_id"]]["title"]}<br>
 | 
			
		||||
                                   Publishing year: ${result["text_loopup"][token["text_id"]]["publishing_year"]}
 | 
			
		||||
                                 </td>
 | 
			
		||||
                               </tr>
 | 
			
		||||
                             </table>`,
 | 
			
		||||
                   "inDuration": 2500,
 | 
			
		||||
                   "margin": 15,
 | 
			
		||||
                   "position": "top",
 | 
			
		||||
                   "transitionMovement": 0});
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user