From bb207806ee309ca3401a2ceefa8fe80355f26183 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 26 Jul 2018 12:24:49 -0400 Subject: [PATCH] Request approval UI and styles --- scss/atat.scss | 1 + scss/sections/_request_approval.scss | 97 ++++++++++++++ templates/request_approval.html.to | 186 +++++++++++++++++++++++++++ templates/requests.html.to | 7 +- 4 files changed, 289 insertions(+), 2 deletions(-) create mode 100644 scss/sections/_request_approval.scss create mode 100644 templates/request_approval.html.to diff --git a/scss/atat.scss b/scss/atat.scss index e3ab7868..e282ef53 100644 --- a/scss/atat.scss +++ b/scss/atat.scss @@ -27,3 +27,4 @@ @import 'components/progress_menu.scss'; @import 'sections/login'; +@import 'sections/request_approval'; diff --git a/scss/sections/_request_approval.scss b/scss/sections/_request_approval.scss new file mode 100644 index 00000000..5769d5d9 --- /dev/null +++ b/scss/sections/_request_approval.scss @@ -0,0 +1,97 @@ +.request-approval { + .request-approval__heading { + display: flex; + flex-direction: row; + align-items: center; + } + + .request-approval__info-columns { + flex-wrap: wrap; + + .col { + flex-basis: 100%; + + @include media($medium-screen) { + flex-basis: 50%; + + &:first-child { + padding-right: $gap * 2; + } + &:last-child { + padding-left: $gap * 2; + } + } + } + } + + .request-approval__columns__heading { + &:first-child { + @include media($medium-screen) { + margin-top: 0; + } + } + } + + .approval-log { + ol { + list-style: none; + margin: 0; + padding: 0; + + li { + padding: $gap * 2; + border-top: 1px dashed $color-gray-light; + + &:first-child { + border-top-style: solid; + } + + @include media($medium-screen) { + padding: $gap * 4; + } + } + } + .approval-log__log-item { + display: flex; + flex-direction: column-reverse; + justify-content: flex-end; + + @include media($medium-screen) { + flex-direction: row-reverse; + } + + .approval-log__log-item__header { + @include h4; + margin: 0 0 $gap 0; + } + + .approval-log__log-item__timestamp { + @include h5; + margin-right: $gap * 2; + color: $color-gray; + flex-grow: 0; + + @include media($large-screen) { + margin-right: $gap * 4; + } + } + + .approval-log__behalfs { + display: flex; + flex-direction: row; + + .approval-log__behalf { + margin-right: $gap * 2; + + @include media($medium-screen) { + margin-right: $gap * 4; + } + + span { + display: block; + } + } + } + } + } +} diff --git a/templates/request_approval.html.to b/templates/request_approval.html.to new file mode 100644 index 00000000..db81049a --- /dev/null +++ b/templates/request_approval.html.to @@ -0,0 +1,186 @@ +{% extends "base.html.to" %} + +{% block content %} + +
+ {# A {% module Alert() %} goes here, if alerting be needed #} + +
+
+
+

Request #1234567890

+ Pending +
+ +
+

Ongoing maintainence for Death Star (a moon-sized Imperial military battlestation armed with a planet-destroying superlaser). Its definitely hasn't been sabotaged from the start.

+
+
+

Information About Requestor

+
+
+
Name
+
Firmus Piett
+
+ +
+
E-mail
+
piett@empire.mil
+
+ +
+
Phone Number
+
(123) 456-7890
+
+ +
+
Location
+
Death Star
+
+
+
+ +
+

Funding Information

+
+
+
Task Order Number
+
4523542345322345234
+
+ +
+
Funding Type
+
Previously: Modest Destructive Power
+
Changed to: Absolute Destructive Power
+
+
+
+
+
+
+ +
+
+

Approval Log

+
+
+
+
    +
  1. +
    +
    +

    Denied by Darth Vader

    +

    "You have failed me for the last time, Admiral. Captain Piett. Yes, my lord. Make ready to land out troops beyond the energy shield and deploy the fleet so that nothing gets off that system."

    + +
    +
    +

    Mission Owner approval on behalf of:

    + Grand Moff Tarkin + tarkin@empire.mil + (234) 567-8901 +
    + +
    +

    CCPO approval on behalf of:

    + Emperor Palpatine + palpatine@empire.mil + (345) 678-9012 +
    +
    +
    + +
    +
    +
    2. + + +
  2. +
    +
    +

    Denied by Darth Vader

    +

    "You have failed me for the last time, Admiral. Captain Piett. Yes, my lord. Make ready to land out troops beyond the energy shield and deploy the fleet so that nothing gets off that system."

    + +
    +
    +

    Mission Owner approval on behalf of:

    + Grand Moff Tarkin + tarkin@empire.mil + (234) 567-8901 +
    + +
    +

    CCPO approval on behalf of:

    + Emperor Palpatine + palpatine@empire.mil + (345) 678-9012 +
    +
    +
    + +
    +
    +
    3. +
+
+
+
+ +
+
+

Here is some good text explaining what the CCPO needs to do in order to approve the request. This text should also explain why we are asking for multiple people's names and the risk of boiling the ocean.

+ + {# All instances of .usa-input groups here should be replaced with {% module TextInput(wtforms.fields.Field) %} #} + +
+ + +
+ +
+
+
+ + +
+ +
+ + +
+ +
+ + +
+
+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+
+
+
+
+ +
+ Approve Request + Deny Request + Cancel +
+
+
+ +{% end %} + diff --git a/templates/requests.html.to b/templates/requests.html.to index 2f873e64..3d420a88 100644 --- a/templates/requests.html.to +++ b/templates/requests.html.to @@ -22,7 +22,7 @@ - +
@@ -47,7 +47,10 @@ - + {% end %}
{{ r['full_name'] }} {{ r['app_count'] }} {{ r['status'] }}Download + Download + Approval +