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';