Skip to content

Commit fd91d0f

Browse files
committed
Editor: Fix text zoom on link popup editor.
Update CSS in the classic visual editor link popup to remove sizing in pixels that caused significant text overlaps when the base font size is scaled or set to a larger custom value in the browser or operating system. Props jonny-s, sabernhardt, joedolson. Fixes #53174. git-svn-id: https://develop.svn.wordpress.org/trunk@54216 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 56bde67 commit fd91d0f

File tree

1 file changed

+14
-39
lines changed

1 file changed

+14
-39
lines changed

src/wp-includes/css/editor.css

Lines changed: 14 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1392,7 +1392,7 @@ i.mce-i-wp_code:before {
13921392
}
13931393

13941394
#wp-link-wrap {
1395-
height: 500px;
1395+
height: 600px;
13961396
margin-top: -250px;
13971397
}
13981398

@@ -1407,7 +1407,6 @@ i.mce-i-wp_code:before {
14071407
#link-modal-title {
14081408
background: #fff;
14091409
border-bottom: 1px solid #dcdcde;
1410-
height: 36px;
14111410
font-size: 18px;
14121411
font-weight: 600;
14131412
line-height: 2;
@@ -1459,10 +1458,13 @@ i.mce-i-wp_code:before {
14591458
-webkit-overflow-scrolling: touch;
14601459
padding: 0 16px;
14611460
position: absolute;
1462-
top: 37px;
1461+
top: calc(2.15384615em + 16px);
14631462
left: 0;
14641463
right: 0;
1465-
bottom: 44px;
1464+
bottom: calc(2.15384615em + 19px);
1465+
display: flex;
1466+
flex-direction: column;
1467+
overflow: auto;
14661468
}
14671469

14681470
#wp-link ol,
@@ -1497,7 +1499,7 @@ i.mce-i-wp_code:before {
14971499
#wp-link #link-options label span,
14981500
#wp-link #search-panel label span.search-label {
14991501
display: inline-block;
1500-
width: 80px;
1502+
width: 120px;
15011503
text-align: right;
15021504
padding-right: 5px;
15031505
max-width: 24%;
@@ -1513,7 +1515,11 @@ i.mce-i-wp_code:before {
15131515
#wp-link .link-search-wrapper {
15141516
margin: 5px 0 9px;
15151517
display: block;
1516-
overflow: hidden;
1518+
}
1519+
1520+
#wp-link .query-results {
1521+
position: absolute;
1522+
width: calc(100% - 32px);
15171523
}
15181524

15191525
#wp-link .link-search-wrapper .spinner {
@@ -1523,9 +1529,6 @@ i.mce-i-wp_code:before {
15231529

15241530
#wp-link .link-target {
15251531
padding: 3px 0 0;
1526-
white-space: nowrap;
1527-
overflow: hidden;
1528-
text-overflow: ellipsis;
15291532
}
15301533

15311534
#wp-link .link-target label {
@@ -1537,15 +1540,7 @@ i.mce-i-wp_code:before {
15371540
margin: 0 0 12px;
15381541
background: #fff;
15391542
overflow: auto;
1540-
position: absolute;
1541-
left: 16px;
1542-
right: 16px;
1543-
bottom: 0;
1544-
top: 166px;
1545-
}
1546-
1547-
.has-text-field #wp-link .query-results {
1548-
top: 210px;
1543+
max-height: 290px;
15491544
}
15501545

15511546
#wp-link li {
@@ -1662,24 +1657,12 @@ i.mce-i-wp_code:before {
16621657
}
16631658

16641659
@media screen and (max-width: 782px) {
1665-
#wp-link-wrap {
1666-
margin-top: -140px;
1667-
}
1668-
1669-
#wp-link-wrap .query-results {
1670-
top: 195px;
1671-
}
1672-
1673-
#wp-link-wrap.has-text-field .query-results {
1674-
top: 235px;
1675-
}
1676-
16771660
#link-selector {
16781661
padding: 0 16px 60px;
16791662
}
16801663

16811664
#wp-link-wrap #link-selector {
1682-
bottom: 52px;
1665+
bottom: calc(2.71428571em + 23px);
16831666
}
16841667

16851668
#wp-link-cancel {
@@ -1717,10 +1700,6 @@ i.mce-i-wp_code:before {
17171700
#link-selector {
17181701
overflow: auto;
17191702
}
1720-
1721-
#search-panel .query-results {
1722-
position: static;
1723-
}
17241703
}
17251704

17261705
@media screen and (max-height: 290px) {
@@ -1736,10 +1715,6 @@ i.mce-i-wp_code:before {
17361715
height: calc(100% - 92px);
17371716
padding-bottom: 2px;
17381717
}
1739-
1740-
#search-panel .query-results {
1741-
position: static;
1742-
}
17431718
}
17441719

17451720
div.wp-link-preview {

0 commit comments

Comments
 (0)