New dashboard layout

This commit is contained in:
Eduard Urbach 2017-07-09 04:22:14 +02:00
parent e929451c88
commit 34d85e5bd1
11 changed files with 101 additions and 46 deletions

View File

@ -1,5 +1,5 @@
component AnimeListItem(viewUser *arn.User, item *arn.AnimeListItem, anime *arn.Anime)
.widgets.mountable
.widget-form.mountable
.widget.anime-list-item-view(data-api="/api/animelist/" + viewUser.ID + "/update/" + anime.ID)
h1= anime.Title.Canonical

View File

@ -28,14 +28,14 @@ component Dashboard(schedule []*arn.UpcomingEpisode, posts []arn.Postable, sound
.widget-element-text
Icon(arn.GetForumIcon(post.Thread().Tags[0]))
span= post.Thread().Title
.widget.mountable
h3.widget-title Groups
h3.widget-title Artworks
for i := 1; i <= 5; i++
.widget-element
.widget-element-text
Icon("group")
Icon("paint-brush")
span ...
.widget.mountable
@ -52,7 +52,25 @@ component Dashboard(schedule []*arn.UpcomingEpisode, posts []arn.Postable, sound
.widget-element-text
Icon("music")
span ...
.widget.mountable
h3.widget-title AMVs
for i := 1; i <= 5; i++
.widget-element
.widget-element-text
Icon("video-camera")
span ...
.widget.mountable
h3.widget-title Groups
for i := 1; i <= 5; i++
.widget-element
.widget-element-text
Icon("group")
span ...
.widget.mountable
h3.widget-title Contacts

View File

@ -1,13 +1,15 @@
component ImportLists(user *arn.User)
.buttons.buttons-vertical
if user.Accounts.AniList.Nick != ""
.widget-input
a.button.mountable.ajax(href="/import/anilist/animelist")
Icon("download")
span Import AniList
if user.Accounts.MyAnimeList.Nick != ""
.widget-input
a.button.mountable.ajax(href="/import/myanimelist/animelist")
Icon("download")
span Import MyAnimeList
if user.Accounts.AniList.Nick != ""
label AniList:
.widget-input
a.button.mountable.ajax(href="/import/anilist/animelist")
Icon("download")
span Import AniList
if user.Accounts.MyAnimeList.Nick != ""
label MyAnimeList:
.widget-input
a.button.mountable.ajax(href="/import/myanimelist/animelist")
Icon("download")
span Import MyAnimeList

View File

@ -1,5 +1,5 @@
component NewSoundTrack(user *arn.User)
.widgets
.widget-form
.widget
h1 New soundtrack

View File

@ -1,5 +1,5 @@
component NewThread(user *arn.User)
.widgets
.widget-form
.widget
input#title.widget-element(type="text", placeholder="Title")
@ -15,6 +15,7 @@ component NewThread(user *arn.User)
if user.Role == "admin"
option(value="update") Update
button.action(data-action="createThread", data-trigger="click")
Icon("check")
span Create thread
.buttons
button.action(data-action="createThread", data-trigger="click")
Icon("check")
span Create thread

View File

@ -87,7 +87,8 @@ profile-boot-duration = 2s
margin-bottom 1rem
.no-data
text-align center
width 100%
text-align left
// Categories

View File

@ -3,7 +3,10 @@ component SearchResults(term string, users []*arn.User, animeResults []*arn.Anim
.widgets
.widget
h3 Users
h3.widget-title
Icon("user")
span Users
.user-avatars.user-search
if len(users) == 0
p.no-data.mountable No users found.
@ -14,11 +17,28 @@ component SearchResults(term string, users []*arn.User, animeResults []*arn.Anim
//- a.ajax(href=user.Link())= user.Nick
.widget
h3 Anime
h3.widget-title
Icon("tv")
span Anime
.profile-watching-list.anime-search
if len(animeResults) == 0
p.no-data.mountable No anime found.
else
each anime in animeResults
a.profile-watching-list-item.mountable.ajax(href=anime.Link(), title=anime.Title.Canonical, data-mountable-type="anime")
img.anime-cover-image.anime-search-result(src=anime.Image.Tiny, alt=anime.Title.Canonical)
img.anime-cover-image.anime-search-result(src=anime.Image.Tiny, alt=anime.Title.Canonical)
.widget
h3.widget-title
Icon("comment")
span Forums
p.no-data.mountable Forums search coming soon.
.widget
h3.widget-title
Icon("music")
span Soundtracks
p.no-data.mountable Soundtrack search coming soon.

View File

@ -51,7 +51,7 @@ component Settings(user *arn.User)
.widget.mountable
h3.widget-title
Icon("refresh")
Icon("download")
span Import
ImportLists(user)
@ -61,7 +61,8 @@ component Settings(user *arn.User)
Icon("puzzle-piece")
span Extensions
.buttons
.widget-input
label Chrome Extension:
button.action(data-action="installExtension", data-trigger="click")
Icon("chrome")
span Get the Chrome Extension

View File

@ -1,2 +1,4 @@
.social-account-button
margin-bottom 1rem
.widget-input
button,
.button
margin-bottom 1rem

View File

@ -67,4 +67,4 @@ typography-margin = 0.4rem
// Timings
fade-speed = 200ms
transition-speed = 250ms
mountable-transition-speed = 400ms
mountable-transition-speed = 300ms

View File

@ -1,21 +1,23 @@
.widgets
horizontal-wrap
justify-content space-around
display grid
grid-template-columns 1fr
> 810px
.widgets
grid-template-columns repeat(2, 1fr)
grid-gap content-padding
> 1240px
.widgets
grid-template-columns repeat(3, 1fr)
> 1640px
.widgets
grid-template-columns repeat(4, 1fr)
.widget
vertical
align-items center
width 100%
padding 0.25rem
max-width 400px
> 1240px
.widget
max-width 30vw
< 810px
.widget
max-width 600px
margin-bottom content-padding
.widget-element
vertical-wrap
@ -24,7 +26,7 @@
margin-bottom 1rem
padding 0.5rem 1rem
width 100%
max-width 700px
// max-width 700px
.widget-element-text
horizontal
@ -38,5 +40,13 @@
width 100%
.widget-title
text-align left
padding-bottom 0.5rem
border-bottom 1px solid rgba(0, 0, 0, 0.1)
// We need !important here to overwrite the h3:first-child rule
margin 1rem 0 !important
margin 1rem 0 !important
.widget-form
width 100%
max-width 650px
margin 0 auto