Skip to content

Moving interactive banner to the top #1007

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Nov 3, 2016
Merged

Moving interactive banner to the top #1007

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
7c37f82
Updating Amazon Linux ver
ryanmurakami Jul 6, 2016
9bdccab
Merge remote-tracking branch 'nodejs/master'
ryanmurakami Nov 2, 2016
a1eb8b6
moving interactive banner to the top of the page
ryanmurakami Nov 2, 2016
922e3dd
undoing change to amazon linux version
ryanmurakami Nov 2, 2016
c1ab3ba
removed image styles and added new bg of austin
ryanmurakami Nov 3, 2016
c10c5a6
moving background style to original pos
ryanmurakami Nov 3, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions layouts/css/base.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ pre
@import 'layout/_main'
@import 'layout/_lists'
@import 'page-modules/_linuxfoundation'
@import 'page-modules/_interactive-banner'
@import 'page-modules/_header'
@import 'page-modules/_footer'
@import 'page-modules/_home'
Expand Down
17 changes: 17 additions & 0 deletions layouts/css/page-modules/_interactive-banner.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
#interactive-wrapper
flex none

#interactive
background-image url("/static/images/interactive/background.jpg")
display flex
align-items center
justify-content space-around

#interactive
> *
border 20px solid transparent
min-width 1px

@media (max-width: 480px)
#interactive
flex-wrap wrap
48 changes: 12 additions & 36 deletions layouts/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,18 @@
<body>
{{> header }}

<div id="interactive-wrapper">
<div id="interactive">
<span>
<img src="/static/images/interactive/nodejs-interactive-logo-center.png" />
</span>
<a href="http://events.linuxfoundation.org/events/node-interactive">
<img src="/static/images/interactive/nodejs-interactive-hero-banner-right-na.png"
alt="Node.js Interactive North America, Austin, Texas, November 29 - Dec 2, 2016" />
</a>
</div>
</div>

<div id="main">
<div class="container">

Expand Down Expand Up @@ -71,42 +83,6 @@
</div>
</div>

<style>
#interactive-wrapper {
flex: none;
}

#interactive {
background-image: url("/static/images/interactive/background.jpg");
display: flex;
align-items: center;
justify-content: space-around;
}

#interactive > * {
border: 20px solid transparent;
min-width: 1px;
}

@media (max-width: 480px) {
#interactive {
flex-wrap: wrap;
}
}
</style>

<div id="interactive-wrapper">
<div id="interactive">
<span>
<img src="/static/images/interactive/nodejs-interactive-logo-center.png" />
</span>
<a href="http://events.linuxfoundation.org/events/node-interactive">
<img src="/static/images/interactive/nodejs-interactive-hero-banner-right-na.png"
alt="Node.js Interactive North America, Austin, Texas, November 29 - Dec 2, 2016" />
</a>
</div>
</div>

{{> footer className="no-margin-top" }}
<script src="/static/js/download.js" async defer></script>
<script src="/static/js/dnt_helper.js"></script>
Expand Down
Binary file modified static/images/interactive/background.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.