added links to cards (actual links and badges don't work)

awx/ui/client/legacy-styles/lists.less

@@ -129,6 +129,7 @@ table, tbody {
 }
 
 .List-header {
+    align-items: center;
     display: flex;
     height: 34px;
 }
@@ -145,6 +146,7 @@ table, tbody {
     height: 14px;
     margin: 3px 0;
     background-color: @list-title-badge;
+    border-radius: 5px;
 }
 
 .List-titleText {

awx/ui/client/src/controllers/Organizations.js

@@ -28,6 +28,31 @@ export function OrganizationsList($stateParams, $scope, $rootScope, $location,
                 val.isActiveCard = true;
             }
             val.description = card.description || undefined;
+            val.links = [];
+            val.links.push({
+                href: card.related.users,
+                name: "USERS"
+            });
+            val.links.push({
+                href: card.related.teams,
+                name: "TEAMS"
+            });
+            val.links.push({
+                href: card.related.inventories,
+                name: "INVENTORIES"
+            });
+            val.links.push({
+                href: card.related.projects,
+                name: "PROJECTS"
+            });
+            val.links.push({
+                href: card.related.job_templates,
+                name: "JOB TEMPLATES"
+            });
+            val.links.push({
+                href: card.related.admins,
+                name: "ADMINS"
+            });
             return val;
         });
     };

awx/ui/client/src/organizations/orgcards.block.less

@@ -8,6 +8,7 @@
 .OrgCards-card {
     background-color: #fff;
     padding: 20px;
+    padding-bottom: 0px;
     border-radius: 5px;
     border: 1px solid #e8e8e8;
     display: flex;
@@ -51,12 +52,32 @@
 }
 
 .OrgCards-description {
-    margin-bottom: 0px;
+    margin-bottom: 20px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
+.OrgCards-links {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+
+.OrgCards-link {
+    flex: initial;
+    width: ~"calc(50% - 20px)";
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin-bottom: 20px;
+}
+
+.OrgCards-linkBadge {
+    margin-right: 10px;
+}
+
 @media (min-width: 1179px) {
     .OrgCards-card {
         width: ~"calc(25% - 15px)";

awx/ui/client/src/partials/organizations.html

@@ -42,6 +42,18 @@
                 </div>
             </div>
             <p class="OrgCards-description">{{ card.description || "Place organization description here" }}</p>
+            <div class="OrgCards-links">
+                <div class="OrgCards-link" ng-repeat="link in card.links">
+                    <span class="badge List-titleBadge
+                        OrgCards-linkBadge">
+                        0
+                    </span>
+                    <a class="OrgCards-linkName"
+                        ng-href="{{ link.href }}">
+                        {{ link.name }}
+                    </a>
+                </div>
+            </div>
         </div>
     </div>
 </div>