Add HoC links to homepage

This commit is contained in:
Matt Lott 2015-11-24 15:28:32 -08:00
parent 7cba3f3725
commit 4cc71bd0e6
3 changed files with 43 additions and 24 deletions
app

View file

@ -12,6 +12,9 @@
multiplayer: "Multiplayer" # Not currently shown on home page
for_developers: "For Developers" # Not currently shown on home page.
or_ipad: "Or download for iPad"
hoc_class_code: "I Have a Class Code"
hoc_enter: "Enter"
hoc_title: "Hour of Code?"
nav:
play: "Levels" # The top nav bar entry where players choose which levels to play

View file

@ -3,6 +3,27 @@
#home-view
#hour-of-code
top: 632px
height: 190px
width: 400px
padding: 15px
border: 0
background: transparent url(/images/pages/play/level-info-background.png) no-repeat center center
background-size: 100% 100%
@media screen and ( max-height: 800px )
top: 382px
h1
color: rgb(255,253,149)
text-shadow: 0 0 6px black,0 0 6px black,0 0 6px black,0 0 6px black, 0 0 6px black,0 0 6px black,0 0 6px black,0 0 6px black, 0 0 6px black,0 0 6px black,0 0 6px black,0 0 6px black, 0 0 6px black,0 0 6px black,0 0 6px black,0 0 6px black, 0 0 6px black,0 0 6px black,0 0 6px black,0 0 6px black
.btn-class-code
float: left
margin: 10px
.btn-enter
float: right
margin: 10px
#kids-coding-container
$coding-image-size: 272px
position: relative
@ -29,8 +50,8 @@
height: 626px
@media screen and ( max-height: 800px )
height: 510px
#play-button, #or-ipad, #apple-store-button, #slogan, .alert, #news
#play-button, #or-ipad, #apple-store-button, #slogan, .alert, #news, #hour-of-code
text-align: center
text-transform: uppercase
font-weight: bold
@ -40,7 +61,7 @@
left: 0
right: 0
font-weight: bold
#play-button
text-align: center
padding-top: 170px
@ -52,15 +73,15 @@
height: 219px
@media screen and ( max-height: 800px )
top: 78px
background-image: url(/images/pages/home/play_button.png)
background-position: 0 219px
&:hover
background-position: 0 0
color: rgb(230,180,75)
text-decoration: none
#or-ipad
top: 540px
color: rgb(119,101,84)
@ -69,7 +90,7 @@
@media screen and ( max-height: 800px )
top: 310px
#apple-store-button
top: 593px
height: 63px
@ -114,18 +135,6 @@
top: 213px
border: 5px solid darkred
&.hour-of-code
#site-footer
background-color: rgb(70, 58, 44)
height: 185px
.hour-of-code-explanation
color: #9e8777
text-align: center
a
color: lighten(#0b63bc, 10%)
body[lang='ru'], body[lang^='de'], body[lang^='pt-BR'], body[lang='pl'], body[lang='tr'], body[lang^='nl'], body[lang^='cs'], body[lang^='sv'], body[lang^='el'], body[lang^='hu'], body[lang^='bg']
#home-view #slogan
font-size: 22px

View file

@ -16,11 +16,18 @@ block outer_content
//a(href="https://itunes.apple.com/us/app/codecombat/id936523909?mt=8")
// img(src="/images/pages/home/app_store_badge.svg")#apple-store-button
// Example of how to throw down a temporary news link
//#news
// a(href="/play/ladder/ace-of-coders", data-i18n="temp.ace_of_coders_tournament") New: play in the Ace of Coders tournament now!
#slogan(data-i18n="home.slogan")
//- Example of how to throw down a temporary news link
//- #news
//- a(href="/play/ladder/ace-of-coders", data-i18n="temp.ace_of_coders_tournament") New: play in the Ace of Coders tournament now!
//- TODO: Delete HoC section and replace with slogan below
#hour-of-code
h1(data-i18n="home.hoc_title")
div
a.btn.btn-lg.btn-info.btn-class-code(href='/courses/students', data-i18n="home.hoc_class_code")
a.btn.btn-lg.btn-success.btn-enter(href='/hoc', data-i18n="home.hoc_enter")
//- #slogan(data-i18n="home.slogan")
//- TODO: This does not work on IE8
.alert.alert-danger.lt-ie9