Forum Settings
Forums

[List Design] Takana no Hana's layout collection - New Updated: -Homura Akemi minimalistic layout (Madoka Magica)-.

New
Feb 28, 2016 7:18 PM
#1

Offline
Nov 2009
1632
This layout is custom CSS. If you don't know how to install it, use the easy Beginner's Tutorial

This design can be used for anime list. For more layouts check the full list of Premade Layouts.


I figure out I will just put all my layouts into a topic for easy browsing. Hope you guys enjoy!

A layout might has 2 versions which you can choose from.

----------o0o----------


    Important: List setting for all layouts
  • 1/The list uses classic template. Please change every "USERNAME" text in the codes into your own MAL username.
  • 2/Go to your Account Setting->List.

  • 3/The list is not designed to display all categories, set your Default Status Selected to anything except "show all".



    How to use the short-review section.
  1. Click on the "edit" option
  2. Then add your short-review/comments in the tag section.







----------o0o----------


New Layout Updated!!


-Homura Akemi minimalistic layout (Madoka Magica)-

(click for full size)


Codes:
/* Change USERNAME to your MAL username, this displays your own anime covers */
@import "http://mal-image.appspot.com/anime/USERNAME";
/* Main code*/
@import url(https://dl.dropboxusercontent.com/u/118667597/AkemiHomura/HomuraV1.css);

/*Enter your MAL username or any desired name after content*/
:nth-child(5) .header_title::before {
content: "USERNAME";
}





Version 2 Update!!!


(none)


----------o0o----------


Hibike! Euphonium layout.








----------o0o----------


1/ Yahari Ore no Seishun theme layout.






    Note:The short-review section is actually the tag section.
  1. Click on the "edit" option
  2. Then add your short-review/comments in the tag section.


The list isn't the final version yet, some improvements might be made in the future. If you have any suggestions or ideas, feel free to drop in.

----------o0o----------


2/ Oshino Shinobu theme: A cloudy day.




Credits:
_ Thanks Doomcat55 for bug fixes.

----------o0o----------


3/ A layout based on the anime "Grimgar of Fantasy and Ash theme layout."










**New updated menu for both versions**


Credits:
_ Thanks Doomcat55 for fixing codes.
_ Hahaido for the top menu bar.



----------o0o----------


4/ A layout based on the anime "Erased", one of my favorite show.



Effects:
_ Sliding animation for the starry sky background.
_ Snow effects.





Credits:
_ Thanks Doomcat55 for helping me with the codes.
_ Thanks Hahaido for some css codes.
_ Thanks /r/anime for the Satoru render on the bottom right. [/spoiler]


----------o0o----------



5/ A Tomori Nao theme-list from the anime Charlotte in a beautiful but late Sunset! This is my third attempt at creating a list and my first published list to the club.


Current version: V2 (updated on 05/02/16)


Effects:
_ A short animated intro to present the list.
_ An effect of drifting stars .
_ A special effect of misty cloud which blends well with the background, represents the sunset.









Credits:
_ The list was modified from Madoka template from TheHolyPotato, big thanks to him.
_ Thanks Doomcat for helping me with bug fixes.
_ Thanks Yorium for showing me a few tricks to use in pts to design the list.




----------o0o----------


+ If you have any question or request, feel free to comment here or message me.
+ You are free to edit anything in the code as long as you keep the credits.
Takana_no_HanaApr 12, 2016 3:53 AM
Feb 28, 2016 7:25 PM
#2

Offline
Mar 2014
645
sickkkk that looks super great. i might install your layout actually thanks for putting your effort into this!
Feb 29, 2016 3:20 AM
#3

Offline
Nov 2009
1632
Thanks, I have updated a new topbar menu for the list
Feb 29, 2016 3:39 PM
#4

Offline
Feb 2010
11293
Beautiful and fun layouts; you've become very strong with imagery, color, and making icons!
Feb 29, 2016 9:23 PM
#5

Offline
Nov 2009
1632
Shishio-kun said:
Beautiful and fun layouts; you've become very strong with imagery, color, and making icons!

Thank you very much, I learn a lot from your club. All of the css tutorials are very useful.


---o0o---

I updated the Grimgar layout a bit:
_ Icons are smaller.
_ Move menu to the right top side.

These are probably the final changes to the list. Or until I find a nice set of icons to replace the current category icons.
Feb 29, 2016 10:57 PM
#6

Offline
Jun 2015
48
great layout design! :D i've seen your post on the reddit about these layouts~

any plan for making layout design for any other anime?

keep up the good work mate ^o^
Feb 29, 2016 11:12 PM
#7

Offline
Nov 2009
1632
Thanks!

I plan to make a layout for bakemonogatari up next, I already have some designs in mind. Though I can't say when will I finish. I also plan to make a simple layout for easy customization.

But MAL will stop supporting classic list in a month, so if I can't finish the next layout within a month, it will have to wait for a period of time.
Mar 1, 2016 12:58 PM
#8

Offline
Feb 2010
11293
Takana_no_Hana said:

But MAL will stop supporting classic list in a month, so if I can't finish the next layout within a month, it will have to wait for a period of time.


Where do you read that they will stop supporting classic a month from now?

What I've been told by Kineta is that we can expect classic support to exist until at least until April 15th, and that is not a set date for it ending, so it may continue well beyond that.
Mar 1, 2016 2:42 PM
#9

Offline
Nov 2009
1632
Shishio-kun said:

Where do you read that they will stop supporting classic a month from now?

What I've been told by Kineta is that we can expect classic support to exist until at least until April 15th, and that is not a set date for it ending, so it may continue well beyond that.


My bad then, hopefully they still continue to support the classic.
Mar 2, 2016 8:07 PM

Offline
Feb 2010
11293
Takana_no_Hana said:
Shishio-kun said:

Where do you read that they will stop supporting classic a month from now?

What I've been told by Kineta is that we can expect classic support to exist until at least until April 15th, and that is not a set date for it ending, so it may continue well beyond that.


My bad then, hopefully they still continue to support the classic.


Oh good, I thought they made some stealth announcement that would screw us hard ha.

They should continue support via just updating the old one with some new features and then leaving it be. Mandatory updates suck; choice is good. Classic is simpler and many ppl like that about it who don't use custom CSS- btw that's something I didn't see that coming lol
Mar 3, 2016 10:46 PM

Offline
Nov 2009
1632
I have created a simple layout for Oshino Shinobu fans out there. Enjoy!



Codes:

/* Change USERNAME to your MAL username, this displays your own anime covers */
@import "http://mal-image.appspot.com/anime/USERNAME";

/* Main code */
@import url(https://dl.dropboxusercontent.com/u/118667597/Shinobu/ShinobuV2Simple.css);
{}
Mar 4, 2016 8:39 AM

Offline
Aug 2013
4
These are great.

One question, is there a reason they don't seem to work in google chrome?
It worked in chrome last week but now none of these show up in chrome.
Mar 4, 2016 11:11 AM

Offline
Nov 2015
995
I have to take this layout! Shinobu is awesome + the design is great and everything is easy to read.. you did a great job.
Mar 4, 2016 11:40 AM

Offline
Jul 2015
3151
Wow, these are really great list designs. Awesome job.
Mar 4, 2016 3:13 PM

Offline
Nov 2009
1632
Jimmydamage said:
These are great.

One question, is there a reason they don't seem to work in google chrome?
It worked in chrome last week but now none of these show up in chrome.

It's best suited for Chrome because it's the browser that I designed on, I'm running on Chrome and they appear just fine. Probably due to adblock which blocks the import code because it thinks it's an ad.

Here's how to fix (thanks to Doomcat)

Confirmed that it is Adblock picking up @imports as ads for some reason. Fix by going to any list, selecting Adblock's "Don't run on pages in this domain", and adjusting the slider until it reads "myanimelist.net/animelist". Same for mangalists.

Another quick fix:
Found an easier way thanks to what Koolman511 said... Go to Adblock > Options > Filter Lists and hit Update Now. This'll also solve the problem of not being able to click on links to CSS hosted on Dropbox.
Takana_no_HanaMar 4, 2016 3:26 PM
Mar 4, 2016 5:22 PM

Offline
Feb 2010
11293
Wow your growth is crazy. The new Shinobu girl layout is alot of fun to use. and pleasant to look at.
Mar 9, 2016 4:58 PM

Offline
Nov 2009
1632
So here's the Yahari Ore no Seishun theme layout I have been making this week. Hope you guys enjoy.






Notes:

  • The list isn't the final version yet, some improvements might be made in the future.


If you have any suggestions or ideas, feel free to drop in.
Mar 9, 2016 8:56 PM
Offline
Aug 2014
1
How do you make the list to show the picture of the anime
Mar 10, 2016 6:57 AM
Offline
Dec 2013
1
THANKS these are AWESOME!!!
Mar 12, 2016 7:33 PM

Offline
Nov 2009
1632
Thanks guys,

I just made some improvements for the Yahari layout:


  • Increase the list's length a bit.
  • in the Watching section (took me 1 hour to edit the picture from a magazine source.)
  • Some minor improvements for the menu.



    Note:The short-review section is actually the tag section.
  1. Click on the "edit" option
  2. Then add your short-review/comments in the tag section.

I plan to remake the left side menu completely but I will leave that for now.


Memori_ said:
How do you make the list to show the picture of the anime

You can find the tut in here.
Takana_no_HanaMar 13, 2016 4:55 AM
Mar 13, 2016 3:12 AM
Offline
Jul 2018
564612
I am not getting the comments section for some reason. It's showing blank.
Mar 13, 2016 4:48 AM

Offline
Nov 2009
1632
xaos12 said:
I am not getting the comments section for some reason. It's showing blank.

The comment section is actually the tag section, my bad.
You can add comments by clicking "edit" and add your comment on the tag section.
Mar 13, 2016 4:51 AM
Offline
Jul 2018
564612
Takana_no_Hana said:
xaos12 said:
I am not getting the comments section for some reason. It's showing blank.

The comment section is actually the tag section, my bad.
You can add comments by clicking "edit" and add your comment on the tag section.


Thanks for that, fixed now. Anyway this design looks great!

The Erased one is perhaps the best of all.
Mar 19, 2016 11:09 PM

Offline
Nov 2009
1632
Updated Hibike! Euphonium layout.







Codes:
/* Change USERNAME to your MAL username, this displays your own anime covers */
@import "http://mal-image.appspot.com/anime/USERNAME";
@import url(https://dl.dropboxusercontent.com/u/118667597/Hibike/HibikeEuphoniumV1.css);
{}
Takana_no_HanaMar 22, 2016 10:20 PM
Mar 22, 2016 10:19 PM

Offline
Nov 2009
1632
Update Hibike! Euphonium V2 layout:
Click to see the full size image


Changes:

  • Added a Spring-feel background
  • The anime list now has a blur background effect (instead of just the usual see-through).
  • Some minor changes.


Codes:
/* Change USERNAME to your MAL username, this displays your own anime covers */
@import "http://mal-image.appspot.com/anime/USERNAME";
@import url(https://dl.dropboxusercontent.com/u/118667597/Hibike/HibikeEuphoniumV2.css);
{}
Mar 27, 2016 4:27 PM

Offline
Nov 2009
1632
-Homura Akemi minimalistic layout (Madoka Magica)-
(Click to see the full size image)


Codes:
/* Change USERNAME to your MAL username, this displays your own anime covers */
@import "http://mal-image.appspot.com/anime/USERNAME";
/* Main code*/
@import url(https://dl.dropboxusercontent.com/u/118667597/AkemiHomura/HomuraV1.css);
{}

Bonus: Here is the banner in full size which I made it into a wallpaper for anyone interests.
Takana_no_HanaMar 27, 2016 4:38 PM
Mar 29, 2016 3:30 AM

Offline
Nov 2009
1632
*Slight update* for the minimalistic Homura layout, now you can enter your username on the list.


---o0o---


Hey guys, here's a head up, in a few weeks MAL will probably end up not supporting classic template. Which potentially means, a lot of the current designs would be unusable (though I'm not too sure since there aren't any official news about this but it has happened before according to Shishio).

I plan to continue making the series of minimalistic layout for Madoka Magica (currently making one for Madoka, and then Madoka x Homura theme, finally a Kyouko theme after). So I will import these series of layout first into the new list structure and do the rest later on (it can take months depended on my free time).

If you have any request (which layout would you want to be imported, or any ideas for up coming layouts), please let me know.
Apr 6, 2016 11:05 PM

Offline
Jan 2013
137
Thank you, your design is awesome!

By the way, where's the link about Homura Akemi minimalistic layout for manga list?
Apr 7, 2016 2:21 AM

Offline
Feb 2010
11293
Takana_no_Hana said:

Hey guys, here's a head up, in a few weeks MAL will probably end up not supporting classic template. Which potentially means, a lot of the current designs would be unusable (though I'm not too sure since there aren't any official news about this but it has happened before according to Shishio).


What are you saying I said "has happened before" exactly?

I'm pretty sure I never said they changed the old CSS if that's what you're saying. They've altered it slightly over the years, but never made it unusable. This current new CSS they have changed since its creation. That was something I posted recently you might be quoting. Several early layouts we took a lot of time to make for it were rendered unusable and never saw use
Apr 7, 2016 5:08 AM

Offline
Nov 2009
1632
Shishio-kun said:

What are you saying I said "has happened before" exactly?

I'm pretty sure I never said they changed the old CSS if that's what you're saying. They've altered it slightly over the years, but never made it unusable. This current new CSS they have changed since its creation. That was something I posted recently you might be quoting. Several early layouts we took a lot of time to make for it were rendered unusable and never saw use


I thought u meant the old design would be unusable, mb :P.
Since a lot of people have changed to the new CSS, I will probably try to experiment with the new CSS soon.


vaan_tw said:
Thank you, your design is awesome!

By the way, where's the link about Homura Akemi minimalistic layout for manga list?

Here's the code for it
/* Change USERNAME to your MAL username, this displays your own manga covers */
@import "http://mal-image.appspot.com/manga/USERNAME";

/* Main code*/
@import url(https://dl.dropboxusercontent.com/u/118667597/AkemiHomura/Manga/HomuraMangaV1.css);

{}
Apr 7, 2016 5:27 AM

Offline
Apr 2016
410
This looks extremely well done, keep it up!
Apr 27, 2016 6:11 PM

Offline
Oct 2013
4
Hello :) your Layouts are awesome. I will use Oshino Shinobu one, but hasn't anime cover when i put cursor on it? Or i do something wrong in copy paste the code...
Falx92Apr 27, 2016 6:15 PM
Apr 27, 2016 10:24 PM

Offline
Nov 2009
1632
Falx92 said:
Hello :) your Layouts are awesome. I will use Oshino Shinobu one, but hasn't anime cover when i put cursor on it? Or i do something wrong in copy paste the code...

Hi, due to some performance issues I didn't add in the code for covers because it will slow down your browser a lot.
So Shinobu theme is the only layout which doesn't have cover function.
Apr 28, 2016 3:44 AM

Offline
Oct 2013
4
Takana_no_Hana said:
Falx92 said:
Hello :) your Layouts are awesome. I will use Oshino Shinobu one, but hasn't anime cover when i put cursor on it? Or i do something wrong in copy paste the code...

Hi, due to some performance issues I didn't add in the code for covers because it will slow down your browser a lot.
So Shinobu theme is the only layout which doesn't have cover function.
No problem :) I have only another question. Why the top immage is cut on my display :(
http://oi64.tinypic.com/2zf0gty.jpg
Apr 28, 2016 4:47 PM

Offline
Nov 2009
1632
Falx92 said:
Takana_no_Hana said:

Hi, due to some performance issues I didn't add in the code for covers because it will slow down your browser a lot.
So Shinobu theme is the only layout which doesn't have cover function.
No problem :) I have only another question. Why the top immage is cut on my display :(
http://oi64.tinypic.com/2zf0gty.jpg

seems like I was unable to find the fix. I design it using my small screen latop so yeah the display could be weird on larger screen.

I will revisit the layout once I have more time though.
Apr 29, 2016 3:09 AM

Offline
Oct 2013
4
Takana_no_Hana said:

seems like I was unable to find the fix. I design it using my small screen latop so yeah the display could be weird on larger screen.

I will revisit the layout once I have more time though.


Yeah i think the issue is something pertinent with monitor size. Desktop PC 1980x1080 cut the picture and portable 1366x768 is fine...
Jun 3, 2016 3:10 PM

Offline
Jan 2016
14
Thanks! These look amazing!

More topics from this board

» Anime hoodies - Would you wear it ?

abambata - Apr 17

1 by DesuMaiden »»
5 hours ago

» What software(s) and hardware(s) do you use for digital drawings?

DesuMaiden - Apr 16

11 by DesuMaiden »»
5 hours ago

» Have you tried using lmms?

Cammell - 7 hours ago

0 by Cammell »»
7 hours ago

» Help me modify this layout

Luffie00 - Yesterday

0 by Luffie00 »»
Yesterday, 7:01 PM

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

nin-tendo - Dec 16, 2022

357 by nin-tendo »»
Yesterday, 12:16 PM
It’s time to ditch the text file.
Keep track of your anime easily by creating your own list.
Sign Up Login