Merge pull request #6201 from FreeCodeCamp/dark-green

Fixes most common complaints about map, color contrast

client/less/lib/bootstrap/variables.less

@@ -14,9 +14,9 @@
 @gray-light:             lighten(@gray-base, 46.7%); // #777
 @gray-lighter:           lighten(@gray-base, 93.5%); // #eee
 
-@brand-primary:         forestgreen;
+@brand-primary:         darkgreen;
-@brand-success:         #457e86;
+@brand-success:         #457E86;
-@brand-info:            #2b414f;
+@brand-info:            #4A2B0F;
 @brand-warning:         #f0ad4e;
 @brand-danger:          #d9534f;
 

client/less/main.less

@@ -333,7 +333,7 @@ a {
 }
 
 p {
-  font-size: 20px;
+  font-size: 16px;
 }
 
 .map-aside-body p {
@@ -400,7 +400,19 @@ p {
 }
 
 h4 {
-  font-size: 26px;
+  font-size: 22px;
+}
+
+.no-transition {
+  -webkit-transition: height 0.001s;
+  -moz-transition: height 0.001s;
+  -ms-transition: height 0.001s;
+  -o-transition: height 0.001s;
+  transition: height 0.001s;
+}
+
+.margin-left-10 { 
+  margin-left: 10px; 
 }
 
 .btn-responsive {

seed/challenges/00-getting-started/getting-started.json

@@ -1,5 +1,5 @@
 {
-  "name": "Getting Started",
+  "name": "Join the Free Code Camp Community",
   "order": 1,
   "time": "15 minutes",
   "helpRoom": "Help",

server/views/map/show.jade

@@ -1,28 +1,37 @@
 extends ../layout-wide
 block content
+      .text-center
+          h1 Challenge Map
+          p Required challenges are marked with a *
           .row
-        .col-xs-12.col-md-6.col-md-offset-3
+              .col-xs-10.col-xs-offset-1.col-sm-6.col-sm-offset-3.col-md-4.col-md-offset-4
-            for superBlock, index in superBlocks
+                  a.btn.btn-primary.btn-block(href='/map' target='_blank') View this map in full screen
-                if index > 0
+                  // .btn.btn-primary.btn-block#showAll Expand 
-                    .row
-                        h2.text-center #{superBlock.name}
-                        .text-center.small Requires completion of the below challenges marked with a *
       hr
+      #accordion
+        for superBlock, index in superBlocks
+            h2
+              i.fa.fa-caret-right
+              |            
+              a.collapsed(data-toggle='collapse', data-parent='#accordion', href='#collapse'+superBlock.name.split(' ').join('-'))
+                | #{superBlock.name}
+            div.margin-left-10(id = 'collapse'+superBlock.name.split(' ').join('-') class = "panel-collapse collapse no-transition")
+                #nested.panel-group
                     for challengeBlock in superBlock.blocks
-                    .row
+                        h3
-                        a(href='#' name=challengeBlock.dashedName)
+                          i.fa.fa-caret-right
-                        .spacer.negative-55
+                          |  
-                    .row
+                          a(data-toggle='collapse', data-parent='#nested', href='#nested-collapse'+challengeBlock.name.replace(/(\W)/gi, '').split(' ').join('-'))
-                        h3.bold #{challengeBlock.name} (#{challengeBlock.time})
+                            | #{challengeBlock.name} (#{challengeBlock.time})
+                        div.margin-left-10(id = "nested-collapse"+challengeBlock.name.replace(/\W/gi, '').split(' ').join('-') class = "panel-collapse collapse no-transition")
                             for challenge in challengeBlock.challenges
-                            .col-xs-12.col-sm-9.col-md-10
                                 if challenge.completed
-                                    p.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")  
+                                    p.text-primary.ion-checkmark-circled.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
-                                        a(href="/challenges/#{challenge.dashedName}" target='_parent')
+                                        a.faded(href="/challenges/#{challenge.dashedName}" target='_parent')
                                             = challenge.title
                                             span.sr-only= " Complete"
                                 else if challenge.isRequired
-                                    p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")  
+                                    p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
                                         a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
                                             span= challenge.title
                                             span.sr-only= " Incomplete"
@@ -37,7 +46,7 @@ block content
                                         span.text-primary    
                                             strong *
                                 else
-                                    p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")  
+                                    p.ion-ios-circle-outline.padded-ionic-icon.negative-15(name="#{challenge.dashedName}")    
                                         a(name="#{challenge.dashedName}" target='_parent' href="/challenges/#{challenge.dashedName}" class=challenge.isComingSoon ? 'disabled' : '')
                                             span= challenge.title
                                             span.sr-only= " Incomplete"
@@ -49,21 +58,14 @@ block content
                                             span.text-success.small    
                                                 strong
                                                     em Coming Soon
-            .row
-                h2.text-center Full Stack Development Certification
-                hr
-                p.ion-locked.padded-ionic-icon.negative-15   Greenfield Nonprofit Project 1
-                p.ion-locked.padded-ionic-icon.negative-15   Greenfield Nonprofit Project 2
-                p.ion-locked.padded-ionic-icon.negative-15   Legacy Nonprofit Project 1
-                p.ion-locked.padded-ionic-icon.negative-15   Legacy Nonprofit Project 2
-                p.ion-locked.padded-ionic-icon.negative-15   Claim your Full Stack Development Certification
-
-            .row
-                h2.text-center Coding Interview Preparation
-                hr
-                p.ion-locked.padded-ionic-icon.negative-15   Whiteboard Coding Interview Training
-                p.ion-locked.padded-ionic-icon.negative-15   Critical Thinking Interview Training
-                p.ion-locked.padded-ionic-icon.negative-15   Mock Interview 1
-                p.ion-locked.padded-ionic-icon.negative-15   Mock Interview 2
-                p.ion-locked.padded-ionic-icon.negative-15   Mock Interview 3
         .spacer
+script.
+    $(document).ready(function(){    
+        $('#accordProfile').on('shown', function () {
+           $(".fa-caret-right").removeClass("icon-chevron-down").addClass("icon-chevron-up");
+        });
+
+        $('#accordProfile').on('hidden', function () {
+           $(".icon-chevron-up").removeClass("icon-chevron-up").addClass("icon-chevron-down");
+        });
+    });