mirror of
https://github.com/scratchfoundation/scratchx.git
synced 2024-11-28 18:45:49 -05:00
Match the homepage comp more closely
This commit is contained in:
parent
1384bda68a
commit
48121a694f
5 changed files with 256 additions and 212 deletions
|
@ -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
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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;
|
||||
|
|
Loading…
Reference in a new issue