From c3a114c45a6460987df4baadacabefec7d12ee21 Mon Sep 17 00:00:00 2001
From: Michael Q Larson <michaelqlarson@gmail.com>
Date: Sat, 17 Jan 2015 16:36:10 -0800
Subject: [PATCH] Simplify challenge view and make bolder modals. Remove
 duplicate bootstrap.js inclusion that was causing glitches.

---
 public/css/main.less           | 15 +++++++++++++++
 views/challenges/show.jade     | 19 ++++++++++---------
 views/layout.jade              |  1 -
 views/partials/challenges.jade | 13 +++++++------
 4 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/public/css/main.less b/public/css/main.less
index 53ec307dc9..6e165494a6 100644
--- a/public/css/main.less
+++ b/public/css/main.less
@@ -501,6 +501,21 @@ thead {
   }
 }
 
+.challenge-list-header {
+  background-color: #215f1e;
+  color: #eee;
+  font-size: 40px;
+  text-align: center;
+  margin-bottom: -30px;
+  border-radius: 5px 5px 0px 0px;
+}
+
+.closing-x {
+  color: #eee;
+  font-size: 60px;
+  text-align: right;
+}
+
 //uncomment this to see the dimensions of all elements outlined in red
 //* {
 //  border-color: red;
diff --git a/views/challenges/show.jade b/views/challenges/show.jade
index 673c2acb85..9470d4d3ec 100644
--- a/views/challenges/show.jade
+++ b/views/challenges/show.jade
@@ -19,23 +19,24 @@ block content
                 #complete-dialog.modal(tabindex='-1')
                     .modal-dialog.animated.zoomIn.fast-animation
                         .modal-content
-                            .modal-header
-                                a.close(href='#', data-dismiss='modal', aria-hidden='true') ×
+                            .modal-header.challenge-list-header Nicely done!
+                                a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') ×
+                            .modal-body
                                 .text-center
-                                    h1.animated.zoomInDown Nicely done!
-                                    .animated.zoomInUp.delay-1
+                                    .animated.zoomInUp.delay-half
                                         span.landing-icon.ion-checkmark-circled.text-primary
                                 - if (cc)
-                                    a.animated.fadeIn.delay-2.btn.btn-lg.btn-primary.btn-block.next-button(name='_csrf', value=_csrf, aria-hidden='true') Take me to my next challenge
+                                    a.animated.fadeIn.delay-1.btn.btn-lg.btn-primary.btn-block.next-button(name='_csrf', value=_csrf, aria-hidden='true') Take me to my next challenge
                                     - if (points && points > 2)
-                                        a.animated.fadeIn.delay-2.btn.btn-lg.btn-block.btn-twitter(href="https://twitter.com/intent/tweet?text=I%20just%20#{verb}%20Free%20Code%20Camp%20Challenge%20%23#{number}:%20#{name}&url=http%3A%2F%2Ffreecodecamp.com/challenges/#{number}&hashtags=learntocode, javascript" target="_blank")
+                                        a.animated.fadeIn.delay-1.btn.btn-lg.btn-block.btn-twitter(href="https://twitter.com/intent/tweet?text=I%20just%20#{verb}%20Free%20Code%20Camp%20Challenge%20%23#{number}:%20#{name}&url=http%3A%2F%2Ffreecodecamp.com/challenges/#{number}&hashtags=learntocode, javascript" target="_blank")
                                           i.fa.fa-twitter &nbsp;
                                              = phrase
                                 - else
                                     a.animated.fadeIn.delay-2.btn.btn-lg.signup-btn.btn-block(href='/login') Sign in so you can save your progress
                 #all-challenges-dialog.modal(tabindex='-1')
-                    .modal-dialog.animated.zoomIn.fast-animation
+                    .modal-dialog.animated.fadeInUp.fast-animation
                         .modal-content
-                            .modal-header
-                                a.close(href='#', data-dismiss='modal', aria-hidden='true') ×
+                            .modal-header.challenge-list-header Challenges
+                                a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') ×
+                            .modal-body
                                     include ../partials/challenges
\ No newline at end of file
diff --git a/views/layout.jade b/views/layout.jade
index 9d01e2974e..c924eaab71 100644
--- a/views/layout.jade
+++ b/views/layout.jade
@@ -1,7 +1,6 @@
 doctype html
 html(ng-app='profileValidation')
   head
-    script(src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js')
     script(src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js")
     script(src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js")
     script(src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.0/ui-bootstrap-tpls.min.js")
diff --git a/views/partials/challenges.jade b/views/partials/challenges.jade
index fddc2177e6..cef62c9d57 100644
--- a/views/partials/challenges.jade
+++ b/views/partials/challenges.jade
@@ -1,7 +1,8 @@
-ol(start='0')
-    for challenge in challenges
-        li
-            a(href="/challenges/#{challenge.challengeNumber}", class="#{ (cc && cc[challenge.challengeNumber] > 0) ? 'strikethrough' : '' }") #{challenge.name}
-            | &nbsp; (#{challenge.time} mins)
+h3
+    ol(start='0')
+        for challenge in challenges
+            li
+                a(href="/challenges/#{challenge.challengeNumber}", class="#{ (cc && cc[challenge.challengeNumber] > 0) ? 'strikethrough' : '' }") #{challenge.name}
+                | &nbsp; (#{challenge.time} mins)
 
-a.btn.btn-primary(href="/done-with-first-100-hours", class="#{ ((cc && cc[53] === 0) || (!cc)) ? 'disabled' : '' }") I've finished all Free Code Camp challenges and all the Easy and Medium CoderByte Challenges
\ No newline at end of file
+a.btn.btn-lg.btn-primary.btn-block(href="/done-with-first-100-hours", class="#{ ((cc && cc[53] === 0) || (!cc)) ? 'disabled' : '' }") I'm done with all the challenges!
\ No newline at end of file