Using stylus now
This commit is contained in:
parent
b4e9b6a15e
commit
a63e250f24
2
.gitignore
vendored
2
.gitignore
vendored
@ -34,7 +34,7 @@ node_modules/
|
||||
debug
|
||||
|
||||
# pixy
|
||||
❖.go
|
||||
$.go
|
||||
|
||||
# binaries
|
||||
/notify.moe
|
@ -1 +0,0 @@
|
||||
.anime-container{float:left;width:100%;padding:0;text-align:left;border-radius:3px;box-sizing:border-box}.anime-links{float:left;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}.anime-links-category{-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-preferred-size:100%;flex-basis:100%}.anime-title-db{text-align:left;width:auto}.second-title-container{float:left;width:100%;text-align:left;margin-top:-.6em;margin-bottom:.6em}.second-title{font-size:.9em;font-weight:normal;color:rgba(60,60,60,0.5) !important}.anime-summary-header{display:block}.anime-summary{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:300px;max-width:100%;margin-left:0;}.anime-summary .anime-header{margin-top:0}.anime-trailer{width:100%}.genre-list{list-style-type:none;margin-left:.5em}.sources{font-size:.8em;opacity:.5}.anime-header{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:row;flex-flow:row}.anime-image{border-radius:3px;box-shadow:4px 4px 8px rgba(0,0,0,0.12);-webkit-filter:saturate(100%);filter:saturate(100%);-webkit-transition:all 290ms ease;transition:all 290ms ease;}.anime-image:hover{-webkit-filter:saturate(130%);filter:saturate(130%);box-shadow:6px 6px 12px rgba(0,0,0,0.2)}.anime-image-container{-ms-flex-negative:0;flex-shrink:0;text-align:center;margin-bottom:1rem;}.anime-image-container .anime-image{margin:0 !important;margin-right:1.5rem !important;width:225px}.info-column{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}.users-count{opacity:.5;font-size:.9em}.anime-frontpage h2,.anime-frontpage h3{text-align:center}.popular-anime-list{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.popular-anime{padding:.5em;display:block}.popular-anime-image{width:100px !important;height:141px !important}.light-button-group{float:left;width:100%;margin:0;width:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;font-size:.9em}.light-button{padding:.5em 1em;border-radius:3px;}.light-button:hover{color:#fff !important;background-color:#f25d1e}.entry-error{color:#f00 !important}.entry-ok{color:#008000 !important}#search{float:none}#search-results{width:100%;max-width:560px;text-align:left;margin:0 auto}.search-performance,.anime-count{opacity:.25;text-align:center !important}.search-result{float:left;width:100%;padding:.25em .5em;border-radius:3px;box-sizing:border-box;}.search-result:focus{background-color:#202020 !important;color:#e8e8e8 !important}@media only screen and (max-width:800px){.anime-header{-ms-flex-flow:row wrap;flex-flow:row wrap}.anime-title-db,.second-title-container,.anime-image-container{text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}}
|
50
api.go
Normal file
50
api.go
Normal file
@ -0,0 +1,50 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"sort"
|
||||
"strconv"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
"github.com/aerojs/aero"
|
||||
"github.com/animenotifier/arn"
|
||||
)
|
||||
|
||||
func init() {
|
||||
app.Get("/all/anime", func(ctx *aero.Context) string {
|
||||
start := time.Now()
|
||||
var titles []string
|
||||
|
||||
results := make(chan *arn.Anime)
|
||||
arn.Scan("Anime", results)
|
||||
|
||||
for anime := range results {
|
||||
titles = append(titles, anime.Title.Romaji)
|
||||
}
|
||||
sort.Strings(titles)
|
||||
|
||||
return ctx.Text(s(len(titles)) + " anime fetched in " + s(time.Since(start)) + "\n\n" + strings.Join(titles, "\n"))
|
||||
})
|
||||
|
||||
app.Get("/api/anime/:id", func(ctx *aero.Context) string {
|
||||
id, _ := strconv.Atoi(ctx.Get("id"))
|
||||
anime, err := arn.GetAnime(id)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("Anime not found")
|
||||
}
|
||||
|
||||
return ctx.JSON(anime)
|
||||
})
|
||||
|
||||
app.Get("/api/users/:nick", func(ctx *aero.Context) string {
|
||||
nick := ctx.Get("nick")
|
||||
user, err := arn.GetUserByNick(nick)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("User not found")
|
||||
}
|
||||
|
||||
return ctx.JSON(user)
|
||||
})
|
||||
}
|
27
app.go
Normal file
27
app.go
Normal file
@ -0,0 +1,27 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"io/ioutil"
|
||||
|
||||
"github.com/aerojs/aero"
|
||||
)
|
||||
|
||||
var app = aero.New()
|
||||
|
||||
func main() {
|
||||
app.SetStyle(bundledCSS)
|
||||
|
||||
scripts, _ := ioutil.ReadFile("temp/scripts.js")
|
||||
js := string(scripts)
|
||||
|
||||
app.Get("/scripts.js", func(ctx *aero.Context) string {
|
||||
ctx.SetHeader("Content-Type", "application/javascript")
|
||||
return js
|
||||
})
|
||||
|
||||
app.Layout = func(ctx *aero.Context, content string) string {
|
||||
return Render.Layout(content)
|
||||
}
|
||||
|
||||
app.Run()
|
||||
}
|
@ -22,11 +22,11 @@ component Anime(anime *arn.Anime)
|
||||
if anime.YoutubeID != ""
|
||||
h3.anime-header Video
|
||||
.anime-trailer.video-container
|
||||
iframe.video(src="https://www.youtube.com/embed/" + anime.YoutubeID + "?showinfo=0", frameborder="0", allowfullscreen="allowfullscreen")
|
||||
iframe.video(src="https://www.youtube.com/embed/" + anime.YoutubeID + "?showinfo=0", allowfullscreen="allowfullscreen")
|
||||
|
||||
if anime.Tracks != nil && anime.Tracks.Opening != nil
|
||||
h3.anime-header Tracks
|
||||
iframe(width="100%", height="150", scrolling="no", frameborder="no", src="https://w.soundcloud.com/player/?url=" + anime.Tracks.Opening.URI + "?auto_play=false&hide_related=true&show_comments=true&show_user=true&show_reposts=false&visual=true")
|
||||
iframe.anime-track(src="https://w.soundcloud.com/player/?url=" + anime.Tracks.Opening.URI + "?auto_play=false&hide_related=true&show_comments=true&show_user=true&show_reposts=false&visual=true")
|
||||
|
||||
//- if user && friendsWatching && friendsWatching.length > 0
|
||||
//- include ../messages/avatar.pug
|
||||
@ -42,7 +42,7 @@ component Anime(anime *arn.Anime)
|
||||
each genre in anime.Genres
|
||||
if genre != ""
|
||||
a.light-button.ajax(href="/genres/" + arn.FixGenre(genre))
|
||||
Icon(GenreIcons[genre])
|
||||
Icon(arn.GenreIcons[genre])
|
||||
span= genre
|
||||
|
||||
if len(anime.Studios) > 0
|
167
components/anime/anime.styl
Normal file
167
components/anime/anime.styl
Normal file
@ -0,0 +1,167 @@
|
||||
.anime-container
|
||||
float left
|
||||
width 100%
|
||||
padding 0
|
||||
text-align left
|
||||
border-radius 3px
|
||||
box-sizing border-box
|
||||
|
||||
.anime-links
|
||||
float left
|
||||
width 100%
|
||||
display flex
|
||||
flex-flow row wrap
|
||||
|
||||
.anime-links-category
|
||||
flex 1
|
||||
flex-basis 100%
|
||||
// min-width 300px
|
||||
// max-width 100%
|
||||
|
||||
.anime-title-db
|
||||
text-align left
|
||||
width auto
|
||||
|
||||
.second-title-container
|
||||
float left
|
||||
width 100%
|
||||
text-align left
|
||||
margin-top -0.6em
|
||||
margin-bottom 0.6em
|
||||
|
||||
.second-title
|
||||
font-size 0.9em
|
||||
font-weight normal
|
||||
color rgba(60, 60, 60, 0.5) !important
|
||||
|
||||
.anime-summary-header
|
||||
display block
|
||||
|
||||
.anime-summary
|
||||
flex 1
|
||||
min-width 300px
|
||||
max-width 100%
|
||||
margin-left 0
|
||||
.anime-header
|
||||
margin-top 0
|
||||
|
||||
.anime-trailer
|
||||
width 100%
|
||||
|
||||
.genre-list
|
||||
list-style-type none
|
||||
margin-left 0.5em
|
||||
|
||||
.sources
|
||||
font-size 0.8em
|
||||
opacity 0.5
|
||||
|
||||
.anime-header
|
||||
display flex
|
||||
flex-flow row
|
||||
|
||||
.anime-image
|
||||
border-radius 3px
|
||||
box-shadow 4px 4px 8px rgba(0, 0, 0, 0.12)
|
||||
filter saturate(100%)
|
||||
transition all 290ms ease
|
||||
&:hover
|
||||
filter saturate(130%)
|
||||
box-shadow 6px 6px 12px rgba(0, 0, 0, 0.2)
|
||||
|
||||
.anime-image-container
|
||||
flex-shrink 0
|
||||
text-align center
|
||||
margin-bottom 1rem
|
||||
.anime-image
|
||||
margin 0 !important
|
||||
margin-right 1.5rem !important
|
||||
width 225px
|
||||
|
||||
.anime-track
|
||||
width 100%
|
||||
height 150px
|
||||
|
||||
.info-column
|
||||
flex-grow 1
|
||||
display flex
|
||||
flex-flow column
|
||||
|
||||
.users-count
|
||||
opacity 0.5
|
||||
font-size 0.9em
|
||||
|
||||
.anime-frontpage
|
||||
h2, h3
|
||||
text-align center
|
||||
|
||||
.popular-anime-list
|
||||
width 100%
|
||||
display flex
|
||||
flex-flow row wrap
|
||||
justify-content center
|
||||
|
||||
.popular-anime
|
||||
padding 0.5em
|
||||
display block
|
||||
|
||||
.popular-anime-image
|
||||
width 100px !important
|
||||
height 141px !important
|
||||
|
||||
.light-button-group
|
||||
float left
|
||||
width 100%
|
||||
margin 0
|
||||
width auto
|
||||
display flex
|
||||
flex-flow row wrap
|
||||
justify-content flex-start
|
||||
font-size 0.9em
|
||||
|
||||
.light-button
|
||||
display inline-block
|
||||
padding 0.5em 1em
|
||||
border-radius 3px
|
||||
&:hover
|
||||
color white !important
|
||||
background-color linkHoverColor
|
||||
|
||||
.entry-error
|
||||
color red !important
|
||||
|
||||
.entry-ok
|
||||
color green !important
|
||||
|
||||
#search
|
||||
float none
|
||||
|
||||
#search-results
|
||||
width 100%
|
||||
max-width 560px
|
||||
text-align left
|
||||
margin 0 auto
|
||||
|
||||
.search-performance, .anime-count
|
||||
opacity 0.25
|
||||
text-align center !important
|
||||
|
||||
.search-result
|
||||
float left
|
||||
width 100%
|
||||
padding 0.25em 0.5em
|
||||
border-radius 3px
|
||||
box-sizing border-box
|
||||
&:focus
|
||||
background-color rgb(32, 32, 32) !important
|
||||
color rgb(232, 232, 232) !important
|
||||
|
||||
@media only screen and (max-width: 800px)
|
||||
.anime-header
|
||||
flex-flow row wrap
|
||||
|
||||
.anime-title-db
|
||||
.second-title-container
|
||||
.anime-image-container
|
||||
text-align center
|
||||
flex-grow 1
|
1
components/anime/anime.ts
Normal file
1
components/anime/anime.ts
Normal file
@ -0,0 +1 @@
|
||||
console.log("Hello Typescript")
|
@ -1,5 +0,0 @@
|
||||
h2
|
||||
text-align center
|
||||
|
||||
.light-button
|
||||
display inline-block
|
@ -1,14 +1,14 @@
|
||||
component GenreOverview
|
||||
h2 Genres
|
||||
h2.genre-header Genres
|
||||
|
||||
div
|
||||
each genre in Genres
|
||||
each genre in arn.Genres
|
||||
a.light-button.ajax(href="/genres/" + arn.FixGenre(genre))
|
||||
Icon(GenreIcons[genre])
|
||||
Icon(arn.GenreIcons[genre])
|
||||
span= genre
|
||||
|
||||
component AnimeInGenre(genre string, animeList []*arn.Anime)
|
||||
h2= "#" + genre
|
||||
h2.genre-header= arn.Capitalize(genre)
|
||||
.genre-anime-list
|
||||
each anime in animeList
|
||||
a.genre-anime-link.ajax(href="/anime/" + s(anime.ID))
|
||||
|
@ -1,4 +1,4 @@
|
||||
h2
|
||||
.genre-header
|
||||
text-align center
|
||||
|
||||
.genre-anime-list
|
39
config.json
Normal file
39
config.json
Normal file
@ -0,0 +1,39 @@
|
||||
{
|
||||
"domain": "notify.moe",
|
||||
"title": "Anime Notifier",
|
||||
"fonts": [
|
||||
"Ubuntu"
|
||||
],
|
||||
"styles": [
|
||||
"reset",
|
||||
"font-awesome",
|
||||
"base",
|
||||
"elements",
|
||||
"layout",
|
||||
"navigation",
|
||||
"headers",
|
||||
"forms",
|
||||
"colors",
|
||||
"animelist",
|
||||
"forum",
|
||||
"settings",
|
||||
"user",
|
||||
"video",
|
||||
"loading",
|
||||
"fade",
|
||||
"mobile"
|
||||
],
|
||||
"static": [
|
||||
"images"
|
||||
],
|
||||
"icons": [
|
||||
"images/characters/arn-waifu.png"
|
||||
],
|
||||
"manifest": {
|
||||
"gcm_sender_id": "941298467524"
|
||||
},
|
||||
"ports": {
|
||||
"http": 4000,
|
||||
"https": 4001
|
||||
}
|
||||
}
|
49
genres.go
49
genres.go
@ -1,49 +0,0 @@
|
||||
package main
|
||||
|
||||
import "sort"
|
||||
|
||||
// Genres ...
|
||||
var Genres []string
|
||||
|
||||
// GenreIcons ...
|
||||
var GenreIcons = map[string]string{
|
||||
"Action": "bomb",
|
||||
"Adventure": "diamond",
|
||||
"Cars": "car",
|
||||
"Comedy": "smile-o",
|
||||
"Drama": "heartbeat",
|
||||
"Ecchi": "heart-o",
|
||||
"Fantasy": "tree",
|
||||
"Game": "gamepad",
|
||||
"Harem": "group",
|
||||
"Hentai": "venus-mars",
|
||||
"Historical": "history",
|
||||
"Horror": "frown-o",
|
||||
"Kids": "child",
|
||||
"Martial Arts": "hand-rock-o",
|
||||
"Magic": "magic",
|
||||
"Mecha": "reddit-alien",
|
||||
"Military": "fighter-jet",
|
||||
"Music": "music",
|
||||
"Mystery": "question",
|
||||
"Psychological": "lightbulb-o",
|
||||
"Romance": "heart",
|
||||
"Sci-Fi": "space-shuttle",
|
||||
"School": "graduation-cap",
|
||||
"Seinen": "male",
|
||||
"Shounen": "male",
|
||||
"Shoujo": "female",
|
||||
"Slice of Life": "hand-peace-o",
|
||||
"Sports": "soccer-ball-o",
|
||||
"Supernatural": "magic",
|
||||
"Super Power": "flash",
|
||||
"Thriller": "hourglass-end",
|
||||
"Vampire": "eye",
|
||||
}
|
||||
|
||||
func init() {
|
||||
for k := range GenreIcons {
|
||||
Genres = append(Genres, k)
|
||||
}
|
||||
sort.Strings(Genres)
|
||||
}
|
File diff suppressed because one or more lines are too long
130
main.go
130
main.go
@ -1,130 +0,0 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"io/ioutil"
|
||||
"sort"
|
||||
"strconv"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
"github.com/aerojs/aero"
|
||||
"github.com/animenotifier/arn"
|
||||
)
|
||||
|
||||
func main() {
|
||||
app := aero.New()
|
||||
|
||||
cssBytes, _ := ioutil.ReadFile("layout.css")
|
||||
css := string(cssBytes)
|
||||
|
||||
animeCSSBytes, _ := ioutil.ReadFile("anime.css")
|
||||
css += string(animeCSSBytes)
|
||||
|
||||
app.SetStyle(css)
|
||||
|
||||
scripts, _ := ioutil.ReadFile("scripts.js")
|
||||
js := string(scripts)
|
||||
|
||||
// Define layout
|
||||
app.Layout = func(ctx *aero.Context, content string) string {
|
||||
return Render.Layout(content)
|
||||
}
|
||||
|
||||
app.Register("/", func(ctx *aero.Context) string {
|
||||
return ctx.HTML(Render.Dashboard())
|
||||
})
|
||||
|
||||
app.Register("/genres", func(ctx *aero.Context) string {
|
||||
return ctx.HTML(Render.GenreOverview())
|
||||
})
|
||||
|
||||
type GenreInfo struct {
|
||||
Genre string `json:"genre"`
|
||||
AnimeList []*arn.Anime `json:"animeList"`
|
||||
}
|
||||
|
||||
app.Register("/genres/:name", func(ctx *aero.Context) string {
|
||||
genreName := ctx.Params.ByName("name")
|
||||
genreInfo := new(GenreInfo)
|
||||
|
||||
err := arn.GetObject("Genres", genreName, genreInfo)
|
||||
|
||||
if err != nil {
|
||||
return err.Error()
|
||||
}
|
||||
|
||||
return ctx.HTML(Render.AnimeInGenre(genreInfo.Genre, genreInfo.AnimeList))
|
||||
|
||||
// var animeList []*arn.Anime
|
||||
// results := make(chan *arn.Anime)
|
||||
// arn.Scan("Anime", results)
|
||||
|
||||
// for anime := range results {
|
||||
// genres := Map(anime.Genres, arn.FixGenre)
|
||||
// if Contains(genres, genreName) {
|
||||
// animeList = append(animeList, anime)
|
||||
// }
|
||||
// }
|
||||
|
||||
// return ctx.HTML(Render.AnimeInGenre(genreName, animeList))
|
||||
})
|
||||
|
||||
app.Register("/anime/:id", func(ctx *aero.Context) string {
|
||||
id, _ := strconv.Atoi(ctx.Params.ByName("id"))
|
||||
anime, err := arn.GetAnime(id)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("Anime not found")
|
||||
}
|
||||
|
||||
return ctx.HTML(Render.Anime(anime))
|
||||
})
|
||||
|
||||
// ---------------------------------------------------------------
|
||||
// API
|
||||
// ---------------------------------------------------------------
|
||||
|
||||
app.Get("/scripts.js", func(ctx *aero.Context) string {
|
||||
ctx.SetHeader("Content-Type", "application/javascript")
|
||||
return js
|
||||
})
|
||||
|
||||
app.Get("/all/anime", func(ctx *aero.Context) string {
|
||||
start := time.Now()
|
||||
var titles []string
|
||||
|
||||
results := make(chan *arn.Anime)
|
||||
arn.Scan("Anime", results)
|
||||
|
||||
for anime := range results {
|
||||
titles = append(titles, anime.Title.Romaji)
|
||||
}
|
||||
sort.Strings(titles)
|
||||
|
||||
return ctx.Text(s(len(titles)) + " anime fetched in " + s(time.Since(start)) + "\n\n" + strings.Join(titles, "\n"))
|
||||
})
|
||||
|
||||
app.Get("/api/anime/:id", func(ctx *aero.Context) string {
|
||||
id, _ := strconv.Atoi(ctx.Params.ByName("id"))
|
||||
anime, err := arn.GetAnime(id)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("Anime not found")
|
||||
}
|
||||
|
||||
return ctx.JSON(anime)
|
||||
})
|
||||
|
||||
app.Get("/api/users/:nick", func(ctx *aero.Context) string {
|
||||
nick := ctx.Params.ByName("nick")
|
||||
user, err := arn.GetUserByNick(nick)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("User not found")
|
||||
}
|
||||
|
||||
return ctx.JSON(user)
|
||||
})
|
||||
|
||||
app.Run()
|
||||
}
|
58
main_test.go
58
main_test.go
@ -1,58 +0,0 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"bytes"
|
||||
"fmt"
|
||||
"strings"
|
||||
"testing"
|
||||
)
|
||||
|
||||
// func BenchmarkRender(b *testing.B) {
|
||||
// b.ReportAllocs()
|
||||
// layout := aero.NewTemplate("layout/layout.pug")
|
||||
// template := aero.NewTemplate("pages/anime/anime.pug")
|
||||
// cssBytes, _ := ioutil.ReadFile("layout.css")
|
||||
// css := string(cssBytes)
|
||||
// cssSearch := "</head><body"
|
||||
// cssReplace := "<style>" + css + "</style></head><body"
|
||||
|
||||
// for i := 0; i < b.N; i++ {
|
||||
// anime, _ := arn.GetAnime(1000001)
|
||||
|
||||
// content := template.Render(map[string]interface{}{
|
||||
// "anime": anime,
|
||||
// })
|
||||
|
||||
// final := layout.Render(map[string]interface{}{
|
||||
// "content": content,
|
||||
// })
|
||||
|
||||
// final = strings.Replace(final, cssSearch, cssReplace, 1)
|
||||
// }
|
||||
// }
|
||||
|
||||
func Benchmark1(b *testing.B) {
|
||||
code := []byte(strings.Repeat("a", 10000))
|
||||
|
||||
b.ReportAllocs()
|
||||
for i := 0; i < b.N; i++ {
|
||||
var buf bytes.Buffer
|
||||
buf.Write(code)
|
||||
buf.Write(code)
|
||||
buf.Write(code)
|
||||
c := buf.String()
|
||||
fmt.Println(len(c))
|
||||
}
|
||||
}
|
||||
|
||||
func Benchmark2(b *testing.B) {
|
||||
code := strings.Repeat("a", 10000)
|
||||
|
||||
b.ReportAllocs()
|
||||
for i := 0; i < b.N; i++ {
|
||||
c := code
|
||||
c += code
|
||||
c += code
|
||||
fmt.Println(len(c))
|
||||
}
|
||||
}
|
42
router.go
Normal file
42
router.go
Normal file
@ -0,0 +1,42 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"strconv"
|
||||
|
||||
"github.com/aerojs/aero"
|
||||
"github.com/animenotifier/arn"
|
||||
)
|
||||
|
||||
func init() {
|
||||
app.Ajax("/", func(ctx *aero.Context) string {
|
||||
return ctx.HTML(Render.Dashboard())
|
||||
})
|
||||
|
||||
app.Ajax("/anime/:id", func(ctx *aero.Context) string {
|
||||
id, _ := strconv.Atoi(ctx.Get("id"))
|
||||
anime, err := arn.GetAnime(id)
|
||||
|
||||
if err != nil {
|
||||
return ctx.Text("Anime not found")
|
||||
}
|
||||
|
||||
return ctx.HTML(Render.Anime(anime))
|
||||
})
|
||||
|
||||
app.Ajax("/genres", func(ctx *aero.Context) string {
|
||||
return ctx.HTML(Render.GenreOverview())
|
||||
})
|
||||
|
||||
app.Ajax("/genres/:name", func(ctx *aero.Context) string {
|
||||
genreName := ctx.Get("name")
|
||||
genreInfo := new(arn.Genre)
|
||||
|
||||
err := arn.GetObject("Genres", genreName, genreInfo)
|
||||
|
||||
if err != nil {
|
||||
return err.Error()
|
||||
}
|
||||
|
||||
return ctx.HTML(Render.AnimeInGenre(genreInfo.Genre, genreInfo.AnimeList))
|
||||
})
|
||||
}
|
1
styles/.gitignore
vendored
1
styles/.gitignore
vendored
@ -1 +0,0 @@
|
||||
*.css
|
101
styles/animelist.styl
Normal file
101
styles/animelist.styl
Normal file
@ -0,0 +1,101 @@
|
||||
.anime-list-container
|
||||
text-align left
|
||||
|
||||
.embedded-anime-list-container
|
||||
.anime-list
|
||||
width calc(100% - 225px - 1em)
|
||||
.anime-list-image
|
||||
display block
|
||||
|
||||
.anime-list
|
||||
list-style-type none
|
||||
margin 0
|
||||
width 100%
|
||||
max-width 750px
|
||||
|
||||
.anime-status-icon
|
||||
margin 0 !important
|
||||
|
||||
.anime-list-image
|
||||
display none
|
||||
position fixed
|
||||
top 50%
|
||||
right calc(16px + 1em)
|
||||
z-index 9999
|
||||
width 225px
|
||||
margin 0
|
||||
padding 0
|
||||
opacity 0
|
||||
border-radius 3px
|
||||
box-shadow 0px 0px 8px rgba(0, 0, 0, 0.4)
|
||||
transform translate(10%, -50%)
|
||||
transition all 290ms ease
|
||||
pointer-events none
|
||||
|
||||
.anime
|
||||
padding 0.25em 0.75em
|
||||
border uiBorder
|
||||
border-radius 3px
|
||||
margin 0.25em 0
|
||||
background uiBackground
|
||||
display flex
|
||||
flex-direction row
|
||||
transition all 200ms ease
|
||||
&:hover
|
||||
background uiHoverBackground
|
||||
.anime-list-image
|
||||
opacity 1
|
||||
transform translate(0, -50%)
|
||||
|
||||
.anime-title
|
||||
.anime-view-link
|
||||
color darken(mainColor, 30%) !important
|
||||
&:hover
|
||||
color rgb(255, 32, 12) !important
|
||||
|
||||
.anime-title
|
||||
flex-grow 0
|
||||
flex-shrink 1
|
||||
white-space nowrap
|
||||
text-overflow ellipsis
|
||||
overflow hidden
|
||||
|
||||
.spacer
|
||||
flex 1
|
||||
|
||||
.anime-completed
|
||||
.anime-warning
|
||||
.anime-up-to-date
|
||||
.anime-download-link
|
||||
flex 0 0 32px
|
||||
text-align right
|
||||
|
||||
.anime-completed
|
||||
color blue !important
|
||||
opacity 0.25
|
||||
&:hover
|
||||
opacity 0.7
|
||||
|
||||
.anime-warning
|
||||
color red !important
|
||||
opacity 0.2
|
||||
&:hover
|
||||
opacity 0.7
|
||||
|
||||
.anime-up-to-date
|
||||
color green !important
|
||||
opacity 0.7
|
||||
|
||||
.airing-date
|
||||
.episodes-behind
|
||||
flex-grow 0
|
||||
flex-shrink 1
|
||||
opacity 0.5
|
||||
text-align right
|
||||
white-space nowrap
|
||||
|
||||
.episodes-behind
|
||||
&:before
|
||||
content '+'
|
||||
&:after
|
||||
content ''
|
109
styles/base.styl
109
styles/base.styl
@ -1,3 +1,108 @@
|
||||
html
|
||||
height 100%
|
||||
|
||||
body
|
||||
background-color rgb(128, 128, 128)
|
||||
color white
|
||||
font-family "Ubuntu", "Trebuchet MS", sans-serif
|
||||
font-size 1.05em
|
||||
tab-size 4
|
||||
overflow-x hidden
|
||||
overflow-y hidden
|
||||
height 100%
|
||||
-webkit-font-smoothing antialiased
|
||||
-moz-osx-font-smoothing grayscale
|
||||
|
||||
a
|
||||
text-decoration none
|
||||
transition all 290ms ease
|
||||
&:hover
|
||||
text-decoration none
|
||||
&:active
|
||||
transform translateY(3px)
|
||||
|
||||
/*.page
|
||||
height 100vh*/
|
||||
|
||||
section
|
||||
float left
|
||||
width 100%
|
||||
|
||||
.icon-list
|
||||
margin-left 1px !important
|
||||
list-style-type none
|
||||
.fa
|
||||
opacity 0.93
|
||||
|
||||
.powered-by
|
||||
opacity 0.8
|
||||
font-size 0.9em
|
||||
margin-top 1em
|
||||
|
||||
.maintenance
|
||||
width 100%
|
||||
height 100%
|
||||
text-align center
|
||||
padding 1em
|
||||
font-size 3em
|
||||
line-height 1.5em
|
||||
|
||||
.region-block
|
||||
float left
|
||||
width 100%
|
||||
font-size 1.2em
|
||||
padding 1em
|
||||
p
|
||||
text-align center
|
||||
max-width none
|
||||
|
||||
.editor-info
|
||||
max-width 1200px
|
||||
|
||||
// tooltipOffset = -10px
|
||||
//
|
||||
// .tooltip
|
||||
// display inline-block
|
||||
// position relative
|
||||
//
|
||||
// &:after
|
||||
// display inline
|
||||
// content attr(data-tooltip)
|
||||
// opacity 0
|
||||
// transition opacity 250ms ease
|
||||
// background rgb(48, 48, 48)
|
||||
// border-radius 3px
|
||||
// color rgb(255, 255, 255)
|
||||
// // box-shadow 0 0 8px rgba(0, 0, 0, 0.2)
|
||||
// padding 0.3rem 0.75rem
|
||||
// width auto
|
||||
// pointer-events none
|
||||
//
|
||||
// position absolute
|
||||
// left 50%
|
||||
// top tooltipOffset
|
||||
// transform translate(-50%, -100%)
|
||||
// z-index 100
|
||||
//
|
||||
// margin 0
|
||||
//
|
||||
// &:before
|
||||
// content ""
|
||||
// border solid
|
||||
// border-color rgb(60, 60, 60) transparent
|
||||
// border-width 6px 6px 0 6px
|
||||
// opacity 0
|
||||
// transition opacity 250ms ease
|
||||
// pointer-events none
|
||||
// margin 0
|
||||
// padding 0
|
||||
//
|
||||
// position absolute
|
||||
// left 50%
|
||||
// top tooltipOffset
|
||||
// transform translateX(-50%)
|
||||
// z-index 99
|
||||
//
|
||||
// &:hover
|
||||
// &:after
|
||||
// opacity 1
|
||||
// &:before
|
||||
// opacity 1
|
||||
|
91
styles/colors.styl
Normal file
91
styles/colors.styl
Normal file
@ -0,0 +1,91 @@
|
||||
html, body
|
||||
color rgb(60, 60, 60)
|
||||
background-color rgb(254, 254, 254)
|
||||
|
||||
a
|
||||
color mainColor
|
||||
&:hover
|
||||
color hoverColor
|
||||
|
||||
#header
|
||||
background-color rgb(245, 245, 245)
|
||||
background-image url("/images/characters/pencil-girl.png")
|
||||
background-repeat no-repeat
|
||||
background-size auto 100%
|
||||
background-position 100% 0%
|
||||
|
||||
#slogan
|
||||
color rgb(120, 120, 120)
|
||||
|
||||
#content
|
||||
background-color transparent
|
||||
|
||||
a
|
||||
color linkColor
|
||||
&:hover
|
||||
color linkHoverColor
|
||||
|
||||
.active
|
||||
color activeLinkColor
|
||||
&:hover
|
||||
color @color
|
||||
|
||||
.navigation-link
|
||||
color rgb(160, 160, 160)
|
||||
&.active
|
||||
&:hover
|
||||
color rgb(80, 80, 80)
|
||||
text-shadow 1px 1px 3px rgba(4, 4, 4, 0.1)
|
||||
|
||||
.saving
|
||||
opacity 0.5 !important
|
||||
|
||||
input[type="text"]
|
||||
input[type="email"]
|
||||
input[type="password"]
|
||||
input[type="url"]
|
||||
input[type="number"]
|
||||
textarea
|
||||
color rgb(32, 32, 32)
|
||||
background-color rgb(255, 255, 255)
|
||||
box-shadow none
|
||||
border 1px solid rgba(0, 0, 0, 0.1)
|
||||
&:focus
|
||||
color rgb(0, 0, 0)
|
||||
box-shadow 0 0 6px alpha(mainColor, 20%)
|
||||
border 1px solid mainColor
|
||||
&:disabled
|
||||
background-color rgb(224, 224, 224)
|
||||
cursor not-allowed
|
||||
|
||||
button
|
||||
select
|
||||
border 1px solid rgb(170, 170, 170)
|
||||
color rgb(32, 32, 32)
|
||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
||||
box-shadow 0 0 2px rgb(255, 255, 255), 0 -2px 5px rgba(0, 0, 0, 0.08) inset
|
||||
&:focus
|
||||
color rgb(0, 0, 0)
|
||||
box-shadow 0 0 6px alpha(mainColor, 20%)
|
||||
border 1px solid mainColor
|
||||
|
||||
input[type="submit"]:hover
|
||||
button:hover
|
||||
.button:hover
|
||||
cursor pointer
|
||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
||||
text-decoration none
|
||||
|
||||
button[disabled]
|
||||
opacity 0.5
|
||||
&:hover
|
||||
cursor not-allowed
|
||||
color rgb(32, 32, 32)
|
||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
||||
|
||||
.user-name
|
||||
a
|
||||
color rgb(16, 16, 16)
|
||||
|
||||
.list-provider-name-highlight
|
||||
color rgb(48, 48, 48)
|
8
styles/config.styl
Normal file
8
styles/config.styl
Normal file
@ -0,0 +1,8 @@
|
||||
mainColor = rgb(248, 165, 130)
|
||||
hoverColor = darken(mainColor, 10%)
|
||||
linkColor = darken(mainColor, 15%)
|
||||
linkHoverColor = darken(hoverColor, 20%)
|
||||
activeLinkColor = rgb(100, 149, 237)
|
||||
uiBorder = 1px solid rgba(0, 0, 0, 0.1)
|
||||
uiBackground = linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
||||
uiHoverBackground = linear-gradient(to bottom, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.03) 100%)
|
108
styles/elements.styl
Normal file
108
styles/elements.styl
Normal file
@ -0,0 +1,108 @@
|
||||
p, ul, ol, h3, dl, blockquote, label
|
||||
line-height 1.7em
|
||||
float left
|
||||
width 100%
|
||||
|
||||
p, ul, ol, pre, h2, dl, blockquote, label
|
||||
text-align left
|
||||
margin-top 0.4em
|
||||
margin-bottom 0.4em
|
||||
float left
|
||||
|
||||
p
|
||||
max-width 728px
|
||||
clear both
|
||||
|
||||
dl
|
||||
max-width 728px
|
||||
|
||||
dt
|
||||
font-weight bold
|
||||
font-size 1.4em
|
||||
line-height 2.5em
|
||||
|
||||
dd
|
||||
margin-left 1em
|
||||
margin-bottom 1em
|
||||
|
||||
table
|
||||
float left
|
||||
width 100%
|
||||
|
||||
iframe
|
||||
float left
|
||||
display block
|
||||
margin 0 auto
|
||||
|
||||
pre
|
||||
border 1px solid rgb(128, 128, 128)
|
||||
padding 1em
|
||||
width calc(100% - 2em)
|
||||
box-shadow 1px 1px 16px rgba(0, 0, 0, 0.6)
|
||||
color rgb(224, 224, 224)
|
||||
background-color rgb(32, 32, 32)
|
||||
border none
|
||||
border-radius 3px
|
||||
|
||||
pre, code
|
||||
font-family 'Ubuntu Mono', Consolas, monospace
|
||||
|
||||
ul
|
||||
list-style-type square
|
||||
|
||||
ol
|
||||
list-style-type decimal
|
||||
|
||||
ul, ol
|
||||
list-style-position outside
|
||||
padding 0
|
||||
margin-left 1.7em
|
||||
width calc(100% - 1.7em)
|
||||
|
||||
strong
|
||||
font-weight bold
|
||||
|
||||
em
|
||||
font-style italic
|
||||
|
||||
hr
|
||||
clear both
|
||||
height 4px
|
||||
border-bottom 1px dotted #ccc
|
||||
border-left none
|
||||
border-right none
|
||||
border-top none
|
||||
|
||||
img
|
||||
margin 0.5em auto
|
||||
max-width 100%
|
||||
height auto
|
||||
|
||||
i.fa
|
||||
margin-right 0.5em
|
||||
|
||||
table
|
||||
float left
|
||||
width 100%
|
||||
|
||||
th
|
||||
font-size 120%
|
||||
padding 5px 0
|
||||
text-align left
|
||||
|
||||
tr
|
||||
border-bottom-width 1px
|
||||
border-bottom-style solid
|
||||
border-bottom-color rgba(0, 0, 0, 0.05)
|
||||
&:last-child
|
||||
border none
|
||||
|
||||
td
|
||||
padding 0.5em
|
||||
text-align left
|
||||
vertical-align top
|
||||
|
||||
tbody
|
||||
tr
|
||||
&:hover
|
||||
background-color rgba(0, 0, 0, 0.03)
|
8
styles/embedded.styl
Normal file
8
styles/embedded.styl
Normal file
@ -0,0 +1,8 @@
|
||||
.embedded-header
|
||||
position fixed
|
||||
left 0
|
||||
bottom 0
|
||||
z-index 1
|
||||
|
||||
.embedded-content
|
||||
margin-bottom 3em
|
7
styles/fade.styl
Normal file
7
styles/fade.styl
Normal file
@ -0,0 +1,7 @@
|
||||
.fade
|
||||
opacity 1
|
||||
transition opacity 200ms ease
|
||||
will-change opacity
|
||||
|
||||
.fade-out
|
||||
opacity 0
|
2882
styles/font-awesome.styl
vendored
Normal file
2882
styles/font-awesome.styl
vendored
Normal file
File diff suppressed because it is too large
Load Diff
79
styles/forms.styl
Normal file
79
styles/forms.styl
Normal file
@ -0,0 +1,79 @@
|
||||
maxWidth = 560px
|
||||
|
||||
input[type="text"]
|
||||
input[type="email"]
|
||||
input[type="password"]
|
||||
input[type="url"]
|
||||
input[type="number"]
|
||||
button
|
||||
font-family "Ubuntu", sans-serif
|
||||
font-size 1em
|
||||
border-radius 3px
|
||||
transition all 0.5s ease
|
||||
margin 0 0 10px
|
||||
padding 0.4em 0.8em
|
||||
width calc(100% - 1.6em)
|
||||
max-width maxWidth
|
||||
float left
|
||||
&:focus
|
||||
outline none
|
||||
&:active
|
||||
transform translateY(3px)
|
||||
|
||||
input[type="submit"]
|
||||
button
|
||||
.button
|
||||
font-family "Ubuntu", sans-serif
|
||||
font-size 1em
|
||||
color black
|
||||
padding 0.5em 2em
|
||||
border-radius 3px
|
||||
box-shadow none
|
||||
border none
|
||||
text-align center
|
||||
transition all 290ms ease
|
||||
width 100%
|
||||
max-width none
|
||||
|
||||
textarea
|
||||
float left
|
||||
border 1px solid rgba(0, 0, 0, 0.5)
|
||||
border-radius 3px
|
||||
padding 0.2em 0.4em
|
||||
font-size 1em
|
||||
font-family "Open Sans", Ubuntu, sans-serif
|
||||
line-height 1.7em
|
||||
outline none
|
||||
resize vertical
|
||||
overflow auto
|
||||
|
||||
select
|
||||
// Layout
|
||||
float left
|
||||
padding 0.5em
|
||||
padding 5px 10px
|
||||
width 100%
|
||||
max-width 756px
|
||||
|
||||
// Font
|
||||
font-size 1em
|
||||
font-weight normal
|
||||
font-family inherit
|
||||
|
||||
transition all 0.5s ease
|
||||
-webkit-appearance none
|
||||
-moz-appearance none
|
||||
box-shadow 0px 1px 3px rgba(0, 0, 0, 0.1)
|
||||
user-select none
|
||||
border-radius 2px
|
||||
font-size inherit
|
||||
overflow hidden
|
||||
text-overflow ellipsis
|
||||
white-space nowrap
|
||||
|
||||
.error
|
||||
padding 1em
|
||||
background-color rgb(255, 64, 64)
|
||||
color white
|
||||
border-radius 5px
|
||||
margin-bottom 1em
|
130
styles/forum.styl
Normal file
130
styles/forum.styl
Normal file
@ -0,0 +1,130 @@
|
||||
#posts
|
||||
display flex
|
||||
flex-flow column
|
||||
flex 1
|
||||
max-width 100%
|
||||
|
||||
.post
|
||||
display flex
|
||||
flex-flow column
|
||||
margin 0.5rem 0
|
||||
|
||||
.post-author
|
||||
text-align center
|
||||
flex-grow 0
|
||||
display flex
|
||||
flex-flow row
|
||||
justify-content center
|
||||
margin-bottom -3px
|
||||
|
||||
img
|
||||
margin 0 !important
|
||||
|
||||
#post-input
|
||||
.post-input
|
||||
width 100%
|
||||
min-height 150px
|
||||
margin 0.5rem 0
|
||||
|
||||
.post-submit
|
||||
margin-top 0.5rem
|
||||
max-width 200px
|
||||
align-items flex-end
|
||||
|
||||
.post-toolbar
|
||||
display flex
|
||||
flex-flow row
|
||||
opacity 0
|
||||
transition opacity 250ms ease
|
||||
position absolute
|
||||
bottom 3px
|
||||
right 0
|
||||
|
||||
.post-save
|
||||
float right
|
||||
&:hover
|
||||
cursor pointer
|
||||
|
||||
.post-input-toolbar
|
||||
display flex
|
||||
flex-flow row
|
||||
|
||||
.post-tool
|
||||
opacity 0.7
|
||||
&:hover
|
||||
cursor pointer
|
||||
opacity 1
|
||||
|
||||
.post-likes
|
||||
opacity 0.4
|
||||
margin-right 0.4em
|
||||
&:before
|
||||
content "+"
|
||||
|
||||
.post-permalink
|
||||
color blue !important
|
||||
|
||||
.post-delete
|
||||
color rgb(255, 32, 12) !important
|
||||
|
||||
.post-like
|
||||
color green !important
|
||||
|
||||
.post-unlike
|
||||
color rgb(255, 32, 12) !important
|
||||
|
||||
.post-content
|
||||
text-align left
|
||||
flex-grow 1
|
||||
padding 0.4rem 1rem
|
||||
margin-left 0.3rem
|
||||
background uiBackground
|
||||
border uiBorder
|
||||
border-radius 3px
|
||||
position relative
|
||||
|
||||
&:hover
|
||||
background uiHoverBackground
|
||||
.post-toolbar
|
||||
opacity 1
|
||||
|
||||
h1
|
||||
font-size 1.5rem
|
||||
line-height 2em
|
||||
|
||||
h2
|
||||
font-size 1.3rem
|
||||
line-height 2em
|
||||
font-weight normal
|
||||
|
||||
h3
|
||||
font-size 1.1rem
|
||||
line-height 2em
|
||||
font-weight normal
|
||||
|
||||
.special-post
|
||||
.post-content
|
||||
border 2px solid alpha(mainColor, 70%)
|
||||
|
||||
.hidden
|
||||
display none
|
||||
|
||||
.thread
|
||||
display flex
|
||||
flex-flow column
|
||||
align-items center
|
||||
|
||||
.thread-title
|
||||
width auto
|
||||
|
||||
.posts
|
||||
width 100%
|
||||
max-width 830px
|
||||
|
||||
@media only screen and (min-width: 500px)
|
||||
.post
|
||||
flex-flow row
|
||||
justify-content center
|
||||
|
||||
.post-author
|
||||
//
|
18
styles/headers.styl
Normal file
18
styles/headers.styl
Normal file
@ -0,0 +1,18 @@
|
||||
h1
|
||||
display inline-block
|
||||
font-size 3em
|
||||
line-height 3em
|
||||
|
||||
h2
|
||||
font-size 2em
|
||||
line-height 1.5em
|
||||
font-weight bold
|
||||
width 100%
|
||||
&:first-of-type
|
||||
margin-top 0
|
||||
h3
|
||||
line-height 2em
|
||||
font-size 1.5em
|
||||
font-weight bold
|
||||
text-align left
|
||||
margin-top 0.6em
|
@ -1,3 +1,88 @@
|
||||
*
|
||||
padding 0
|
||||
margin 0
|
||||
#container
|
||||
width 100%
|
||||
height 100%
|
||||
float left
|
||||
overflow-x hidden
|
||||
overflow-y scroll
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
z-index 0
|
||||
|
||||
#emergency
|
||||
float left
|
||||
width 100%
|
||||
background-color rgb(255, 32, 32)
|
||||
color black
|
||||
padding 0.7em
|
||||
box-sizing border-box
|
||||
|
||||
#header-container
|
||||
display block
|
||||
float left
|
||||
width 100%
|
||||
height auto
|
||||
background-color transparent
|
||||
|
||||
#header
|
||||
display block
|
||||
margin 0 auto
|
||||
width 100%
|
||||
overflow hidden
|
||||
|
||||
#title, #slogan
|
||||
display block
|
||||
margin 0 auto
|
||||
width calc(100% - 3em)
|
||||
height auto
|
||||
text-align left
|
||||
|
||||
#title
|
||||
padding 1.5em
|
||||
padding-bottom 0.5em
|
||||
text-transform uppercase
|
||||
//letter-spacing 1px
|
||||
//opacity 0
|
||||
letter-spacing 6px
|
||||
h1
|
||||
line-height inherit
|
||||
a
|
||||
text-decoration none
|
||||
|
||||
#slogan
|
||||
padding 1.5em
|
||||
padding-top 0.5em
|
||||
line-height 1.3em
|
||||
|
||||
#content-container
|
||||
display block
|
||||
float left
|
||||
width 100%
|
||||
height auto
|
||||
background-color transparent
|
||||
|
||||
#content
|
||||
float left
|
||||
width 100%
|
||||
height 100%
|
||||
min-height 100%
|
||||
padding 1.5em
|
||||
line-height 1.7em
|
||||
text-align center
|
||||
box-sizing border-box
|
||||
& > div
|
||||
float left
|
||||
width 100%
|
||||
text-align center
|
||||
|
||||
.header-logged-in
|
||||
background-image none !important
|
||||
|
||||
.navigation-link-left
|
||||
float left
|
||||
|
||||
.navigation-link-right
|
||||
float right
|
||||
|
||||
.navigation-icon-no-title
|
||||
margin-right 0 !important
|
95
styles/loading.styl
Normal file
95
styles/loading.styl
Normal file
@ -0,0 +1,95 @@
|
||||
duration = 0.8s
|
||||
size = 24px
|
||||
|
||||
#loading-animation
|
||||
display block
|
||||
position fixed
|
||||
bottom 1.15rem
|
||||
right calc(1.15rem + 17px)
|
||||
pointer-events none
|
||||
|
||||
.sk-cube-grid
|
||||
width size
|
||||
height size
|
||||
transform rotateZ(0deg)
|
||||
animation sk-rotate duration infinite linear
|
||||
|
||||
.sk-cube
|
||||
width 33.3%
|
||||
height 33.3%
|
||||
background-color alpha(linkHoverColor, 70%)
|
||||
box-shadow 0 0 size alpha(linkHoverColor, 80%)
|
||||
float left
|
||||
animation sk-cube-grid duration infinite linear
|
||||
border-radius 100%
|
||||
|
||||
.sk-cube5
|
||||
background-color linkHoverColor
|
||||
box-shadow 0 0 size alpha(linkHoverColor, 90%)
|
||||
|
||||
.sk-cube1
|
||||
.sk-cube3
|
||||
.sk-cube7
|
||||
.sk-cube9
|
||||
visibility hidden
|
||||
|
||||
@keyframes sk-cube-grid
|
||||
0%, 100%
|
||||
transform scale3D(0.4, 0.4, 0.4)
|
||||
50%
|
||||
transform scale3D(0.9, 0.9, 0.9)
|
||||
|
||||
@keyframes sk-rotate
|
||||
0%
|
||||
transform rotateZ(0deg)
|
||||
100%
|
||||
transform rotateZ(360deg)
|
||||
|
||||
// Anime list loading
|
||||
.sk-folding-cube
|
||||
margin 20px auto
|
||||
width 40px
|
||||
height 40px
|
||||
position relative
|
||||
transform rotateZ(45deg)
|
||||
.sk-cube
|
||||
float left
|
||||
width 50%
|
||||
height 50%
|
||||
position relative
|
||||
transform scale(1.1)
|
||||
&:before
|
||||
content ''
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background-color mainColor
|
||||
animation sk-foldCubeAngle 2.4s infinite linear both
|
||||
transform-origin 100% 100%
|
||||
.sk-cube2
|
||||
transform scale(1.1) rotateZ(90deg)
|
||||
&:before
|
||||
animation-delay 0.3s
|
||||
.sk-cube3
|
||||
transform scale(1.1) rotateZ(180deg)
|
||||
&:before
|
||||
animation-delay 0.6s
|
||||
.sk-cube4
|
||||
transform scale(1.1) rotateZ(270deg)
|
||||
&:before
|
||||
animation-delay 0.9s
|
||||
|
||||
@keyframes sk-foldCubeAngle
|
||||
0%, 10%
|
||||
transform perspective(140px) rotateX(-180deg)
|
||||
opacity 0
|
||||
|
||||
25%, 75%
|
||||
transform perspective(140px) rotateX(0deg)
|
||||
opacity 1
|
||||
|
||||
90%, 100%
|
||||
transform perspective(140px) rotateY(180deg)
|
||||
opacity 0
|
62
styles/mobile.styl
Normal file
62
styles/mobile.styl
Normal file
@ -0,0 +1,62 @@
|
||||
@media only screen and (max-width: 1024px)
|
||||
#header
|
||||
background-image none
|
||||
|
||||
@media only screen and (max-width: 930px)
|
||||
#title, #slogan
|
||||
display none
|
||||
|
||||
.navigation-text
|
||||
display none
|
||||
|
||||
.navigation-button i.fa
|
||||
margin-right 0
|
||||
|
||||
.episodes-behind
|
||||
&:before
|
||||
content '+'
|
||||
&:after
|
||||
content ''
|
||||
|
||||
#content
|
||||
padding 1em
|
||||
|
||||
#header
|
||||
text-align center
|
||||
|
||||
#navigation
|
||||
float none
|
||||
display inline-block
|
||||
width auto
|
||||
|
||||
@media only screen and (min-width: 1100px)
|
||||
.anime-list-image
|
||||
display block
|
||||
|
||||
@media only screen and (max-width: 560px)
|
||||
#navigation
|
||||
padding 0
|
||||
|
||||
.navigation-link-right
|
||||
display none
|
||||
|
||||
.navigation-button i.fa
|
||||
font-size 1.5em
|
||||
|
||||
// Remove admin icon
|
||||
@media only screen and (max-width: 612px)
|
||||
.navigation-link-right[href='/admin']
|
||||
display none
|
||||
|
||||
@media only screen and (max-width: 320px)
|
||||
.navigation-button i.fa
|
||||
font-size 1.4em
|
||||
|
||||
@media only screen and (max-height: 700px)
|
||||
.anime-list-image
|
||||
top 0.5em
|
||||
transform translate(10%, 0)
|
||||
|
||||
.anime:hover
|
||||
.anime-list-image
|
||||
transform translate(0, 0)
|
36
styles/navigation.styl
Normal file
36
styles/navigation.styl
Normal file
@ -0,0 +1,36 @@
|
||||
#navigation
|
||||
float left
|
||||
width 100%
|
||||
margin 0 auto
|
||||
width 100%
|
||||
height 100%
|
||||
padding 0 1.5em
|
||||
z-index 0
|
||||
box-sizing border-box
|
||||
|
||||
.navigation-link
|
||||
display inline-block
|
||||
height 100%
|
||||
text-decoration none
|
||||
position relative
|
||||
&:after
|
||||
content ""
|
||||
display block
|
||||
margin auto
|
||||
margin-top 0
|
||||
height 3px
|
||||
width 0px
|
||||
transition all 500ms ease
|
||||
&.active
|
||||
&:hover
|
||||
cursor pointer
|
||||
text-decoration none
|
||||
&:after
|
||||
width 100%
|
||||
background-color rgb(248, 165, 130)
|
||||
|
||||
.navigation-button
|
||||
padding 0.75em 1em
|
||||
font-size 1.1em
|
||||
line-height 1em
|
||||
transition all 290ms ease
|
58
styles/reset.styl
Normal file
58
styles/reset.styl
Normal file
@ -0,0 +1,58 @@
|
||||
html, body, div, span, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, address, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, samp,
|
||||
small, strong, sub, sup, var,
|
||||
b, i,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video, main
|
||||
outline 0
|
||||
border 0
|
||||
font-size 100%
|
||||
font inherit
|
||||
vertical-align baseline
|
||||
background transparent
|
||||
|
||||
html
|
||||
box-sizing border-box
|
||||
|
||||
textarea
|
||||
resize vertical
|
||||
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section
|
||||
display block
|
||||
|
||||
body
|
||||
line-height 1
|
||||
|
||||
ol, ul
|
||||
list-style none
|
||||
|
||||
blockquote, q
|
||||
quotes none
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after
|
||||
content ''
|
||||
content none
|
||||
|
||||
table
|
||||
border-collapse collapse
|
||||
border-spacing 0
|
||||
|
||||
audio, canvas, img, video, input, select
|
||||
vertical-align middle
|
||||
|
||||
:focus
|
||||
outline 0
|
||||
|
||||
*
|
||||
margin 0
|
||||
padding 0
|
||||
box-sizing inherit
|
19
styles/settings.styl
Normal file
19
styles/settings.styl
Normal file
@ -0,0 +1,19 @@
|
||||
.category
|
||||
flex 1
|
||||
min-width 300px
|
||||
max-width 100%
|
||||
|
||||
.categories
|
||||
display flex
|
||||
flex-flow row wrap
|
||||
|
||||
.field
|
||||
float left
|
||||
width 100%
|
||||
padding 0 0.5em
|
||||
box-sizing border-box
|
||||
|
||||
.value
|
||||
margin-left 0.5em
|
||||
font-weight bold
|
||||
font-size 1.1em
|
5
styles/staff.styl
Normal file
5
styles/staff.styl
Normal file
@ -0,0 +1,5 @@
|
||||
#staff-info
|
||||
display none
|
||||
float left
|
||||
width 100%
|
||||
text-align left
|
33
styles/user.styl
Normal file
33
styles/user.styl
Normal file
@ -0,0 +1,33 @@
|
||||
avatarSize = 50px
|
||||
|
||||
.user-list
|
||||
width 100%
|
||||
display flex
|
||||
flex-flow row wrap
|
||||
|
||||
.user
|
||||
display block
|
||||
transform scale(1.0)
|
||||
width avatarSize
|
||||
height avatarSize
|
||||
border-radius 100%
|
||||
margin 0.2em
|
||||
&:hover
|
||||
.user-image
|
||||
box-shadow 0 0 8px rgb(0, 0, 0)
|
||||
|
||||
.user-image
|
||||
opacity 0
|
||||
transition all 250ms ease
|
||||
border-radius 100%
|
||||
margin 0 !important
|
||||
width avatarSize
|
||||
height avatarSize
|
||||
object-fit cover
|
||||
|
||||
svg.user-image
|
||||
circle.body
|
||||
fill rgb(60, 60, 60)
|
||||
text
|
||||
fill white
|
||||
font-size 0.65rem
|
7
styles/video.styl
Normal file
7
styles/video.styl
Normal file
@ -0,0 +1,7 @@
|
||||
.video-container
|
||||
float left
|
||||
width 100%
|
||||
|
||||
.video
|
||||
width 100%
|
||||
height 100vh
|
Loading…
Reference in New Issue
Block a user