Update course info mock UI

This commit is contained in:
Matt Lott 2015-07-10 16:25:56 -07:00
parent 899aae5798
commit 49a75d2d42
3 changed files with 67 additions and 41 deletions
app
styles/courses/mock1
templates/courses/mock1
views/courses/mock1

View file

@ -6,6 +6,9 @@
.center
text-align: center
.caption-text
font-size: 14px
.concepts-container
width: 200px
@ -15,13 +18,14 @@
.info-container
margin: 0% 10%
font-size: 18px
.monitoring-img-container
margin-top: 10px
.praise-quote
font-size: 24px
font-style: italic
.praise-source
font-size: 16px
.progress-container
width: 200px
font-size: 20px

View file

@ -4,55 +4,77 @@ block content
//- DO NOT localize / i18n
div TODO: Add high-level blurb
div TODO: course-specific gameplay screenshots
div TODO: update images, add captions
div TODO: Add real marketing copy.
div
span *UNDER CONSTRUCTION, send feedback to
a.spl(href='mailto:team@codecombat.com') team@codecombat.com
div(style='border-bottom: 1px solid black; margin-bottom: 20px')
.well.info-container
.info-container
h1.center= course.title
p.center.gameplay-img-container
img(src='/images/pages/courses/102_info.png' width='700')
img(src='/images/pages/courses/102_info.png' width='800')
div.center.caption-text TODO: Add caption
p= course.description
h1.center Learn More in Less Time
p
span.spr Your students will learn
strong.spr more computer science
span.spr material in
strong.spr less time
span with CodeCombat!
p
span.spr In about
strong.spr #{course.duration} hours
span.spr your students will work through
strong.spr #{course.levels.length} lessons
span and cover these high-level topics:
p
span Approximately
strong.spl 5 hours
span.spl of content.
ul
each topic in course.topics
li= topic
h1.center No Experience Necesssary
p
span.spr Concepts covered:
each topic in course.topics
span.spr= topic
strong.spr No outside experience
span is needed for students to complete this course. They will pick up where the left off from the previous CodeCombat course.
p
strong.spr Teachers do not need programming experience
span to administer this course. Your students will learn on their own.
p
span.spr There are built-in
strong.spr help videos, level guides, tool tips
span to explain everything to your students.
p
span.spr Use
strong.spr student progress monitoring
span to match up stronger students with those that need a little extra help!
h1.center Monitor Student Progress
p.center.monitoring-img-container
img(src='/images/pages/clans/dashboard_preview.png' width='700')
div.container-fluid
div.row
div.col-md-3
div.col-md-6
ul
li
strong Track concepts
span.spl learned by each student
li Track levels completed for each student
li
span See your students'
strong.spl solutions
li Sort students by name or progress
div.col-md-3
div.center.caption-text TODO: Add caption
p.progress-container
ul
li
strong Track concepts
span.spl learned by each student
li Track levels completed for each student
li
span See your students'
strong.spl solutions
li Sort students by name or progress
h1.center Teachers Love CodeCombat!
p
div.praise-quote "#{praise.quote}"
div.praise-source - #{praise.source}
div.caption-text - #{praise.source}
p.center
button.btn.btn-info.btn-lg.btn-enroll(data-course-id="#{courseID}") Enroll
button.btn.btn-info.btn-lg.btn-enroll(data-course-id="#{courseID}") Enroll Now
p.contact-container
span For more information, please contact

View file

@ -26,63 +26,63 @@ data.courses = [
title: 'Introduction to Computer Science'
description: 'Learn basic syntax, while loops, and the CodeCombat learning environment.'
topics: ['Basic Syntax', 'Strings', 'Loops']
duration: '1 hour of material'
duration: 1
levels: ['Dungeons of Kithgard', 'Gems in the Deep', 'Shadow Guard', 'Kounter Kithwise', 'Crawlways of Kithgard', 'Enemy Mine', 'Illusory Interruption', 'Forgetful Gemsmith', 'Signs and Portents', 'Favorable Odds', 'True Names', 'The Prisoner', 'Banefire', 'The Raised Sword', 'Haunted Kithmaze', 'Riddling Kithmaze', 'Descending Further', 'The Second Kithmaze', 'Dread Door', 'Cupboards of Kithgard', 'Hack and Dash']
},
{
title: 'Computer Science 102'
description: 'Add parameters, if statements, and some other stuff.'
description: 'Computer Science 102 introduces Arguments, Variables, If Statements, and Arithmetic.'
topics: ['Arguments', 'Variables', 'If Statements', 'Arithmetic']
duration: '5 hours of material'
duration: 5
levels: ['Known Enemy', 'Master of Names', 'Lowly Kithmen', 'Closing the Distance', 'Tactical Strike', 'The Final Kithmaze', 'The Gauntlet', 'Radiant Aura', 'Kithgard Gates', 'Destroying Angel', 'Deadly Dungeon Rescue', 'Kithgard Brawl', 'Cavern Survival', 'Breakout', 'Attack Wisely!', 'Kithgard Mastery', 'Kithgard Apprentice', 'Long Kithmaze', 'Boom! and Bust', 'Defense of Plainswood', 'Winding Trail', 'Thumb Biter', 'Gems or Death', 'Backwoods Ambush', 'Patrol Buster', 'Endangered Burl', 'Village Guard', 'Thornbush Farm', 'Back to Back', 'Ogre Encampment', 'Woodland Cleaver', 'Shield Rush', 'Peasant Protection', 'Munchkin Swarm']
},
{
title: 'Computer Science 103'
description: 'Learn how to handle input.'
topics: ['If Statements', 'Arithmetic', 'Input Handling']
duration: '5 hours of material'
duration: 5
levels: ['Munchkin Harvest', 'Swift Dagger', 'Shrapnel', 'Arcane Ally', 'Touch of Death', 'Bonemender', 'Coinucopia', 'Copper Meadows', 'Drop the Flag', 'Deadly Pursuit', 'Rich Forager', 'Siege of Stonehold', 'Multiplayer Treasure Grove', 'Dueling Grounds', 'Backwoods Brawl', 'Backwoods Treasure', 'Range Finder', 'Stillness in Motion', 'The Agrippa Defense', 'Storming the Towers of Areth', 'Hold the Forest Pass', 'Hold for Reinforcements', 'Storming the Farmhouse', 'Wild Horses', 'Boulder Woods', 'Unfair Support', 'Tactical Timing', 'Apocalypse', 'Doom Glade', 'Defend the Garrison', 'Lost Viking', 'Forest Flower Grove', 'The Dunes', 'The Mighty Sand Yak', 'Oasis', 'Sarven Road', 'Sarven Gaps', 'Thunderhooves', 'Medical Attention', 'The Great Yak Stampede', 'Minesweeper', 'Sarven Sentry', 'Keeping Time']
},
{
title: 'Computer Science 104'
description: 'Time to tackle arrays and some pvp stuff.'
topics: ['Loops', 'Break Statements', 'Arrays']
duration: '5 hours of material'
duration: 5
levels: ['Hoarding Gold', 'Decoy Drill', 'Yakstraction', 'Sarven Brawl', 'Desert Combat', 'Dust', 'Sarven Rescue', 'Sacred Statue', 'Mirage Maker', 'Sarven Savior', 'Odd Sandstorm', 'Lurkers', 'Preferential Treatment', 'Sarven Shepherd', 'Shine Getter', 'The Trials', 'Mad Maxer', 'Mad Maxer Strikes Back', 'Mad Maxer Sells Out', 'Mad Maxer Gets Greedy', 'Mad Maxer: Redemption', 'Sarven Treasure', 'Harrowland', 'Sarven Siege', 'Clash of Clones', 'Sand Snakes', 'Crag Tag']
},
{
title: 'Computer Science 105'
description: 'Time to tackle arrays and some PVP.'
topics: ['Break Statements', 'Arrays', 'Object Literals']
duration: '5 hours of material'
duration: 5
levels: ['Slalom', 'Black Diamond', 'Treasure Cave', 'Ogre Gorge Gouger', 'Dance-Off', 'Alpine Rally', 'Cloudrip Commander', 'Mountain Mercenaries']
},
{
title: 'Computer Science 106'
description: 'For loops!'
topics: ['Break Statements', 'Object Literals', 'For loops']
duration: '5 hours of material'
duration: 5
levels: ['Timber Guard', 'Hunting Party', 'Zoo Keeper', 'Cloudrip Brawl', 'Cloudrip Treasure', 'Cloudrip Siege', 'Noble Sacrifice', 'Zero Sum', 'Borrowed Sword', 'Protect and Serve']
},
{
title: 'Computer Science 107'
description: 'Functions!'
topics: ['Object Literals', 'For loops', 'Functions']
duration: '5 hours of material'
duration: 5
levels: ['Vital Powers', 'Timber Turncoat', 'Restless Dead', 'Ring Bearer', 'The Two Flowers', 'The Geometry of Flowers', 'Mountain Flower Grove', 'Hunters and Prey', 'Library Tactician']
},
{
title: 'Computer Science 108'
description: 'Maths.'
topics: ['For loops', 'Functions', 'Math Operations']
duration: '5 hours of material'
duration: 5
levels: ['Steelclaw Gap', 'Pesky Yaks', 'Mixed Unit Tactics', 'Sowing Fire', 'Reaping Fire', 'Toil and Trouble', 'What in Carnation', 'Misty Island Mine', 'Raiders of the Long Dark', 'Grim Determination', 'Deadly Discs', "Summit's Gate"]
},
{
title: 'Computer Science 109'
description: 'Vectors and strings.'
topics: ['Vectors', 'Advanced Strings']
duration: '5 hours of material'
duration: 5
levels: ['Circle Walking', 'Skating Away', 'Kelvintaph Crusader', 'Kelvintaph Burgler', 'Ice Soccer', 'Razorfray']
}
]