web/notify.moe
Code Issues Pull Requests Activity

Started working on dark theme

Browse Source
This commit is contained in:
Eduard Urbach 2017-11-03 09:34:21 +01:00
parent 6ec1cd5692
commit 2b51baf236
19 changed files with 155 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
config.json
View File

@ -6,6 +6,7 @@
],
"styles": [
"include/config",
"include/dark",
"include/mixins",
"reset",
"base",

12
layout/layout.pixy
View File

@ -23,12 +23,14 @@ component Layout(app *aero.Application, ctx *aero.Context, user *arn.User, openG
//- #header
//- Navigation(user)
#columns
aside#sidebar
Sidebar(user)
#content-container
main#content.fade!= content
Sidebar(user)
Content(content)
LoadingAnimation
StatusMessage
if user != nil
#user(data-id=user.ID)
script(src="/scripts")
script(src="/scripts")
component Content(content string)
#content-container
main#content.fade!= content

1
main.go
View File

@ -100,7 +100,6 @@ func configure(app *aero.Application) *aero.Application {
app.Ajax("/users", users.Active)
app.Ajax("/users/osu", users.Osu)
app.Ajax("/users/staff", users.Staff)
app.Ajax("/users/anime/watching", users.AnimeWatching)
app.Ajax("/statistics", statistics.Get)
app.Ajax("/statistics/anime", statistics.Anime)
app.Ajax("/login", login.Get)

85
mixins/Sidebar.pixy
View File

@ -1,56 +1,57 @@
component Sidebar(user *arn.User)
.user-image-container
aside#sidebar
.user-image-container
if user != nil
Avatar(user)
else
img.user-image.lazy(src=utils.EmptyImage(), data-src="/images/brand/64.png", data-webp="true", alt="Anime Notifier")
if user != nil
Avatar(user)
SidebarButton("Home", "/animelist/watching", "home")
SidebarButton("Dash", "/dashboard", "tachometer")
else
img.user-image.lazy(src=utils.EmptyImage(), data-src="/images/brand/64.png", data-webp="true", alt="Anime Notifier")
if user != nil
SidebarButton("Home", "/animelist/watching", "home")
SidebarButton("Dash", "/dashboard", "tachometer")
else
SidebarButton("Home", "/", "home")
SidebarButton("Forum", "/forum", "comment")
SidebarButton("Explore", "/explore", "th")
//- SidebarButton("Artworks", "/artworks", "paint-brush")
SidebarButton("Soundtracks", "/soundtracks", "headphones")
//- SidebarButton("AMVs", "/amvs", "video-camera")
//- SidebarButton("Games", "/games", "gamepad")
SidebarButton("Users", "/users", "globe")
//- SidebarButton("Search", "/search", "search")
if user != nil
if user.Role == "admin"
SidebarButton("Groups", "/groups", "users")
SidebarButton("Home", "/", "home")
SidebarButton("Shop", "/shop", "shopping-cart")
SidebarButton("Forum", "/forum", "comment")
SidebarButton("Explore", "/explore", "th")
//- SidebarButton("Artworks", "/artworks", "paint-brush")
SidebarButton("Soundtracks", "/soundtracks", "headphones")
//- SidebarButton("AMVs", "/amvs", "video-camera")
//- SidebarButton("Games", "/games", "gamepad")
SidebarButton("Users", "/users", "globe")
//- SidebarButton("Search", "/search", "search")
if user.Role == "admin" || user.Role == "editor"
SidebarButton("Statistics", "/statistics", "pie-chart")
if user != nil
if user.Role == "admin"
SidebarButton("Groups", "/groups", "users")
SidebarButton("Shop", "/shop", "shopping-cart")
SidebarButton("Settings", "/settings", "cog")
if user.Role == "admin" || user.Role == "editor"
SidebarButton("Statistics", "/statistics", "pie-chart")
.spacer
SidebarButton("Settings", "/settings", "cog")
.sidebar-link(aria-label="Search")
.sidebar-button
Icon("search")
FuzzySearch
.spacer
if user != nil
if user.Role == "admin"
SidebarButton("Admin", "/admin", "wrench")
if user.Role == "editor"
SidebarButton("Editor", "/editor", "pencil")
.sidebar-link(aria-label="Search")
.sidebar-button
Icon("search")
FuzzySearch
SidebarButton("Help", "/thread/I3MMiOtzR", "question-circle")
if user != nil
if user.Role == "admin"
SidebarButton("Admin", "/admin", "wrench")
if user.Role == "editor"
SidebarButton("Editor", "/editor", "pencil")
if user != nil
SidebarButtonNoAJAX("Logout", "/logout", "sign-out")
else
SidebarButton("Login", "/login", "sign-in")
SidebarButton("Help", "/thread/I3MMiOtzR", "question-circle")
if user != nil
SidebarButtonNoAJAX("Logout", "/logout", "sign-out")
else
SidebarButton("Login", "/login", "sign-in")
component SidebarButton(name string, target string, icon string)
a.sidebar-link.ajax(href=target, aria-label=name, data-bubble="true")

48
pages/admin/admin.go
View File

@ -1,16 +1,10 @@
package admin
import (
"time"
"github.com/aerogo/aero"
"github.com/animenotifier/arn"
"github.com/animenotifier/notify.moe/components"
"github.com/animenotifier/notify.moe/utils"
"github.com/shirou/gopsutil/cpu"
"github.com/shirou/gopsutil/disk"
"github.com/shirou/gopsutil/host"
"github.com/shirou/gopsutil/mem"
)
// Get admin page.
@ -21,40 +15,40 @@ func Get(ctx *aero.Context) string {
return ctx.Redirect("/")
}
// CPU
cpuUsage := 0.0
cpuUsages, err := cpu.Percent(1*time.Second, false)
// // CPU
// cpuUsage := 0.0
// cpuUsages, err := cpu.Percent(1*time.Second, false)
if err == nil {
cpuUsage = cpuUsages[0]
}
// if err == nil {
// cpuUsage = cpuUsages[0]
// }
// Memory
memUsage := 0.0
memInfo, _ := mem.VirtualMemory()
// // Memory
// memUsage := 0.0
// memInfo, _ := mem.VirtualMemory()
if err == nil {
memUsage = memInfo.UsedPercent
}
// if err == nil {
// memUsage = memInfo.UsedPercent
// }
// Disk
diskUsage := 0.0
diskInfo, err := disk.Usage("/")
// // Disk
// diskUsage := 0.0
// diskInfo, err := disk.Usage("/")
if err == nil {
diskUsage = diskInfo.UsedPercent
}
// if err == nil {
// diskUsage = diskInfo.UsedPercent
// }
// Host
platform, family, platformVersion, _ := host.PlatformInformation()
kernelVersion, err := host.KernelVersion()
kernelVersion, _ := host.KernelVersion()
return ctx.HTML(components.Admin(user, cpuUsage, memUsage, diskUsage, platform, family, platformVersion, kernelVersion))
return ctx.HTML(components.Admin(user, platform, family, platformVersion, kernelVersion))
}
func average(floatSlice []float64) float64 {
if len(floatSlice) == 0 {
return arn.DefaultAverageRating
return 0
}
var sum float64

40
pages/admin/admin.pixy
View File

@ -8,32 +8,32 @@ component AdminTabs
Icon("pencil")
span.tab-text Editor
component Admin(user *arn.User, cpuUsage, memUsage, diskUsage float64, platform, family, platformVersion, kernelVersion string)
component Admin(user *arn.User, platform, family, platformVersion, kernelVersion string)
h1.page-title Admin Panel
AdminTabs
.widgets
.widget.mountable
h3.widget-title Usage
//- .widget.mountable
//- h3.widget-title Usage
table
tbody
tr
td CPU usage:
td
span= int(cpuUsage + 0.5)
span %
tr
td Memory usage:
td
span= int(memUsage + 0.5)
span %
tr
td Disk usage:
td
span= int(diskUsage + 0.5)
span %
//- table
//- tbody
//- tr
//- td CPU usage:
//- td
//- span= int(cpuUsage + 0.5)
//- span %
//- tr
//- td Memory usage:
//- td
//- span= int(memUsage + 0.5)
//- span %
//- tr
//- td Disk usage:
//- td
//- span= int(diskUsage + 0.5)
//- span %
.widget.mountable
h3.widget-title OS

2
pages/anime/anime.scarlet
View File

@ -51,7 +51,7 @@
line-height content-line-height
.japanese
color rgba(60, 60, 60, 0.5) !important
color rgba(255, 255, 255, 0.5) !important
.anime-actions
horizontal

3
pages/soundtracks/soundtracks.scarlet
View File

@ -17,8 +17,9 @@
box-shadow shadow-light
.sound-track-footer
text-align right
text-align center
margin-bottom 1rem
margin-top 0.4rem
font-size 0.9em
span

19
pages/users/users.go
View File

@ -14,7 +14,11 @@ func Active(ctx *aero.Context) string {
return user.IsActive() && user.HasAvatar()
})
arn.SortUsersLastSeen(users)
sort.Slice(users, func(i, j int) bool {
return len(users[i].AnimeList().Watching().Items) > len(users[j].AnimeList().Watching().Items)
})
// arn.SortUsersLastSeen(users)
return ctx.HTML(components.Users(users))
}
@ -57,16 +61,3 @@ func Staff(ctx *aero.Context) string {
return ctx.HTML(components.Users(users))
}
// AnimeWatching ...
func AnimeWatching(ctx *aero.Context) string {
users := arn.FilterUsers(func(user *arn.User) bool {
return user.IsActive() && user.HasAvatar()
})
sort.Slice(users, func(i, j int) bool {
return len(users[i].AnimeList().Watching().Items) > len(users[j].AnimeList().Watching().Items)
})
return ctx.HTML(components.Users(users))
}

1
pages/users/users.pixy
View File

@ -11,6 +11,5 @@ component Users(users []*arn.User)
component UsersTabs
.tabs
Tab("Active", "users", "/users")
Tab("Watching", "tv", "/users/anime/watching")
Tab("Osu", "gamepad", "/users/osu")
Tab("Staff", "user-secret", "/users/staff")

1
styles/base.scarlet
View File

@ -18,6 +18,7 @@ a
:hover
color link-hover-color
text-shadow link-hover-text-shadow
text-decoration none
:active

5
styles/include/config.scarlet
View File

@ -1,10 +1,10 @@
// Colors
text-color = rgb(60, 60, 60)
bg-color = rgb(246, 246, 246)
main-color = rgb(248, 165, 130)
link-color = rgb(215, 38, 15)
link-hover-color = rgb(242, 60, 30)
link-active-color = link-hover-color
bg-color = rgb(246, 246, 246)
pro-color = hsla(0, 100%, 73%, 0.87)
// UI
@ -23,7 +23,8 @@ ui-element-border-radius = 3px
input-focus-border-color = rgb(248, 165, 130)
// Button
button-hover-color = link-hover-color
button-hover-color = white
button-hover-background = link-hover-color
forum-tag-hover-color = #225db5
// forum-tag-hover-color = rgb(46, 85, 160)

14
styles/include/dark.scarlet Normal file
View File

@ -0,0 +1,14 @@
// Dark theme
text-color = hsl(0, 0%, 90%)
bg-color = hsl(0, 0%, 24%)
link-color = hsl(81, 100%, 56%)
link-hover-color = hsl(81, 100%, 66%)
ui-background = hsl(0, 0%, 18%)
link-hover-text-shadow = 0 0 8px hsla(81, 100%, 56%, 0.5)
main-color = link-color
link-active-color = link-hover-color
button-hover-color = bg-color
button-hover-background = link-hover-color
loading-anim-color = link-color

5
styles/include/mixins.scarlet
View File

@ -60,6 +60,11 @@ mixin bg-dark-up
:hover
background-color rgba(0, 0, 0, 0.015)
mixin bg-light-up
background-color transparent
:hover
background-color rgba(255, 255, 255, 0.015)
mixin light-up
filter brightness(0.4) saturate(1)
:hover

4
styles/input.scarlet
View File

@ -35,8 +35,8 @@ button, .button
:hover,
&.active
cursor pointer
color white
background-color button-hover-color
color button-hover-color
background button-hover-background
:active
transform translateY(3px)

1
styles/navigation.scarlet
View File

@ -44,6 +44,7 @@
#search
background transparent
border none
box-shadow none
font-size 1em
padding 0
width 0

8
styles/sidebar.scarlet
View File

@ -41,13 +41,17 @@ sidebar-spacing-y = 0.7rem
.sidebar-link
color text-color
&.active
.sidebar-button
background forum-tag-hover-color
color white
// background forum-tag-hover-color
// color white
color link-color
text-shadow link-hover-text-shadow
.sidebar-button
horizontal
default-transition
align-items center
padding sidebar-spacing-y 1rem
// background ui-background

2
styles/table.scarlet
View File

@ -21,4 +21,4 @@ th
tbody
tr
bg-dark-up
bg-light-up

38
styles/widgets.scarlet
View File

@ -1,23 +1,29 @@
// .widgets
// 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)
.widgets
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)
horizontal-wrap
justify-content center
.widget
vertical
margin-bottom 1rem
width 100%
max-width 300px
margin calc(content-padding / 2)
overflow hidden
.widget-section