Display training modules on 3 columns

Author: paul-ion

trainingportal/static/trainingModules.html

@@ -3,7 +3,7 @@
     <h3>Hi {{firstName}}! Welcome to the Secure Coding Dojo!</h3>
     <p>Pick a training module below to start.</p>
     <div class="row">
-        <div class="col-lg-6 d-flex align-items-stretch" ng-repeat="(key, value) in modules" style="padding:1em" >
+        <div class="col-lg-4 d-flex align-items-stretch" ng-repeat="(key, value) in modules" style="padding:1em" >
 
                 <div class="card" >
                     <div class="card-header">
@@ -16,15 +16,16 @@ <h5 class="card-title">{{value.summary}}</h5>
 
                     </div>
                     <div class="card-footer">
-                        <small class="text-muted" ng-if="value.requiredModules.length>0">
-                            This module requires: <span ng-repeat="moduleId in value.requiredModules">{{modules[moduleId].name}}</span>
-                        </small>
+                       
                         <a ng-href="/public/badge/{{getBadgeCode(key)}}" class="btn btn-primary float-right mx-1" ng-class="{ disabled: !isModuleComplete(key) }">
                             <span class="oi oi-circle-check" ng-if="isModuleComplete(key)"></span>
                             Badge
                         </a>
                         <a ng-href="#!challenges/{{key}}" class="btn btn-primary float-right mx-1" ng-class="{ disabled: !isModuleEnabled(key) }">Load</a>
-
+                        <small class="text-muted text-align-right" ng-if="value.requiredModules.length>0">
+                            Requires: <span ng-repeat="moduleId in value.requiredModules">{{modules[moduleId].name}}</span>
+                        </small>
+                        
                     </div>
                 </div>
     </div>