diff --git a/app/styles/sales-view.sass b/app/styles/sales-view.sass index 9aefca14c..1abae54e6 100644 --- a/app/styles/sales-view.sass +++ b/app/styles/sales-view.sass @@ -1,6 +1,9 @@ #sales-view background-color: #F5F5F5 + font-family: Helvetica, sans-serif + font-size: 15px + line-height: 20px // TODO: better way to remove content styling? #site-content-area @@ -13,7 +16,7 @@ .btn-contact-us background-color: #3878DE - color: #F5F5F5 + color: #FFFFFF font-size: 20px margin-top: 20px padding: 20px @@ -22,7 +25,7 @@ .btn-create-account background-color: #09AC48 - color: #F5F5F5 + color: #FFFFFF display: inline-block font-size: 20px margin: 10px @@ -31,7 +34,7 @@ text-transform: uppercase .btn-login-account - color: #F5F5F5 + color: #FFFFFF text-decoration: underline .btn-setup-class @@ -58,16 +61,27 @@ #top-page-content background-image: url('/images/pages/sales/hero_background.png') background-size: cover - color: #F5F5F5 + color: #FFFFFF - #top-amazing-quote-container + .hero-quote-container margin: 20px width: 60% - #top-amazing-quote - font-size: 40px - #top-amazing-quote-attribution - font-size: 18px - text-align: right + + .hero-quote + font-family: Merriweather + font-size: 30px + font-weight: 700 + color: #FFFFFF + line-height: 37px + + .hero-quote-attribution + font-family: Helvetica, sans-serif + font-style: italic + font-size: 13px + color: #FFFFFF + line-height: 16px + margin-right: 100px + text-align: right #down-arrow padding: 20px @@ -92,6 +106,13 @@ img width: 100% + .img-caption + font-family: Helvetica, sans-serif + font-style: italic + font-size: 11px + color: #727272 + line-height: 13px + .img-face background-color: #f0e5c7 border-radius: 50% @@ -101,17 +122,23 @@ .img-game width: 100% - .hero-quote + .teacher-quote font-family: Merriweather - font-size: 19px + font-weight: 300 + font-size: 18px + line-height: 20px + + .teacher-name + font-family: Helvetica, sans-serif font-weight: 700 + font-size: 16px line-height: 19px - .hero-quote-attribution + .teacher-location font-family: Helvetica, sans-serif font-style: italic - font-size: 13px - line-height: 16px + font-size: 12px + line-height: 14px #quote1-container background-image: url('/images/pages/sales/quote1.png') @@ -132,14 +159,17 @@ padding: 12px margin-left: 10px - .hero-quote + .teacher-quote margin-top: 60px .hero-quote-attribution margin-top: 20px - .twitter-text + .twitter-attribution + font-family: Helvetica + font-weight: 700 + font-size: 11px + line-height: 14px color: black display: inline-block - font-weight: bold text-decoration: none diff --git a/app/templates/sales-view.jade b/app/templates/sales-view.jade index fccc3b4ae..726227f75 100644 --- a/app/templates/sales-view.jade +++ b/app/templates/sales-view.jade @@ -11,9 +11,9 @@ block content img(src='/images/pages/sales/chat_icon.png') span.spl contact us for pricing and free trial - #top-amazing-quote-container - #top-amazing-quote "CodeCombat is without question the most engaging platform for learning programming languages." - #top-amazing-quote-attribution Jonathan P., Elementary Computers Teacher + .hero-quote-container + .hero-quote "CodeCombat is without question the most engaging platform for learning programming languages." + .hero-quote-attribution Jonathan P., Elementary Computers Teacher .text-center a.btn-create-account set up a free class @@ -92,27 +92,25 @@ block content tr td #quote1-container - .hero-quote + .teacher-quote span.spr "My class had been struggling with the basics of Python all year. Today they were having fun and getting into it strong - I think they actually forgot that they were actually learning something." .row .col-md-4 .col-md-8 .hero-quote-attribution - div - strong Tim M. - div Director of Technology, Tilton School + .teacher-name Tim M. + .teacher-location Director of Technology, Tilton School td #quote2-container .row .col-md-8 .hero-quote-attribution - .text-right - strong Darlease M. - .text-right Technology Coordinator, - .text-right Global Learning Charter Public School + .teacher-name.text-right Darlease M. + .teacher-location.text-right Technology Coordinator, + .teacher-location.text-right Global Learning Charter Public School .col-md-4 - .hero-quote + .teacher-quote span.spr "My girls, who were apprehensive about taking a coding class, ar some of my top students. strong They work together and explain the code to each other to make sure each understands." br @@ -125,19 +123,19 @@ block content .text-right a(href='https://twitter.com/flinng/status/674238468747354112') img(src='/images/twitter_icon.png') - span.twitter-text @flinng + span.twitter-attribution @flinng td img(src='/images/pages/sales/classroom4.png') .text-right a(href='https://twitter.com/HikariKishi/status/674359511566577664') img(src='/images/twitter_icon.png') - span.twitter-text @HikariKishi + span.twitter-attribution @HikariKishi td img(src='/images/pages/sales/classroom2.png') .text-right a(href='https://twitter.com/Coderdojovno/status/675743290461941760') img(src='/images/twitter_icon.png') - span.twitter-text @Coderdojovno + span.twitter-attribution @Coderdojovno table(cellpadding=4) tr td @@ -145,19 +143,19 @@ block content .text-right a(href='https://twitter.com/teachercoulter/status/674734565487828992') img(src='/images/twitter_icon.png') - span.twitter-text @teachercoulter + span.twitter-attribution @teachercoulter td img(src='/images/pages/sales/classroom1.png') .text-right a(href='https://twitter.com/CentreHigh/status/674643613360324608') img(src='/images/twitter_icon.png') - span.twitter-text @CentreHigh + span.twitter-attribution @CentreHigh td img(src='/images/pages/sales/classroom5.png') .text-right a(href='https://twitter.com/MrsYassen_GRE/status/674747949902090244') img(src='/images/twitter_icon.png') - span.twitter-text @MrsYassen_GRE + span.twitter-attribution @MrsYassen_GRE br p.blurb-subtitle Facts about CodeCombat: