Open bounties view SOB UX changes

This commit is contained in:
Teemu Patja 2017-10-29 17:08:54 +02:00
parent a4318cb2f0
commit fa3eeabd4d
No known key found for this signature in database
GPG Key ID: F5B7035E6580FD4C
2 changed files with 114 additions and 12 deletions

View File

@ -5,7 +5,7 @@
(defn bounty-item [bounty]
(let [{avatar-url :avatar-url
(let [{avatar-url :repo_owner_avatar_url
owner :repo-owner
repo-name :repo-name
issue-title :issue-title
@ -15,27 +15,32 @@
balance-eth :balance-eth
value-usd :value-usd} bounty
full-repo (str owner "/" repo-name)
repo-url (str "https://github.com/" full-repo)
repo-link [:a {:href repo-url} full-repo]
issue-link [:a
{:href (issue-url owner repo-name issue-number)}
issue-title]]
[:div.item.activity-item
[:div.ui.mini.circular.image
[:img {:src avatar-url}]]
[:div.content
[:div.header.display-name full-repo]
[:div.description
issue-link
(str " (USD " value-usd ")")]
[:div.open-bounty-item
[:div.open-bounty-item-content
[:div.header issue-link]
[:div.bounty-item-row
[:div.time (moment-timestamp updated)]
[:span.bounty-repo-label repo-link]]
[:div.footer-row
[:div.balance-badge "ETH " balance-eth]
(for [[tla balance] tokens]
^{:key (random-uuid)}
[:div.balance-badge.token
(str (subs (str tla) 1) " " balance)])
[:div.time (moment-timestamp updated)]]]]))
[:span.usd-value-label "Value "] [:span.usd-balance-label (str "$" value-usd)]]]
[:div.open-bounty-item-icon
[:div.ui.tiny.circular.image
[:img {:src avatar-url}]]]]))
(defn bounties-list [open-bounties]
[:div.ui.container.activity-container
[:div.ui.container.open-bounties-container
[:div.open-bounties-header "Bounties"]
(if (empty? open-bounties)
[:div.ui.text "No data"]
(into [:div.ui.items]

View File

@ -292,6 +292,103 @@
cursor: default;
}
.open-bounties-container {
background-color: #fff;
border-radius: 10px;
transform: translateY(-45px);
padding: 24px;
.open-bounties-header {
font-family: "PostGrotesk-Medium";
font-size: 21px;
font-weight: 500;
color: #42505c;
}
}
.open-bounty-item {
background-color: #fff;
display: flex;
flex-direction: row !important;
justify-content: space-between;
.left-column {
margin: 0;
padding-left: 12px;
padding-top: 12px;
width: 100px!important;
.ui.image {
position: relative;
width: 48px;
height: 48px;
margin: 0;
padding: 0;
top: 0;
left: 0;
}
}
.time {
color: #42505c !important;
opacity: 0.9 !important;
font-family: "PostGrotesk-Book";
font-size: 15px;
}
border-bottom: #eaecee 1px solid !important;
padding: 0.8em 1em 1.1em!important;
margin: 1em;
.open-bounty-item-content {
width: 80%;
padding: .7em 0 1em;
font-family: "PostGrotesk-Book";
line-height: 2em;
min-width: 160px!important;
.header a {
font-family: "PostGrotesk-Medium" !important;
font-size: 18px !important;
font-weight: 500 !important;
line-height: 1.67 !important;
text-align: left !important;
color: #42505c !important;
}
}
.open-bounty-item-icon {
align: right;
padding-top: 30px;
width: 56px;
}
}
.bounty-item-row {
display: flex;
flex-direction: row !important;
justify-content: space-between;
width: 80%;
}
.bounty-repo-label a {
margin: auto;
font-family: "PostGrotesk-Book";
font-size: 15px;
color: #8d99a4;
}
.usd-value-label {
padding-left: 5px;
font-size: 15px;
color: #8d99a4;
}
.usd-balance-label {
font-size: 15px;
color: #42505c;
}
.activity-item-container {
padding: 1em;
@ -406,7 +503,7 @@
min-height: 0;
line-height: 2em;
display: table;
padding: 0 .5em 0;
padding: 0 10px 0;
letter-spacing: 1px;
border-radius: 8px;