Match the homepage comp more closely

This commit is contained in:
Ray Schamp 2015-08-06 14:39:44 -04:00
parent 1384bda68a
commit 48121a694f
5 changed files with 256 additions and 212 deletions

View file

@ -1184,7 +1184,8 @@ footer, main header {
body > main > header {
display: block;
height: 3.75em;
line-height: 3.75em; }
line-height: 3.75em;
position: relative; }
body > main > header::after {
clear: both;
content: "";
@ -1195,7 +1196,8 @@ body > main > article {
margin-top: -3.75em; }
.scratchx-logo {
float: left; }
float: left;
margin-bottom: 0; }
.scratchx-logo span {
overflow: hidden;
text-indent: 101%;
@ -1213,9 +1215,19 @@ body > main > article {
margin-left: 50px; }
/* Homepage */
#home > header {
body.page-home > main > header {
background-color: transparent; }
body.page-home > main > header > div {
border-bottom: 1px solid #c5c5c5; }
body.page-home > main > header a {
color: #fff; }
#home {
padding-top: 0; }
#home > header {
background: url(../images/editor.png);
background-size: cover; }
background-size: cover;
padding-top: 3.75em; }
#home > header h1 {
font-weight: normal; }
#home > header > section {
@ -1346,9 +1358,9 @@ body > main > article {
margin-right: 0; }
#home > header .bottom-row > div > a button {
width: 100%; }
#home header + aside {
#home header + aside {
margin: 0; }
#home > section {
#home > section {
padding: 2.25em 0; }
#home > section > div {
max-width: 60em;
@ -1398,7 +1410,7 @@ body > main > article {
margin-right: 0; }
#home > section.who-uses-scratchx h2 {
font-weight: normal; }
#home nav {
#home nav {
max-width: 60em;
margin-left: auto;
margin-right: auto; }
@ -1474,7 +1486,8 @@ body > main > article {
position: relative;
display: block; }
.featured-extension > a img {
display: block; }
display: block;
height: 107px; }
.featured-extension > a .tryit {
display: inline-block;
position: absolute;

File diff suppressed because one or more lines are too long

View file

@ -311,6 +311,7 @@ function showPage(path, force) {
$(toHide).filter(":visible").hide();
if (!showEditor && editorShown) $(document.getElementById(editorId)).css({top: "-9999px"});
$("body > main, body > main > article").has($toShow).show();
setBodyClass(path);
$toShow.show();
if (showEditor) $toShow.css({top: 0});
@ -320,6 +321,17 @@ function showPage(path, force) {
$(document).trigger("page:show", path);
}
function setBodyClass(path) {
var pageClassPrefix = "page-";
var currentPageClasses = ($("body").attr("class") || "").split(" ");
for (c in currentPageClasses) {
if (currentPageClasses[c].indexOf(pageClassPrefix) != -1) {
$("body").removeClass(currentPageClasses[c]);
}
}
$("body").addClass(pageClassPrefix + path);
}
/* URL Shortening */
function shorten(url, done) {
var data = {longUrl: url};
@ -454,6 +466,7 @@ function initPage() {
initialPage = window.location.hash.substr(1);
}
}
setBodyClass(initialPage);
showPage(initialPage, true);
loadFromURLParameter(window.location.search, true);
}

View file

@ -1,9 +1,24 @@
/* Homepage */
body.page-home > main > header {
background-color: transparent;
> div {
border-bottom: $base-border;
}
a {
color: $white;
}
}
#home {
padding-top: 0;
> header {
background: url(../images/editor.png);
background-size: cover;
padding-top: $vertical-base * 10;
h1 {
font-weight: normal;
@ -222,6 +237,7 @@
img {
display: block;
height: 107px;
}
.tryit {

View file

@ -191,6 +191,7 @@ body > main > header {
@include row();
height: $vertical-base * 10;
line-height: $vertical-base * 10;
position: relative;
}
body > main > article {
@ -200,6 +201,7 @@ body > main > article {
.scratchx-logo {
float: left;
margin-bottom: 0;
span {
@include hide-text;