web/notify.moe
Code Issues Pull Requests Activity

Make user lists use the new card design

Browse Source
This commit is contained in:
Eduard Urbach 2019-08-28 11:24:39 +09:00
parent bc4e67f718
commit cacaf335ee
Signed by: akyoto
GPG Key ID: C874F672B1AF20C0
10 changed files with 28 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
mixins/UserCard.pixy
View File

@ -1,5 +1,5 @@
component UserCard(user *arn.User, note string)
a.user-card(href=user.Link(), data-pro=user.IsPro())
a.user-card.mountable(href=user.Link(), data-pro=user.IsPro())
.user-card-avatar
AvatarNoLink(user)
.user-card-info

17
pages/users/editors.pixy
View File

@ -2,20 +2,9 @@ component EditorRankingList(users []*arn.User, idToScore map[string]int, url str
h1.page-title Editor ranking list
UsersTabs(url)
table.ranking-list
thead
tr.mountable
th #
th User
th.ranking-score Score
tbody
for index, user := range users
tr.ranking.mountable
td= fmt.Sprint(index + 1) + "."
td.ranking-user
Avatar(user)
a.ranking-user-nick(href=user.Link())= user.Nick
td.ranking-score= idToScore[user.ID]
.user-cards
each user in users
UserCard(user, fmt.Sprintf("%s points", humanize.Comma(int64(idToScore[user.ID]))))
.footer.mountable
p Score is generated from new data submissions and data fixes.

21
pages/users/ffxiv.pixy
View File

@ -2,22 +2,7 @@ component FinalFantasyXIVRankingList(users []*arn.User, url string)
h1.page-title Final Fantasy XIV ranking list
UsersTabs(url)
table.ranking-list
thead
tr.mountable
th #
th Player
th.ranking-class Class
th.ranking-level Level
th.ranking-score Item Level
tbody
for index, user := range users
tr.ranking.mountable
td= fmt.Sprint(index + 1) + "."
td.ranking-user
Avatar(user)
a.ranking-user-nick(href=user.Link())= user.Nick
td.ranking-class= user.Accounts.FinalFantasyXIV.Class
td.ranking-level= strconv.Itoa(user.Accounts.FinalFantasyXIV.Level)
td.ranking-score= strconv.Itoa(user.Accounts.FinalFantasyXIV.ItemLevel)
.user-cards
each user in users
UserCard(user, fmt.Sprintf("%s (iLvl %d)", user.Accounts.FinalFantasyXIV.Class, user.Accounts.FinalFantasyXIV.ItemLevel))

19
pages/users/osu.pixy
View File

@ -2,20 +2,7 @@ component OsuRankingList(users []*arn.User, url string)
h1.page-title osu! ranking list
UsersTabs(url)
table.ranking-list
thead
tr.mountable
th #
th Player
th.ranking-score Performance
th.ranking-accuracy Accuracy
tbody
for index, user := range users
tr.ranking.mountable
td= fmt.Sprint(index + 1) + "."
td.ranking-user
Avatar(user)
a.ranking-user-nick(href=user.Link())= user.Nick
td.ranking-score= fmt.Sprint(int(user.Accounts.Osu.PP + 0.5)) + " pp"
td.ranking-accuracy= fmt.Sprintf("%.1f", user.Accounts.Osu.Accuracy) + "%"
.user-cards
each user in users
UserCard(user, fmt.Sprintf("%s pp (%.1f%%)", humanize.Comma(int64(user.Accounts.Osu.PP + 0.5)), user.Accounts.Osu.Accuracy))

19
pages/users/overwatch.pixy
View File

@ -2,20 +2,7 @@ component OverwatchRankingList(users []*arn.User, url string)
h1.page-title Overwatch ranking list
UsersTabs(url)
table.ranking-list
thead
tr.mountable
th #
th Player
th.ranking-tier Tier
th.ranking-score Rating
tbody
for index, user := range users
tr.ranking.mountable
td= fmt.Sprint(index + 1) + "."
td.ranking-user
Avatar(user)
a.ranking-user-nick(href=user.Link())= user.Nick
td.ranking-tier= strings.Title(user.Accounts.Overwatch.Tier)
td.ranking-score= strconv.Itoa(user.Accounts.Overwatch.SkillRating) + " SR"
.user-cards
each user in users
UserCard(user, fmt.Sprintf("%s (%d SR)", strings.Title(user.Accounts.Overwatch.Tier), user.Accounts.Overwatch.SkillRating))

27
pages/users/ranking.scarlet
View File

@ -1,27 +0,0 @@
.ranking-list
width auto
.ranking
width 100%
td
vertical-align middle
.ranking-user
horizontal
align-items center
.user-image
width calc(avatar-size / 2)
height calc(avatar-size / 2)
.user-pro-icon
font-size calc(user-pro-icon-size / 2)
.ranking-user-nick
margin-left 0.8rem
.ranking-score,
.ranking-accuracy,
.ranking-level
text-align right

9
pages/users/user-cards.scarlet
View File

@ -10,14 +10,16 @@ const user-card-padding = 1rem
padding user-card-padding
margin 0.4rem
width 100%
box-shadow shadow-light
height calc(avatar-size + user-card-padding * 2)
:hover
box-shadow shadow-medium
border 1px solid input-focus-border-color
// TODO: Replace with alpha(main-color, 20%) function
box-shadow 0 0 6px rgba(248, 165, 130, 0.2)
> 600px
.user-card
max-width 200px
max-width 230px
.user-card-avatar
.user-image
@ -33,6 +35,7 @@ const user-card-padding = 1rem
clip-long-text
.user-card-note
clip-long-text
color text-color
text-shadow none
opacity 0.5

12
pages/users/users.go
View File

@ -97,10 +97,6 @@ func Osu(ctx aero.Context) error {
return users[i].Accounts.Osu.PP > users[j].Accounts.Osu.PP
})
if len(users) > 10 {
users = users[:10]
}
return ctx.HTML(components.OsuRankingList(users, ctx.Path()))
}
@ -115,10 +111,6 @@ func Overwatch(ctx aero.Context) error {
return users[i].Accounts.Overwatch.SkillRating > users[j].Accounts.Overwatch.SkillRating
})
if len(users) > 10 {
users = users[:10]
}
return ctx.HTML(components.OverwatchRankingList(users, ctx.Path()))
}
@ -133,10 +125,6 @@ func FFXIV(ctx aero.Context) error {
return users[i].Accounts.FinalFantasyXIV.ItemLevel > users[j].Accounts.FinalFantasyXIV.ItemLevel
})
if len(users) > 10 {
users = users[:10]
}
return ctx.HTML(components.FinalFantasyXIVRankingList(users, ctx.Path()))
}

16
pages/users/users.pixy
View File

@ -2,7 +2,7 @@ component Users(users []*arn.User, followerCount map[string]int, url string)
h1.page-title Users
UsersTabs(url)
.user-cards.mountable
.user-cards
each user in users
UserCard(user, stringutils.Plural(followerCount[user.ID], "follower"))
@ -12,7 +12,7 @@ component UsersByCountry(users []*arn.User, followerCount map[string]int, countr
else
h1= "Users in " + users[0].Location.CountryName
.user-cards.mountable
.user-cards
each user in users
UserCard(user, stringutils.Plural(followerCount[user.ID], "follower"))
@ -20,12 +20,9 @@ component ProUsers(users []*arn.User, url string)
h1.page-title Supporters
UsersTabs(url)
.pro-avatars
.user-cards
each user in users
a.profile-image-container.mountable(href=user.Link())
ProfileImage(user)
.image-title
.image-title-text= user.Nick
UserCard(user, "until " + user.ProExpires[:10])
.footer.mountable
p We are thankful to everyone supporting the site!
@ -37,10 +34,9 @@ component UserLists(groups []*utils.UserList, url string)
each group in groups
h3.user-list-name.mountable= group.Name
.user-avatars
.user-cards
each user in group.Users
.mountable
Avatar(user)
UserCard(user, stringutils.Capitalize(user.Role))
component StaffRecruitment
.footer.mountable

17
pages/users/users.scarlet
View File

@ -6,23 +6,6 @@
.user
margin 0.4rem
.pro-avatars
horizontal-wrap
justify-content center
.profile-image-container
flex-basis 170px
flex-grow 0
height 230px
margin content-padding-half
position relative
border ui-border
box-shadow shadow-light
:hover
.image-title
opacity 1
.user
display flex
position relative