Forum Settings
Forums

✿; crayon for mal inspired list layout (v0.3-feb9)

New
Jan 17, 2016 4:21 PM
#1
Offline
Jul 2018
564612
feb9: new headers, new top bar and other fixes

a simple colourful & minimalistic list layout based on sunnysummerday's crayon theme

goal: to make it look as minimalistic and similar to the seasonal anime page with crayon's theme
optimized to view in: chrome
compatibility: chrome (perfect) firefox (good?) opera (good?)




specs:
✿; for anime lists only
✿; showing one category when you open list
✿; tags on hover (optional)
✿; tested in chrome (works)
✿; tested in firefox (works)
✿; colorful & minimalistic
✿; custom scroll bar (only works in chrome!)
✿; no "more" button
✿; unique edit button (the green color below anime covers)
✿; can mark favorite animes (optional)

code

covers

options to be ticked

tags (optional)

mark favorite anime (optional)

additional bg's
even more?! click here or here!



credits:
✿; sunnysummerday for the mal theme and seasonal anime page coding which lead to the idea of this layout
✿; recuvan for helping me fix bugs and top bar
✿; deividas for tags code and icons
✿; nymphiae for scroll bar code
✿; shishio-kun's club for other small codes which helped me

questions, feedback, comments:
✿; this layout was tested in chrome, firefox and works fine
✿; any questions, feedback, criticism, etc is welcome.
✿; solely based on seasonal anime page with crayon theme
✿; was actually made for personal use but decided to share it!
✿; the code is probably a mess. sorry, i'm not that experienced with codes.
✿; you are free to edit, take anything as long as you credit/don't remove the credits.
✿; hope you like the layout;
etc: message me if you find any bugs and i will try my best to fix them for you!
removed-userFeb 9, 2016 2:07 PM
Jan 17, 2016 5:17 PM
#2
Offline
Jul 2018
564612
Good job man! This layout looks really fresh!
removed-userJan 17, 2016 5:24 PM
Jan 17, 2016 10:59 PM
#3

Offline
Jan 2013
13161
looks really nice! meshes with sunny's theme perfectly c:
Jan 18, 2016 8:37 AM
#4

Offline
Apr 2015
1841
It's better than mine \0/
Jan 18, 2016 9:21 AM
#5

Offline
Jun 2014
9689
Looks neat! Though I still think the black looks out of place >.>
Jan 18, 2016 10:00 AM
#6
Offline
Jul 2018
564612
Love said:
compatibility: chrome (perfect) firefox (almost perfect?)

I've just optimized it so it should work well on Chrome, Edge, Firefox, Opera and Safari.
removed-userJan 18, 2016 10:04 AM
Jan 18, 2016 10:05 AM
#7

Offline
Nov 2015
5
You guys are great !
Jan 18, 2016 10:31 AM
#8

Offline
Jul 2009
5266
Awesome design ^^
Jan 22, 2016 10:03 AM
#9
Offline
Jul 2018
564612
update!
- changed the black bar since people complained it looked out of place
- sorting links have been fixed
- covers look more "high quality" now
Jan 23, 2016 8:55 PM

Offline
Nov 2011
44
Woah, really amazing. I've just installed @sunnysummerday design then I saw this and added it. My pages look so wonderful now. Thanks so much! <3

Some questions:
(1) I can't seem to find where to change the "love's anime list" to my user name. I must be looking at the wrong file but not sure. :/
(2) Is it possible to have the "total" box aligned differently, for example right-aligned or center-aligned? Just for a bit of style. If it's not possible that's okay though. :)
(3) The sorting method texts seem different in terms of bold, check my list to see that some text seems bolder than the others.
phio_chanJan 23, 2016 10:15 PM

avatar by @Fuchsia
Jan 23, 2016 11:47 PM
Offline
Jul 2018
564612
phio_chan said:
Woah, really amazing. I've just installed @sunnysummerday design then I saw this and added it. My pages look so wonderful now. Thanks so much! <3

Some questions:
(1) I can't seem to find where to change the "love's anime list" to my user name. I must be looking at the wrong file but not sure. :/
(2) Is it possible to have the "total" box aligned differently, for example right-aligned or center-aligned? Just for a bit of style. If it's not possible that's okay though. :)
(3) The sorting method texts seem different in terms of bold, check my list to see that some text seems bolder than the others.

it's in the code:
#inlinecontent::after {
    color: #606060 !important;
    content: "love\'s anime list";
    font-size: 15px !important;
    font-style: normal !important;
    font-weight: normal !important;
    letter-spacing: normal !important;
    padding: 5px 10px 9px 15px !important;
}

change the content to whatever you like.

2] err do you mean the category totals? it's already center aligned tho? o.o
edit: oh i get what you mean now, you can't align it. it will be next to the covers. for example check my list. it's basically a cover too. add a new anime entry to your watching list and it will be beside the totals (in your list). that's how it works.

3] ah yes, the sorting method text, i'll fix it today. need to fix the text, not supposed to be bold so stay tuned for updates. ;x
Jan 24, 2016 12:27 AM

Offline
Nov 2011
44
Love said:
phio_chan said:
Woah, really amazing. I've just installed @sunnysummerday design then I saw this and added it. My pages look so wonderful now. Thanks so much! <3

Some questions:
(1) I can't seem to find where to change the "love's anime list" to my user name. I must be looking at the wrong file but not sure. :/
(2) Is it possible to have the "total" box aligned differently, for example right-aligned or center-aligned? Just for a bit of style. If it's not possible that's okay though. :)
(3) The sorting method texts seem different in terms of bold, check my list to see that some text seems bolder than the others.

it's in the code:
#inlinecontent::after {
    color: #606060 !important;
    content: "love\'s anime list";
    font-size: 15px !important;
    font-style: normal !important;
    font-weight: normal !important;
    letter-spacing: normal !important;
    padding: 5px 10px 9px 15px !important;
}

change the content to whatever you like.

2] err do you mean the category totals? it's already center aligned tho? o.o
edit: oh i get what you mean now, you can't align it. it will be next to the covers. for example check my list. it's basically a cover too. add a new anime entry to your watching list and it will be beside the totals (in your list). that's how it works.

3] ah yes, the sorting method text, i'll fix it today. need to fix the text, not supposed to be bold so stay tuned for updates. ;x

Perfect, thanks a lot! Now it works. No worries about the 'total' box and the sorting method text, take your time. Again thanks a lot for the codes! :D

avatar by @Fuchsia
Jan 24, 2016 5:14 AM
Offline
Jul 2018
564612
phio_chan said:
Perfect, thanks a lot! Now it works. No worries about the 'total' box and the sorting method text, take your time. Again thanks a lot for the codes! :D

fixed the sorting method text now :) hope you like it!
Jan 24, 2016 5:38 AM

Offline
Nov 2011
44
Love said:
phio_chan said:
Perfect, thanks a lot! Now it works. No worries about the 'total' box and the sorting method text, take your time. Again thanks a lot for the codes! :D

fixed the sorting method text now :) hope you like it!

Thanks a lot! Though I still see it bold in my list. Do I need to update the codes or something? I did clear browser's history, cache, and cookies before checking my list again.


avatar by @Fuchsia
Jan 24, 2016 5:45 AM
Offline
Jul 2018
564612
phio_chan said:
Love said:

fixed the sorting method text now :) hope you like it!

Thanks a lot! Though I still see it bold in my list. Do I need to update the codes or something? I did clear browser's history, cache, and cookies before checking my list again.


i updated the code in my first post. copy n paste the code again. it doesn't auto-update ;c

p.s: if you want this delicious change to the headers, let me know. i designed it for myself, so literally there's 2 versions of the headers. if you like this one, i can give you the code for it.
Jan 24, 2016 5:56 AM

Offline
Nov 2011
44
Love said:
phio_chan said:

Thanks a lot! Though I still see it bold in my list. Do I need to update the codes or something? I did clear browser's history, cache, and cookies before checking my list again.


i updated the code in my first post. copy n paste the code again. it doesn't auto-update ;c

p.s: if you want this delicious change to the headers, let me know. i designed it for myself, so literally there's 2 versions of the headers. if you like this one, i can give you the code for it.

Sorry! I really didn't think about updating the code. ;__; It works and looks pretty now, thanks a lot!

Ooh, your header version looks delicious indeed! I'm still enjoying the current layout though so I'll probably poke you later when I need the change. Or you can PM me the codes! Thanks again. <3

avatar by @Fuchsia
Jan 24, 2016 11:14 AM
Offline
Jul 2018
564612
#OffTopic
It looks nice with darker backgrounds imho
Jan 24, 2016 3:05 PM
Offline
Jul 2018
564612
@sunnysummerday - calm your nips, suonny 。◕ ‿ ◕。
Feb 9, 2016 9:57 AM
Offline
Jul 2018
564612
update: new headers, new top bar and other fixes
please copy and paste the new code, edited in the first post!
Feb 9, 2016 12:08 PM
Offline
Feb 2016
2
Nice work and beautiful implementation for the layout! Well done.
Webmaster of Anime Wallpapers HD
Feb 9, 2016 6:18 PM

Offline
Nov 2011
44
Looking great as always, @Love! Though the top menu doesn't appear to me (only 'Search' is visible, the other text is missing from that line).

Another stupid question, I guess we need to sign up at colourlover to be able to download more patterns?

avatar by @Fuchsia
Feb 9, 2016 8:26 PM
Offline
Jul 2018
564612
Ooh, thank you, I'm using this now...
Feb 9, 2016 9:16 PM
Offline
Jul 2018
564612
phio_chan said:
Looking great as always, @Love! Though the top menu doesn't appear to me (only 'Search' is visible, the other text is missing from that line).

Another stupid question, I guess we need to sign up at colourlover to be able to download more patterns?

um it's supposed to be that way, no text so we can see the pretty colors at the top when we scroll d:
and er, not really. you need to open a pattern and click inspect element and copy the link in "background-image" till .png
Feb 9, 2016 9:18 PM

Offline
Jul 2012
48248
good job!! not using it but it looks cute.
Feb 9, 2016 11:04 PM

Offline
Nov 2011
44
Love said:
phio_chan said:
Looking great as always, @Love! Though the top menu doesn't appear to me (only 'Search' is visible, the other text is missing from that line).

Another stupid question, I guess we need to sign up at colourlover to be able to download more patterns?

um it's supposed to be that way, no text so we can see the pretty colors at the top when we scroll d:
and er, not really. you need to open a pattern and click inspect element and copy the link in "background-image" till .png

Ah okay lol, sorry for the stupid question. I guess it'll take time to get used to the new design, though I like it as much as the old one. ;) Thank you again!

edit: Ah, didn't realize the text appears when you hover at the color blocks. It didn't work that way previously, that's why I was confused lol.
phio_chanFeb 10, 2016 6:14 AM

avatar by @Fuchsia
Nov 12, 2016 1:45 PM
Offline
Jul 2013
2
Seems like the anime cover's are missing again ono not sure if that's why but the complete list goes a little over a anime box and the anime list/score is a little weird ( http://sta.sh/0173bou3m4pc ) the only that might have change is chrome's newest update which made stuff alot bigger
Feb 7, 2018 2:30 PM
Offline
Jan 2018
3
i'm having some problems with ur theme :c

More topics from this board

» Share Your YouTube Channel/Videos! ( 1 2 3 4 5 ... Last Page )

nin-tendo - Dec 16, 2022

362 by nin-tendo »»
Yesterday, 11:56 AM

» Protect or punish?

DollzchanAi - Apr 18

4 by DollzchanAi »»
Yesterday, 6:15 AM

» BL reference in Tomodachi Life

Kinspie13 - Apr 24

4 by Kinspie13 »»
Apr 24, 9:41 PM

» How to Export/Backup Your Anime List Automatically! (TamperMonkey Script)

hacker09 - May 18, 2020

3 by Vapor_AU »»
Apr 24, 8:41 PM

» advice for someone returning to art

Crystepsi - Apr 4

5 by haaku-san »»
Apr 24, 4:21 PM
It’s time to ditch the text file.
Keep track of your anime easily by creating your own list.
Sign Up Login