From 3a0293c0565ecef1a18ceda2c09c8e0ec9220e96 Mon Sep 17 00:00:00 2001
From: Teemu Patja <tp@iki.fi>
Date: Fri, 27 Oct 2017 22:58:02 +0300
Subject: [PATCH] Enable github account UX

---
 src/cljs/commiteth/repos.cljs | 13 +++++++-----
 src/less/style.less           | 40 +++++++++++++++++++++++++++++++++++
 2 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/src/cljs/commiteth/repos.cljs b/src/cljs/commiteth/repos.cljs
index 0b2ae08..faf66b8 100644
--- a/src/cljs/commiteth/repos.cljs
+++ b/src/cljs/commiteth/repos.cljs
@@ -90,11 +90,14 @@
     (fn []
       (println "gh-admin-token" @gh-admin-token)
       (if (empty? @gh-admin-token)
-        [:div.ui.container
-         [:div.ui.warning.message
-          [:i.warning.icon]
-          "To set bounties for your repositories or for organizations' repositories where you have access, you need to grant Commit ETH the required permissions"]
-         [:a.ui.button.small {:href js/authorizeUrlAdmin} "Enable"]]
+        [:div.ui.container.enable-github-account
+         [:div.ui.center.aligned.segment.enable-github-account-title
+          "Work on bounties that suit you"]
+         [:div.ui.center.aligned.segment.enable-github-account-description
+          [:p
+           "Not all projects are created equally.  Choose the bounties that excite you, match your skill set or fit in with your schedule. No strings attached.  Enable your GitHub repositories to get started."]]
+         [:div.ui.center.aligned.segment
+          [:a.ui.button.small {:href js/authorizeUrlAdmin} "ENABLE GITHUB ACCOUNT"]]]
         (do
           (rf/dispatch [:load-user-repos])
           [repos-page-token-ok])))))
diff --git a/src/less/style.less b/src/less/style.less
index e2553fb..fc7d7bf 100644
--- a/src/less/style.less
+++ b/src/less/style.less
@@ -210,6 +210,46 @@
     margin-bottom: 1.5em;
 }
 
+.enable-github-account {
+    border-radius: 10px;
+    background-color: #fff;
+    transform: translateY(-30px);
+    padding-top: 80px;
+    padding-bottom: 80px;
+    .center.aligned.segment { border: 0; }
+
+
+    .button {
+        font-size: 13px;
+        font-weight: 500;
+	    line-height: 1.15;
+	    letter-spacing: 1px;
+    }
+}
+
+
+.enable-github-account-title {
+    color: #42505c;
+    font-family: 'postgrotesk-medium';
+    font-size: 25px;
+    font-weight: 500;
+	line-height: 1.36;
+    margin-bottom: 0!important;
+    padding-bottom: 0!important;
+}
+
+.enable-github-account-description {
+    p {
+        color: #8d99a4;
+        margin-left: 180px;
+        margin-right: 180px;
+        line-height: 1.39;
+        font-family: 'postgrotesk';
+        font-size: 18px;
+        text-align: center;
+    }
+}
+
 .repo-label {
     color: #42505c;
     font-family: 'postgrotesk-medium';