diff --git a/styles/sections/_task_order.scss b/styles/sections/_task_order.scss
index b63d064f..9e2956a7 100644
--- a/styles/sections/_task_order.scss
+++ b/styles/sections/_task_order.scss
@@ -258,8 +258,23 @@
}
}
- .alert {
+ .input--disabled {
+ label .usa-input__title {
+ color: $color-gray-light;
+ }
+
+ input[type="text"]:disabled {
+ color: $color-gray-lighter;
+ font-style: italic;
+ }
+ }
+
+ .task-order__invite-officer {
padding: 1.5rem;
+ background-color: $color-aqua-lightest;
+ border-color: $color-blue;
+ border-left-style: solid;
+ border-left-width: $gap / 2;
.usa-input {
width: 100%;
diff --git a/templates/components/text_input.html b/templates/components/text_input.html
index 210c8178..97797983 100644
--- a/templates/components/text_input.html
+++ b/templates/components/text_input.html
@@ -12,6 +12,7 @@
paragraph=False,
disabled=False,
initial_value='',
+ classes='',
noMaxWidth=False) -%}
@@ -30,7 +30,7 @@
{{ UserInfo(form.cor_first_name, form.cor_last_name, form.cor_email, form.cor_phone_number) }}
{{ CheckboxInput(form.cor_invite) }}
- {{ TextInput(form.cor_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId')}}
+ {{ TextInput(form.cor_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
@@ -41,7 +41,7 @@
{{ UserInfo(form.so_first_name, form.so_last_name, form.so_email, form.so_phone_number) }}
{{ CheckboxInput(form.so_invite) }}
- {{ TextInput(form.so_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId')}}
+ {{ TextInput(form.so_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
diff --git a/templates/task_orders/new/review.html b/templates/task_orders/new/review.html
index 988a9f65..bfd90827 100644
--- a/templates/task_orders/new/review.html
+++ b/templates/task_orders/new/review.html
@@ -118,8 +118,10 @@
{{ Icon('download') }} {{ "task_orders.new.review.usage_est_link"| translate }}
+ {{ Icon('download') }} {{ "task_orders.new.review.usage_est_link"| translate }}
+ {{ Icon('alert', classes='icon--red') }}
+