Merge branch 'main' into pk/minute-am-pm-field-bugfix

.github/pull_request_template.md

@@ -1,3 +1,5 @@
 **Asana task**: [title](url)
 
 Description
+
+- [ ] For features with a design/UX component, deployed branch to dev-green and let product know it's ready for review.

Dockerfile

@@ -34,9 +34,7 @@ RUN apk add --no-cache --update curl
 
 WORKDIR /root
 
-RUN curl https://truststore.pki.rds.amazonaws.com/global/global-bundle.pem \
-    -o aws-cert-bundle.pem
-RUN echo "ed2b625ceeca0ebacf413972c33acbeb65a6c6b94d0c6434f1bb006cd4904ede  aws-cert-bundle.pem" | sha256sum -c -
+RUN curl https://truststore.pki.rds.amazonaws.com/global/global-bundle.pem -o aws-cert-bundle.pem
 
 # add frontend assets compiled in node container, required by phx.digest
 COPY --from=assets-builder /root/priv/static ./priv/static

assets/css/dashboard/filter-group.scss

@@ -0,0 +1,23 @@
+.filter-group {
+  width: 200px;
+
+  .header {
+    font-size: 16px;
+    margin-bottom: 8px;
+    line-height: 24px;
+  }
+
+  .button-group {
+    .filter-button {
+      height: 38px;
+      min-width: 200px;
+      color: $text-secondary;
+      background-color: $cool-gray-20;
+    }
+
+    .selected {
+      color: #ffffff;
+      background: #d9d9d93d;
+    }
+  }
+}

assets/css/dashboard/kebab-menu.scss

@@ -0,0 +1,39 @@
+.kebab-menu-dropdown {
+  &__menu {
+    background-color: $cool-gray-30;
+
+    &:hover {
+      background-color: $cool-gray-15;
+    }
+  }
+
+  &__item {
+    background-color: transparent;
+    color: white;
+    padding-right: 20px;
+    padding-left: 20px;
+
+    &:hover,
+    &:focus {
+      background-color: $cool-gray-15;
+      color: white;
+    }
+  }
+}
+
+.kebab-menu-button {
+  padding: 0;
+  background-color: transparent;
+  border-radius: 6px;
+  border: 1px solid rgba(23, 31, 38, 0.3);
+
+  &:hover,
+  &:focus {
+    background-color: $cool-gray-15;
+  }
+
+  &:focus {
+    outline: none;
+    box-shadow: none;
+  }
+}

assets/css/dashboard/new-pa-message/associate-alert-page.scss

@@ -11,6 +11,7 @@
 .associate-alert-page-header {
   padding-right: 48px;
   max-width: 1380px;
+  height: 48px;
 
   &__cancel {
     flex: none;
@@ -33,40 +34,16 @@
 .associate-alert-page-body {
   flex-wrap: nowrap;
   padding-right: 48px;
+  margin-top: 40px;
 }
 
 .associate-alert-filter-selection {
-  flex: none;
-  font-size: 20px;
-  width: 200px;
-  padding: 0px 12px;
-  margin-top: 40px;
-
-  &__label {
-    margin-bottom: 8px;
-  }
-
-  &__button-group {
-    margin-bottom: 48px;
-  }
-
-  &__selected {
-    color: #ffffff !important;
-    background: #d9d9d93d !important;
-  }
-
-  button {
-    text-align: left;
-    height: 38px;
-    min-width: 200px;
-    color: $text-secondary;
-    background-color: $cool-gray-20;
-    border: none;
-  }
+  max-width: 200px;
+  padding: 0;
 }
 
 .associate-alert-table {
-  margin: 40px;
+  margin: 0 40px;
   max-width: 1096px;
 
   th,

assets/css/dashboard/new-pa-message/new-pa-message-page.scss

@@ -258,31 +258,25 @@
     }
   }
 
-  .unassociated-alert-header {
-    margin-top: 40px;
-    font-size: 20px;
-    font-weight: 500;
-
-    button {
-      font-size: 20px;
-      margin-bottom: 14px;
-    }
-  }
-
-  .associated-alert-header {
+  .associated-alert-header,
+  .selected-template-header,
+  .alert-template-header {
     margin: 40px 0px 0px 16px;
     font-size: 20px;
     font-weight: 500;
+  }
 
-    button {
+  .associated-alert-header,
+  .selected-template-header,
+  .alert-template-container {
+    .clear-button {
+      padding: 0;
       color: $text-secondary;
-      margin-left: 16px;
-      margin-bottom: 6px;
-      width: auto;
-      padding: 0px;
-      height: 24px;
+      margin: auto 0 auto 16px;
     }
+  }
 
+  .associated-alert-header {
     .effect-period,
     .alert-ended {
       margin-top: 4px;
@@ -296,57 +290,39 @@
     }
   }
 
-  .associate-alert-button {
-    color: $text-link-primary;
-    font-family: Inter;
-    font-size: 20;
-    font-weight: 500;
-    height: 30px;
-    margin-bottom: 8px;
-  }
+  .alert-template-container {
+    display: flex;
+    align-items: center;
+    padding: 0;
 
-  .unassociated-alert-header {
-    margin-top: 40px;
-    font-size: 20px;
-    font-weight: 500;
+    .associate-alert-button {
+      padding-left: 0px;
+    }
 
-    button {
+    .associate-alert-button,
+    .psa-emergency-button {
+      height: 30px;
+      display: flex;
+      align-items: center;
+      margin: 0;
+      color: $text-link-primary;
       font-size: 20px;
-      margin-bottom: 14px;
+      font-weight: 500;
+      text-decoration: none;
     }
   }
 
-  .associated-alert-header {
-    margin: 40px 0px 0px 16px;
+  .unassociated-alert-header {
+    margin-top: 40px;
     font-size: 20px;
     font-weight: 500;
 
     button {
-      color: $text-secondary;
-      margin-left: 16px;
-      margin-bottom: 6px;
-      width: auto;
-      padding: 0px;
-      height: 24px;
-    }
-
-    .effect-period {
-      margin-top: 4px;
-      font-size: 14px;
-      font-weight: 400;
-      width: 100%;
+      font-size: 20px;
+      margin-bottom: 14px;
     }
   }
 
-  .associate-alert-button {
-    color: $text-link-primary;
-    font-family: Inter;
-    font-size: 20;
-    font-weight: 500;
-    height: 30px;
-    margin-bottom: 8px;
-  }
-
   input[type="time"],
   input[type="date"] {
     position: relative;

assets/css/dashboard/new-pa-message/new-pa-message.scss

@@ -13,6 +13,23 @@
     font-weight: 500;
     line-height: 48px;
     text-align: left;
+    display: flex;
+  }
+
+  .paused-pill {
+    padding: 8px 16px;
+    margin-left: 16px;
+    background-color: $theme-secondary;
+    border-radius: 200px;
+    height: 40px;
+    align-self: center;
+    font-size: 24px;
+    line-height: 24px;
+    text-align: center;
+
+    text {
+      position: relative;
+    }
   }
 
   .cancel-button {