Merge GT-2095-Tool-Groups into staging

CruGlobal · Apr 22, 2024 · 3bbf1e2 · 3bbf1e2
2 parents 8e61d58 + 3255402
commit 3bbf1e2
Show file tree

Hide file tree

Showing 3 changed files with 98 additions and 11 deletions.
diff --git a/src/app/components/tool-group/tool-group.component.html b/src/app/components/tool-group/tool-group.component.html
@@ -195,7 +195,7 @@
             *ngFor="let rule of toolGroup['rules-praxis']"
           >
             <li
-              *ngIf="toolGroup['rules-country'].length > 1"
+              *ngIf="toolGroup['rules-praxis'].length > 1"
               class="list-group-item d-flex justify-content-between align-items-center"
             >
               Rule

diff --git a/src/app/service/tool-group/tool-group.service.ts b/src/app/service/tool-group/tool-group.service.ts
@@ -23,37 +23,37 @@ export class ToolGroupService extends AbstractService {
   private readonly toolGroupsUrl = environment.base_url + 'tool-groups';
 
   praxisConfidentData = {
-    0: {
+    1: {
       name: 'Very confident',
     },
-    1: {
+    2: {
       name: 'Somewhat confident',
     },
-    2: {
+    3: {
       name: 'Neutral',
     },
-    3: {
+    4: {
       name: 'Not very confident',
     },
-    4: {
+    5: {
       name: 'Not confident at all',
     },
   };
 
   praxisOpennessData = {
-    0: {
+    1: {
       name: 'Very Open',
     },
-    1: {
+    2: {
       name: 'Somewhat open',
     },
-    2: {
+    3: {
       name: 'Neutral',
     },
-    3: {
+    4: {
       name: 'Not very open or interested',
     },
-    4: {
+    5: {
       name: 'Not open at all',
     },
   };

diff --git a/src/styles.css b/src/styles.css
@@ -149,3 +149,90 @@ span.sortLabel {
     max-width: 750px;
   }
 }
+
+/* Filter Sort Bar */
+#filterSortBar {
+  padding: 0 0 0 3px;
+}
+#filterSortBar > div > span {
+  padding-right: 0.75rem;
+  font-size: 0.75rem;
+  float: right;
+  vertical-align: middle;
+  margin: auto 0;
+  font-style: italic;
+  color: #6c757d;
+}
+#filterSortBar .btn-group {
+  vertical-align: inherit;
+}
+#filterSortBar .dropdown-header {
+  padding: 0.3rem 0.5rem;
+  color: #000;
+}
+/* Filter/Sort Button (Within Dropdown Menu) */
+#filterSortBar .dropdown > button {
+  font-size: 0.75rem;
+  border: 0;
+  padding: 0.15rem 0.4rem;
+  background-color: rgba(0, 0, 0, 0);
+  color: #6c757d;
+  margin-right: 5px;
+}
+#filterSortBar .dropdown > button:hover {
+  background-color: rgba(0, 0, 0, 0.05);
+}
+#filterSortBar .dropdown > button:focus {
+  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+  background-color: rgba(0, 0, 0, 0.05);
+}
+#filterSortBar .dropdown > button:active {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+/* Filter/Sort NavBar Buttons */
+.filter-dropdown-button {
+  cursor: pointer;
+  display: block;
+  width: 100%;
+  padding: 0.25rem 1rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  border-radius: 0.2rem;
+  clear: both;
+  font-weight: 400;
+  color: #212529;
+  text-align: inherit;
+  white-space: nowrap;
+  background-color: transparent;
+  border: 0;
+}
+.filter-dropdown-button:hover {
+  background-color: rgba(0, 0, 0, 0.05);
+}
+.filter-dropdown-button:active {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+span.sortLabel {
+  font-size: 0.75rem;
+  color: #6c757d;
+  margin-left: 7px;
+}
+/* Tool Cards */
+.card-header.pointer:hover {
+  cursor: pointer;
+  background-color: rgba(52, 58, 64, 0.9) !important;
+}
+.card-header.pointer:active span.h4 {
+  color: rgba(255, 255, 255, 0.5);
+}
+/* Other */
+#filterBadge {
+  translate: 0 -50%;
+  top: 50%;
+  width: 15px;
+}
+@media (min-width: 576px) {
+  .modal-dialog.modal-lg {
+    max-width: 750px;
+  }
+}