honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(aio): prevent heading misplacement while styles load (#21695) 

During the initial load of the page (probably until the icon styles are
loaded and/or applied), the `.header-link` element is wider, pushing the
heading text slightly to the right (for a brief moment).

This commit prevents this slight shift by explicitly setting the width
for the `.header-link` element.

PR Close #21695
This commit is contained in:
George Kalpakas 2018-01-16 13:20:09 +02:00 committed by Miško Hevery
parent eb3bfc25be
commit e3e7044d06
1 changed files with 2 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
aio/src/styles/2-modules/_heading-anchors.scss
View File

@ -6,6 +6,7 @@
} }
.header-link { .header-link {
box-sizing: border-box;
color: $mediumgray; color: $mediumgray;
display: inline-block; display: inline-block;
margin-left: -42px; margin-left: -42px;
@ -13,6 +14,7 @@
text-decoration: none; text-decoration: none;
vertical-align: middle; vertical-align: middle;
visibility: hidden; visibility: hidden;
width: 40px;
@media (max-width: 600px) { @media (max-width: 600px) {
float: right; float: right;