From 588fe48bd1ba25d3453294bc48ffe689a9495b06 Mon Sep 17 00:00:00 2001 From: Zakhar Kozlov Date: Sun, 14 Jul 2024 13:32:44 +0200 Subject: [PATCH] calculate icon position in the currently used container --- src/css/editor-css.js | 23 ++++++++++++++++------- 1 file changed, 16 insertions(+), 7 deletions(-) diff --git a/src/css/editor-css.js b/src/css/editor-css.js index 77f8df524fe..4cd408918d4 100644 --- a/src/css/editor-css.js +++ b/src/css/editor-css.js @@ -93,6 +93,11 @@ module.exports = ` contain: style size layout; } +.ace_gutter { + --line-height-value: 1.2; + --icon-height: 16px; +} + .ace_gutter-active-line { position: absolute; left: 0; @@ -118,6 +123,7 @@ module.exports = ` padding-left: 19px; padding-right: 6px; background-repeat: no-repeat; + line-height: var(--line-height-value, 1.2); } .ace_gutter-cell_svg-icons .ace_gutter_annotation { @@ -130,24 +136,27 @@ module.exports = ` float: left; } -.ace_gutter-cell.ace_error .ace_icon, .ace_icon.ace_error, .ace_icon.ace_error_fold { +.ace_gutter-cell.ace_error, .ace_icon.ace_error, .ace_icon.ace_error_fold { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAABOFBMVEX/////////QRswFAb/Ui4wFAYwFAYwFAaWGAfDRymzOSH/PxswFAb/SiUwFAYwFAbUPRvjQiDllog5HhHdRybsTi3/Tyv9Tir+Syj/UC3////XurebMBIwFAb/RSHbPx/gUzfdwL3kzMivKBAwFAbbvbnhPx66NhowFAYwFAaZJg8wFAaxKBDZurf/RB6mMxb/SCMwFAYwFAbxQB3+RB4wFAb/Qhy4Oh+4QifbNRcwFAYwFAYwFAb/QRzdNhgwFAYwFAbav7v/Uy7oaE68MBK5LxLewr/r2NXewLswFAaxJw4wFAbkPRy2PyYwFAaxKhLm1tMwFAazPiQwFAaUGAb/QBrfOx3bvrv/VC/maE4wFAbRPBq6MRO8Qynew8Dp2tjfwb0wFAbx6eju5+by6uns4uH9/f36+vr/GkHjAAAAYnRSTlMAGt+64rnWu/bo8eAA4InH3+DwoN7j4eLi4xP99Nfg4+b+/u9B/eDs1MD1mO7+4PHg2MXa347g7vDizMLN4eG+Pv7i5evs/v79yu7S3/DV7/498Yv24eH+4ufQ3Ozu/v7+y13sRqwAAADLSURBVHjaZc/XDsFgGIBhtDrshlitmk2IrbHFqL2pvXf/+78DPokj7+Fz9qpU/9UXJIlhmPaTaQ6QPaz0mm+5gwkgovcV6GZzd5JtCQwgsxoHOvJO15kleRLAnMgHFIESUEPmawB9ngmelTtipwwfASilxOLyiV5UVUyVAfbG0cCPHig+GBkzAENHS0AstVF6bacZIOzgLmxsHbt2OecNgJC83JERmePUYq8ARGkJx6XtFsdddBQgZE2nPR6CICZhawjA4Fb/chv+399kfR+MMMDGOQAAAABJRU5ErkJggg=="); background-repeat: no-repeat; - background-position: 2px center; + background-position: 2px calc((1em * var(--line-height-value, 1.2) / 2 - var(--icon-height, 16px) / 2)); + background-size: var(--icon-height, 16px); } -.ace_gutter-cell.ace_warning .ace_icon, .ace_icon.ace_warning, .ace_icon.ace_warning_fold { +.ace_gutter-cell.ace_warning, .ace_icon.ace_warning, .ace_icon.ace_warning_fold { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAmVBMVEX///8AAAD///8AAAAAAABPSzb/5sAAAAB/blH/73z/ulkAAAAAAAD85pkAAAAAAAACAgP/vGz/rkDerGbGrV7/pkQICAf////e0IsAAAD/oED/qTvhrnUAAAD/yHD/njcAAADuv2r/nz//oTj/p064oGf/zHAAAAA9Nir/tFIAAAD/tlTiuWf/tkIAAACynXEAAAAAAAAtIRW7zBpBAAAAM3RSTlMAABR1m7RXO8Ln31Z36zT+neXe5OzooRDfn+TZ4p3h2hTf4t3k3ucyrN1K5+Xaks52Sfs9CXgrAAAAjklEQVR42o3PbQ+CIBQFYEwboPhSYgoYunIqqLn6/z8uYdH8Vmdnu9vz4WwXgN/xTPRD2+sgOcZjsge/whXZgUaYYvT8QnuJaUrjrHUQreGczuEafQCO/SJTufTbroWsPgsllVhq3wJEk2jUSzX3CUEDJC84707djRc5MTAQxoLgupWRwW6UB5fS++NV8AbOZgnsC7BpEAAAAABJRU5ErkJggg=="); background-repeat: no-repeat; - background-position: 2px center; + background-position: 2px calc((1em * var(--line-height-value, 1.2) / 2 - var(--icon-height, 16px) / 2)); + background-size: var(--icon-height, 16px); } -.ace_gutter-cell.ace_info .ace_icon, .ace_icon.ace_info { +.ace_gutter-cell.ace_info, .ace_icon.ace_info { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAAAAAA6mKC9AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAJ0Uk5TAAB2k804AAAAPklEQVQY02NgIB68QuO3tiLznjAwpKTgNyDbMegwisCHZUETUZV0ZqOquBpXj2rtnpSJT1AEnnRmL2OgGgAAIKkRQap2htgAAAAASUVORK5CYII="); background-repeat: no-repeat; - background-position: 2px center; + background-position: 2px calc((1em * var(--line-height-value, 1.2) / 2 - var(--icon-height, 16px) / 2)); + background-size: var(--icon-height, 16px); } -.ace_dark .ace_gutter-cell.ace_info .ace_icon, .ace_dark .ace_icon.ace_info { +.ace_dark .ace_gutter-cell.ace_info, .ace_dark .ace_icon.ace_info { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAJFBMVEUAAAChoaGAgIAqKiq+vr6tra1ZWVmUlJSbm5s8PDxubm56enrdgzg3AAAAAXRSTlMAQObYZgAAAClJREFUeNpjYMAPdsMYHegyJZFQBlsUlMFVCWUYKkAZMxZAGdxlDMQBAG+TBP4B6RyJAAAAAElFTkSuQmCC"); }