Popup overflow (#302)
This commit is contained in:
		
							parent
							
								
									ad692d4f61
								
							
						
					
					
						commit
						dc126e1b58
					
				| 
						 | 
					@ -176,9 +176,9 @@
 | 
				
			||||||
    </div>
 | 
					    </div>
 | 
				
			||||||
  </div>
 | 
					  </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  <aside id="hotkey-info" i18n-title="popupHotkeysTooltip"></aside>
 | 
					  <div id="installed">
 | 
				
			||||||
 | 
					    <aside id="hotkey-info" i18n-title="popupHotkeysTooltip"></aside>
 | 
				
			||||||
  <div id="installed"></div>
 | 
					  </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  <div class="actions">
 | 
					  <div class="actions">
 | 
				
			||||||
    <div id="disable-all-wrapper">
 | 
					    <div id="disable-all-wrapper">
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -160,10 +160,9 @@ var hotkeys = (() => {
 | 
				
			||||||
      if (!container.firstElementChild) {
 | 
					      if (!container.firstElementChild) {
 | 
				
			||||||
        buildElement();
 | 
					        buildElement();
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      const height = 4 +
 | 
					      const height = 3 +
 | 
				
			||||||
        container.firstElementChild.scrollHeight +
 | 
					        container.firstElementChild.scrollHeight +
 | 
				
			||||||
        container.lastElementChild.scrollHeight +
 | 
					        container.lastElementChild.scrollHeight;
 | 
				
			||||||
        parseFloat(getComputedStyle(container.lastElementChild).paddingBottom);
 | 
					 | 
				
			||||||
      if (height > document.body.clientHeight) {
 | 
					      if (height > document.body.clientHeight) {
 | 
				
			||||||
        document.body.style.height = height + 'px';
 | 
					        document.body.style.height = height + 'px';
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
| 
						 | 
					@ -203,19 +202,5 @@ var hotkeys = (() => {
 | 
				
			||||||
      debounce(adjustInfoPosition, 100, true);
 | 
					      debounce(adjustInfoPosition, 100, true);
 | 
				
			||||||
      return;
 | 
					      return;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
    const style = $('#hotkey-info').style;
 | 
					 | 
				
			||||||
    const scroller = document.scrollingElement;
 | 
					 | 
				
			||||||
    if (installed.scrollHeight > installed.clientHeight ||
 | 
					 | 
				
			||||||
        scroller.scrollHeight > scroller.innerHeight) {
 | 
					 | 
				
			||||||
      const entryRight = installed.firstElementChild.getBoundingClientRect().right;
 | 
					 | 
				
			||||||
      const right = window.innerWidth - entryRight;
 | 
					 | 
				
			||||||
      if (parseFloat(style.right) !== right) {
 | 
					 | 
				
			||||||
        style.setProperty('right', right + 'px', 'important');
 | 
					 | 
				
			||||||
      }
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
    const bottom = installed.getBoundingClientRect().bottom + window.scrollY;
 | 
					 | 
				
			||||||
    if (parseFloat(style.height) !== bottom) {
 | 
					 | 
				
			||||||
      style.setProperty('height', bottom + 'px', 'important');
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
})();
 | 
					})();
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -9,6 +9,7 @@
 | 
				
			||||||
 | 
					
 | 
				
			||||||
html, body {
 | 
					html, body {
 | 
				
			||||||
  height: min-content;
 | 
					  height: min-content;
 | 
				
			||||||
 | 
					  max-height: 600px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
body {
 | 
					body {
 | 
				
			||||||
| 
						 | 
					@ -144,6 +145,7 @@ body.blocked > DIV {
 | 
				
			||||||
  max-height: 445px;
 | 
					  max-height: 445px;
 | 
				
			||||||
  overflow-y: auto;
 | 
					  overflow-y: auto;
 | 
				
			||||||
  counter-reset: style-number;
 | 
					  counter-reset: style-number;
 | 
				
			||||||
 | 
					  position: relative;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
#installed.disabled .style-name {
 | 
					#installed.disabled .style-name {
 | 
				
			||||||
| 
						 | 
					@ -555,7 +557,9 @@ body.blocked .actions > .main-controls {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
#hotkey-info[data-active] {
 | 
					#hotkey-info[data-active] {
 | 
				
			||||||
 | 
					  position: fixed;
 | 
				
			||||||
  left: 6ex;
 | 
					  left: 6ex;
 | 
				
			||||||
 | 
					  bottom: unset;
 | 
				
			||||||
  width: auto;
 | 
					  width: auto;
 | 
				
			||||||
  cursor: auto;
 | 
					  cursor: auto;
 | 
				
			||||||
  display: flex;
 | 
					  display: flex;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue
	
	Block a user