From f8f1ad644ca0fb6115e237da8dd532a6848794f6 Mon Sep 17 00:00:00 2001
From: Sebastian Kippe <sebastian@kip.pe>
Date: Thu, 5 Sep 2019 11:36:50 +0200
Subject: [PATCH] WIP: vetoed contribution details

Adds a blurb and resubmit button to the detail view for vetoed
contributions.
---
 app/components/icon-warning/component.js      |  5 ++
 app/components/icon-warning/template.hbs      | 15 ++++
 .../components/_contribution-details.scss     | 33 ++++++++-
 .../dashboard/contributions/show.hbs          | 16 ++++-
 warning.svg                                   | 71 +++++++++++++++++++
 5 files changed, 138 insertions(+), 2 deletions(-)
 create mode 100644 app/components/icon-warning/component.js
 create mode 100644 app/components/icon-warning/template.hbs
 create mode 100644 warning.svg

diff --git a/app/components/icon-warning/component.js b/app/components/icon-warning/component.js
new file mode 100644
index 0000000..6858137
--- /dev/null
+++ b/app/components/icon-warning/component.js
@@ -0,0 +1,5 @@
+import Component from '@ember/component';
+
+export default Component.extend({
+  tagName: ""
+});
diff --git a/app/components/icon-warning/template.hbs b/app/components/icon-warning/template.hbs
new file mode 100644
index 0000000..d4d53d6
--- /dev/null
+++ b/app/components/icon-warning/template.hbs
@@ -0,0 +1,15 @@
+<svg width="60px" height="60px" version="1.1" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+  <g fill="none" fill-rule="evenodd">
+    <g transform="translate(-479,-238)" stroke="#fbe468" stroke-linecap="round" stroke-linejoin="round" stroke-width="1">
+      <g transform="translate(482,244)">
+        <a transform="translate(0,2)">
+          <polygon id="Triangle-58" points="0.15321 44 27 0 53.847 44"/>
+        </a>
+        <rect x="25" y="13" width="4" height="21"/>
+        <a transform="translate(0,2)">
+          <circle cx="27" cy="38" r="2"/>
+        </a>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/app/styles/components/_contribution-details.scss b/app/styles/components/_contribution-details.scss
index d10e146..80c04b6 100644
--- a/app/styles/components/_contribution-details.scss
+++ b/app/styles/components/_contribution-details.scss
@@ -41,7 +41,7 @@ section#contribution-details {
       }
     }
 
-    a {
+    a:not(.button) {
       color: $primary-color;
       text-decoration: none;
 
@@ -54,4 +54,35 @@ section#contribution-details {
   .actions {
     text-align: center;
   }
+
+  &.vetoed {
+    .content {
+      h3 {
+        text-decoration: line-through;
+      }
+    }
+  }
+
+  .hint.vetoed {
+    overflow: auto;
+    margin-top: 2rem;
+    padding-top: 2rem;
+    border-top: 1px solid rgba(255,255,255,0.2);
+    font-size: 1.2rem;
+
+    .icon {
+      display: inline-block;
+      width: 40px;
+      height: 40px;
+      float: left;
+      margin-right: 1rem;
+      margin-bottom: 1rem;
+
+      svg {
+        width: 100%;
+        height: auto;
+      }
+    }
+  }
+
 }
diff --git a/app/templates/dashboard/contributions/show.hbs b/app/templates/dashboard/contributions/show.hbs
index 9dcc8cd..3dab7ec 100644
--- a/app/templates/dashboard/contributions/show.hbs
+++ b/app/templates/dashboard/contributions/show.hbs
@@ -1,4 +1,4 @@
-<section id="contribution-details">
+<section id="contribution-details" class={{if model.vetoed "vetoed"}}>
   <header class="with-nav">
     <h2>Contribution #{{model.id}}</h2>
     <nav>
@@ -32,6 +32,20 @@
         </a>
       </p>
     {{/if}}
+    {{#if model.vetoed}}
+      <div class="hint vetoed">
+        <div class="icon">
+          {{icon-warning}}
+        </div>
+        <p>
+          This contribution has been vetoed, meaning no
+          kredits will be issued.
+        </p>
+        <p>
+          {{link-to "Re-submit contribution" "signup" class="button small green"}}.
+        </p>
+      </div>
+    {{/if}}
   </div>
 
   <div class="actions">
diff --git a/warning.svg b/warning.svg
new file mode 100644
index 0000000..73231ed
--- /dev/null
+++ b/warning.svg
@@ -0,0 +1,71 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   id="svg15"
+   version="1.1"
+   viewBox="0 0 60 60"
+   height="60px"
+   width="60px">
+  <metadata
+     id="metadata19">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>Warning</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
+  <title
+     id="title2">Warning</title>
+  <desc
+     id="desc4">Created with Sketch.</desc>
+  <defs
+     id="defs6" />
+  <g
+     style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1"
+     sketch:type="MSPage"
+     id="stroked">
+    <g
+       style="stroke:#535353;stroke-width:2;stroke-linecap:round;stroke-linejoin:round"
+       transform="translate(-479,-238)"
+       sketch:type="MSLayerGroup"
+       id="Transport">
+      <g
+         sketch:type="MSShapeGroup"
+         transform="translate(482,244)"
+         id="Warning">
+        <a
+           transform="translate(0,2)"
+           id="a4529">
+          <polygon
+             id="Triangle-58"
+             points="0.15321248,44 27,0 53.846787,44 " />
+        </a>
+        <rect
+           height="21"
+           width="4"
+           y="13"
+           x="25"
+           id="Rectangle-1700" />
+        <a
+           transform="translate(0,2)"
+           id="a4532">
+          <circle
+             id="Oval-1484"
+             cx="27"
+             cy="38"
+             r="2" />
+        </a>
+      </g>
+    </g>
+  </g>
+</svg>