WEB-65

main_new.jsp -> sidebar left: first-level children's indentation is missing

added indentation for first-level children; swapped "span" and "i" in
<a ng-click="expanded = !expanded" href=""><span>{{item.name}}</span><i class="fa {{item.class}}"></i></a>
so that the icon did not appear to belong to the menu item above the current one (in some cases this occured).

Author: act-ive

src/main/webapp/WEB-INF/pages/main_new.jsp

@@ -106,7 +106,7 @@
                 <div id="leftside-navigation" class="nano">
                     <ul class="nano-content">
                         <li class="sub-menu" ng-repeat="item in menuTopics">
-                            <a ng-click="expanded = !expanded" href=""><i class="fa {{item.class}}"></i><span>{{item.name}}</span></a>
+                            <a ng-click="expanded = !expanded" href=""><span>{{item.name}}</span><i class="fa {{item.class}}"></i></a>
                             <ul class="slideDown" ng-show="expanded">
                                 <li ng-repeat="lesson in item.children">
                                     <a ng-click="renderLesson(lesson.link)" title="link to {{lesson.name}}" href="">{{lesson.name}}</a>

src/main/webapp/css/main.css

@@ -230,6 +230,10 @@ img {
   background-color: #16a086;
 }
 
+.sidebar > div > ul > li > ul > li > a {
+    float:left; margin-left:1em;
+}
+
 .sidebar > div > ul > li > ul > li > span {
     float:left; margin-left:1.5em;
 }