Bug 765411 - Performance improvements for about:home. r=dao

This commit is contained in:
Jared Wein 2012-07-05 13:04:31 -07:00
parent 5a0baf7633
commit 4915d5ae38
3 changed files with 29 additions and 7 deletions

View File

@ -43,6 +43,7 @@ a {
#brandLogo {
height: 154px;
width: 154px;
margin: 22px 0 31px;
}
@ -64,6 +65,8 @@ a {
#searchEngineLogo {
display: inline-block;
height: 28px;
width: 70px;
}
#searchText {
@ -82,7 +85,8 @@ body[dir=rtl] #searchText {
border-radius: 0 2.5px 2.5px 0;
}
#searchText:focus {
#searchText:focus,
#searchText[autofocus] {
border-color: hsla(206,100%,60%,.6) hsla(206,76%,52%,.6) hsla(204,100%,40%,.6);
}
@ -106,12 +110,14 @@ body[dir=rtl] #searchSubmit {
}
#searchText:focus + #searchSubmit,
#searchText + #searchSubmit:hover {
#searchText + #searchSubmit:hover,
#searchText[autofocus] + #searchSubmit {
border-color: #59b5fc #45a3e7 #3294d5;
color: white;
}
#searchText:focus + #searchSubmit {
#searchText:focus + #searchSubmit,
#searchText[autofocus] + #searchSubmit {
background-image: -moz-linear-gradient(#4cb1ff, #1793e5);
box-shadow: 0 1px 0 hsla(0,0%,100%,.2) inset,
0 0 0 1px hsla(0,0%,100%,.1) inset,
@ -160,6 +166,12 @@ body[dir=rtl] #defaultSnippet2 {
margin: 12px 0;
color: #3c3c3c;
font-size: 75%;
/* 17px is approx. the default line-height as measured on Windows 7 Segoe UI.
12px is 75% of approx. the default font-size as measured on Windows 7 Segoe UI.
The 17/12 is here to convert em from units of font-size to units of
line-height. The goal here is to initialize at the height of a
three-line snippet to reduce visual moving/flickering. */
min-height: -moz-calc(17/12 * 3em);
}
#launcher {
@ -256,8 +268,9 @@ body[narrow] #restorePreviousSession {
.launchButton::before {
display: block;
width: 32px;
height: 32px;
margin-bottom: 6px;
margin: 0 auto 6px;
line-height: 0; /* remove extra vertical space due to non-zero font-size */
}

View File

@ -165,6 +165,15 @@ function setupSearchEngine()
logoElt.alt = gSearchEngine.name;
}
// The "autofocus" attribute doesn't focus the form element
// immediately when the element is first drawn, so the
// attribute is also used for styling when the page first loads.
let searchText = document.getElementById("searchText");
searchText.addEventListener("blur", function searchText_onBlur(e) {
searchText.removeEventListener("blur", searchText_onBlur);
e.target.removeAttribute("autofocus");
});
}
function loadSnippets()

View File

@ -25,9 +25,6 @@
href="chrome://branding/content/icon16.png"/>
<link rel="stylesheet" type="text/css" media="all"
href="chrome://browser/content/abouthome/aboutHome.css"/>
<script type="text/javascript;version=1.8"
src="chrome://browser/content/abouthome/aboutHome.js"/>
</head>
<body dir="&locale.dir;">
@ -67,5 +64,8 @@
</div>
<a id="aboutMozilla" href="http://www.mozilla.org/about/"/>
<script type="text/javascript;version=1.8"
src="chrome://browser/content/abouthome/aboutHome.js"/>
</body>
</html>