[website] Fix jump on the header
Algolia adds two inline styles ```css position: relative; vertical-align: top; ``` to the element once the script inserted at the end of the page runs which super slightly moves the header. The fix is to always apply those two rules this way it doesn't jump. I did not notice it on my machine because it doesn't move when custom fonts are not being used. Test Plan: - Open two tabs: reactjs.com and localhost:4000/react - Click around on reactjs.com to prime the cache with the fonts - Switch tabs and click around on localhost (but do not force refresh!) - Now you get custom fonts loaded locally and it doesn't jump when you change tabs
Christopher Chedeau committed
Mar 21, 2016 at 14:12 UTC
fe617082d9da0e162e1e79b58617b6326da3d03e
1 file changed
+2
docs/css/react.scss
+2
@@ -870,6 +870,8 @@ input#algolia-doc-search {
870
background: transparent url('/react/img/search.png') no-repeat 10px center;
871
background-size: 16px 16px;
872
873
+ position: relative;
874
+ vertical-align: top;
875
margin-left: 10px;
876
padding: 0 10px;
877
padding-left: 35px;