CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-11 02:47:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use flex to compute measure font metrics (#3714)

Browse Source 
* Use flexbox to compute font dimensions instead of inline-block
This commit is contained in:
Sam El-Husseini
2020-02-24 17:36:01 -08:00
committed by GitHub
parent 4432ca2e93
commit 60db399a8d
1 changed files with 6 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
core/utils/dom.js
View File

@@ -347,25 +347,24 @@ Blockly.utils.dom.measureFontMetrics = function(text, fontSize, fontWeight,
fontFamily) {
var span = document.createElement('span');
span.setAttribute('style', 'display: inline-block;');
span.style.font = fontWeight + ' ' + fontSize + ' ' + fontFamily;
span.textContent = text;
var block = document.createElement('div');
block.setAttribute('style',
'display: inline-block; width: 1px; height: 0px;');
block.style.width = '1px';
block.style.height = '0px';
var div = document.createElement('div');
div.setAttribute('style', 'line-height: 0;');
div.setAttribute('style', 'position: fixed; top: 0; left: 0; display: flex;');
div.appendChild(span);
div.appendChild(block);
document.body.appendChild(div);
try {
var result = {};
block.style.verticalAlign = 'baseline';
div.style.alignItems = 'baseline';
result.baseline = block.offsetTop - span.offsetTop;
block.style.verticalAlign = 'bottom';
div.style.alignItems = 'flex-end';
result.height = block.offsetTop - span.offsetTop;
} finally {
document.body.removeChild(div);