Forum Settings
Forums
Must be a Club Member to Reply 
Poll: Rate my theme.


#1
May 21, 2014 7:06 PM

Offline
Joined: Jan 2012
Posts: 58
IMPORTANT UPDATE:

Hi all. My dropbox account that was hosting the theme files closed due to inactivity, so if you were using the compact version of my themes, please update the import link with any these:

V6 anime
@import "https://isaychris.github.io/themes/minimal/v6/anime_compact.css";

V6 manga
@import "https://isaychris.github.io/themes/minimal/v6/manga_compact.css";

V5.3 anime
@import "https://isaychris.github.io/themes/minimal/v5.3/anime_compact.css";

V5.3 manga =
@import "https://isaychris.github.io/themes/minimal/v5.3/manga_compact.css";


====================================================================


Minimalist V6.0 [December 30, 2015]

Preview: http://i.imgur.com/LBsqOZP.png
Live preview: http://myanimelist.net/animelist/isaychris


====================================================================
Introduction
====================================================================


Looking to freshen up your anime list?
Minimalist features a simple, clean and minimalist design that is pleasing to the eye.
It contains a handful of customization that you can easily edit to make your list personal.
One of the newest mods to come with this update is the addition of a music player.

- How to apply theme: http://myanimelist.net/forum/?topicid=200320


====================================================================
Table of Contents
====================================================================


I - Main Code
II - Info notes
III - Add-on Mods
IV - Patch Notes
V - Revisions
VI - Other themes
VII - Credits


====================================================================
I - Main Code
====================================================================


To make things easier, the code to this layout comes in to versions, full and compact.
- If you want to edit my theme to your liking, use the full code.
- If you want the ability to easily change just the banner, usertitle, and background, use the compact code.

Anime list:
full - https://isaychris.github.io/themes/minimal/v6/anime_original.css
compact -
@import "https://isaychris.github.io/themes/minimal/v6/anime_compact.css";
body {
    background-attachment: fixed !important;
    background-color: #f0f0f0 !important;
    background-image: url("http://i.imgur.com/LvvaNSQ.png") !important;
    background-repeat: repeat-x !important;
}
:nth-child(5) .header_title {
    background: rgba(255, 255, 255, 0) url("http://i.imgur.com/lxDniKJ.gif") no-repeat scroll center center / 100% 100%;
}
:nth-child(5) .header_title::before {
    content: "MyAnimeList";
}

Manga list:
full - https://isaychris.github.io/themes/minimal/v6/manga_original.css
compact -
@import "https://isaychris.github.io/themes/minimal/v6/manga_compact.css";
body {
    background-attachment: fixed !important;
    background-color: #f0f0f0 !important;
    background-image: url("http://i.imgur.com/LvvaNSQ.png") !important;
    background-repeat: repeat-x !important;
}
:nth-child(5) .header_title {
    background: rgba(255, 255, 255, 0) url("http://i.imgur.com/lxDniKJ.gif") no-repeat scroll center center / 100% 100%;
}
:nth-child(5) .header_title::before {
    content: "MyAnimeList";
}

If you want BOTH anime and manga list theme, you will need to create two seperate layouts.


====================================================================
II - Info Notes
====================================================================


- How to apply theme: http://myanimelist.net/forum/?topicid=200320

- How to change banner image:
locate ":nth-child(5) .header_title {" and change the background url to your desired image.
Preferably use a 200x850 image, but any image can be used as it will auto re-size to fit the dimension.

- For some anime images you can use for your banner: http://imgur.com/a/8QKvH?gallery

- Changing the wallpaper
If you want to use your own wallpaper and want that wallpaper to fit the screen correctly, change the background-size value to "background-size:cover;"

- How to change usertitle:
locate "MyAnimeList" and change to your username.

- To efficiently edit the theme, id suggest using a firefox extension called Firebug.
Tutorial here: http://myanimelist.net/forum/?topicid=405333

For updates, visit my profile at http://myanimelist.net/profile/isaychris


====================================================================
III - Add-on Mods
====================================================================


For some reason, it is impossible to have both the music player mod and hover cover mod, so choose one sorry :).

MUSIC PLAYER MOD.

This mod will add a music player to your layout on the bottom left corner.
With a bit of trickery, it is possible to play music on your animelist.

To set this mod up correctly, you must do the following:

--------------------------------------------

HOVER COVER MOD
This mod will display the animes cover image when you hover over the title.

Note:
- When Hover cover mod is added, the "More" link next to Add or Edit will stop working.

To set this mod up correctly, you must do the following:


====================================================================
IV - Patch Notes
====================================================================


6.0 [December 30, 2015]
- rounded the corners for a fresh new look.
- new music player mod.
- new banner image.
- simplified top bar
- repositioned category links.
- removed search.
- refined colors.
- code clean up.

Earlier versions:


====================================================================
V - Revision Links
====================================================================


Minimalist v5.3 [July 7, 2014]

- anime code: http://pastebin.com/S598i5iF
- manga code: http://pastebin.com/eCJsSS9j

Minimalist v4.2 [May 5, 2014]

- anime code: http://pastebin.com/vRKJrEtK

Minimalist v3 [ April 18, 2014]

- anime code: http://pastebin.com/FYENVh9q

Minimalist v2 [April 15, 2014]
- anime code: http://pastebin.com/EJWui6TY




====================================================================
VI - Other Themes
====================================================================


Hanekawa Special Edition [November 20, 2015]

anime code: http://pastebin.com/KQMVcjWu


Side bar minimalist theme v1 [Feburary 17, 2016]

anime code: http://pastebin.com/4CSMZHfV



1) This comes with a hover cover mod, so please change my username with yours at the import on the top.

2) to replace sidebar avatar, change the image in #inlineContent at the bottom.

3) to replace banner image, change the iamge in #list_surround::before


====================================================================
VII - Credits
====================================================================


Shishio - for the awesome tutorials
Ins - for sword art online theme as base for my theme.
kuronekodesu - for help and the copyright mod.
VeriTi - for banner help.

Modified by isaychris, May 21, 2017 7:07 PM
 
#2
May 21, 2014 7:25 PM

Offline
Joined: Apr 2014
Posts: 782
Nice list looks great :P
[center]
 
#3
May 23, 2014 10:57 AM
Offline
Joined: Jul 2013
Posts: 1474
I can appreciate this, it looks very calm and nice, no bullshit. I like it.
 
#4
May 28, 2014 6:07 AM

Offline
Joined: Jan 2012
Posts: 58
Minimalist V5.2.1 [May 28, 2014]

Manga List:
(with customizable usertitle) - http://pastebin.com/ykbmUi9t
(without customizable usertitle) - http://pastebin.com/bCxxmWDh

Alternative anime/ manga cover import:
Replace USERNAME with your username
Replace TYPE with either Anime or Manga

@import url("http://mal-fellow-writer.appspot.com/TYPE/USERNAME/?covers=http://dl.dropbox.com/u/49469857/MAL/premade/formats/covers/more");


Patch Notes:
5.2.1 [May 28, 2014]
- manga list layout
- added reading and plan to read headers.
- alternative anime/ manga cover import
Modified by isaychris, May 28, 2014 6:16 AM
 
#5
May 28, 2014 6:46 AM

Offline
Joined: Jul 2010
Posts: 93
Very nice overall and most importantly clean. Just few small things, if I may:
- I think satuses should be displayed as blocks, you wouldn't have to click at the text
- How about adding some space at the vary bottom of the list? It would look nicer.
- 'a' selector affects #fancybox-close so it has a border-bottom on hover.
- If more buttons doesn't work anyway you could just hide them.
 
#6
May 28, 2014 2:49 PM

Offline
Joined: Jan 2012
Posts: 58
hey thanks for the suggestions :)
the layout does have a bottom margin at the bottom, but for some reason it only shows up on chrome
Modified by isaychris, May 28, 2014 2:53 PM
 
#7
May 28, 2014 4:27 PM

Offline
Joined: Apr 2014
Posts: 782
For the manga list of this you gotta change the title to Reading, and Currently Reading. you can't watch manga ;3
[center]
 
#8
May 28, 2014 6:26 PM

Offline
Joined: Jan 2012
Posts: 58
yeah, i just updated it with a seperate mangalist theme
 
#9
May 28, 2014 7:48 PM

Offline
Joined: Apr 2014
Posts: 782
Oh, didn't see it now I feel stupid xD
[center]
 
May 29, 2014 4:16 AM

Offline
Joined: Jul 2010
Posts: 93
isaychris said:
hey thanks for the suggestions :)
the layout does have a bottom margin at the bottom, but for some reason it only shows up on chrome

It's because gecko handles relative elements different than blink. try changing your #list_surround and :nth-child(5) .header_title to:
#list_surround {
background: none no-repeat scroll 0px 0px rgba(143, 143, 143, 0.77);
box-shadow: 0px 0px 12px 2px rgba(0, 0, 0, 0.41);
height: 100%;
margin:auto auto 20px;
margin-top:240px;
width: 850px;
}

:nth-child(5) .header_title {
background: url("http://i.imgur.com/azu1K25.png") no-repeat scroll center center / 100% 100% rgba(255, 255, 255, 0);
border-color: #F5F5F5;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
border-width: 2px;
box-shadow: 0px 0px 12px 2px rgba(0, 0, 0, 0.41);
height: 200px;
position: absolute;
margin-left:-28px;
top: 60px;
width: 850px;
}

It should work in both browsers.
 
May 29, 2014 1:08 PM

Offline
Joined: Apr 2014
Posts: 782
You should add a custom cursor
[center]
 
Jul 7, 2014 3:44 PM

Offline
Joined: Jan 2012
Posts: 58
Patch notes:
5.3 [July 7, 2014]
- simplified code.
- easier to change banner, background, title.
- category links set as blocks and added border-bottom highlight.
 
Jul 8, 2014 9:01 PM

Offline
Joined: Mar 2012
Posts: 128
I love it, thanks! Simple themes are clearly the best.
 
Sep 3, 2014 12:47 PM

Offline
Joined: Nov 2013
Posts: 3
Did I do something wrong ?

http://prntscr.com/4jdh3c
 
Sep 3, 2014 1:06 PM

Offline
Joined: Aug 2013
Posts: 503
JuliusLAD said:
Did I do something wrong ?

http://prntscr.com/4jdh3c
No, but fellow writer seems to be a bit unreliable these days so I would recommend using another cover file




 
Sep 3, 2014 2:46 PM

Offline
Joined: Nov 2013
Posts: 3
Where can I get it then ?

EDIT: Never mind, I got one.
Modified by DeletedAccountt, Sep 3, 2014 3:00 PM
 
Sep 3, 2014 3:04 PM

Offline
Joined: Feb 2010
Posts: 5971
JuliusLAD said:
Where can I get it then ?

EDIT: Never mind, I got one.


In cast anyones wondering go to the bottom and use Blink or Genku if Fellowwriter isnt working.
 
Sep 21, 2014 6:38 PM

Offline
Joined: Nov 2012
Posts: 104
Thanks for the great theme, I was looking for something sleek and simple and this fit the bill nicely.
 
Sep 27, 2014 11:24 PM

Offline
Joined: Jan 2012
Posts: 58
thanks
 
Oct 23, 2014 1:35 AM

Offline
Joined: Apr 2008
Posts: 431
Can you please post a code with already the "HOVER COVER MOD" done? I can't get it to work >,<
 
Oct 23, 2014 2:10 PM

Offline
Joined: Aug 2013
Posts: 503
EShirou said:
Can you please post a code with already the "HOVER COVER MOD" done? I can't get it to work >,<
That is because of the recent Dropbox crashes. The imports don't exist any more. See the site problems topic for more details.




 
Dec 16, 2014 5:19 PM

Offline
Joined: Jul 2011
Posts: 4282
EShirou said:
Can you please post a code with already the "HOVER COVER MOD" done? I can't get it to work >,<


If it's the covers not showing, replace:
@import url("http://mal-fellow-writer.appspot.com/TYPE/USERNAME/?covers=http://dl.dropbox.com/u/49469857/MAL/premade/formats/covers/more");

with:

@import "https://dl.dropboxusercontent.com/s/aunymjyr9cqdxjl/manga.css";
or
@import url(https://googledrive.com/host/0BxjwQr0BBXs-aDYxM2JlaFM2bnM);

Worked for me, so it should be fine if that's your issue.

EDIT: Some covers disappear from time to time, but after a few weeks they come back. If you're lazy like me you can just let it be. XD
Modified by Mirorin, Apr 24, 2015 9:40 PM
 
Feb 24, 2015 5:51 PM

Offline
Joined: Apr 2014
Posts: 166
thank you for the list. its beautiful :3

 
Apr 16, 2015 3:05 PM
Offline
Joined: Jun 2014
Posts: 47
Thank you for this amazing list layout. It's so calm and so beautiful looking. I hope you bring more update to it.

Keep up the good work! :D
 
Aug 24, 2015 1:47 PM
Offline
Joined: Nov 2013
Posts: 1
Hey, man. Thank you for this style. It's pretty simple to edit and looks great.
I made Kotonoha no Niwa edit. If someone interested:

View

CSS
 
Aug 26, 2015 3:08 PM

Offline
Joined: Jan 2012
Posts: 58
Mirray said:
Hey, man. Thank you for this style. It's pretty simple to edit and looks great.
I made Kotonoha no Niwa edit. If someone interested:

View

CSS


very nice :)
 
Nov 20, 2015 2:22 PM

Offline
Joined: Jan 2012
Posts: 58
Hanekawa Tsubasa edition - 11/20/15


code: http://pastebin.com/KQMVcjWu
live preview: http://myanimelist.net/animelist/isaychris
 
Dec 30, 2015 2:31 PM

Offline
Joined: Jan 2012
Posts: 58
Minimalist V6.0 [December 30, 2015]


Patch notes:
6.0 [December 30, 2015]
- rounded the corners for a fresh new look.
- new music player mod.
- new banner image.
- simplified top bar
- repositioned category links.
- removed search.
- refined colors.
- code clean up.
 
Feb 8, 2016 8:00 AM
Offline
Joined: Sep 2014
Posts: 4
I absolutely love the list. I was wondering though, how hard would it be to make the hover cover add-on work with the more button, or get both add-ons? I have no CSS knowledge, but it would be nice to see in later versions. Thank you!
 
Feb 8, 2016 8:38 AM

Offline
Joined: Jul 2015
Posts: 822
Wigsinator said:
I absolutely love the list. I was wondering though, how hard would it be to make the hover cover add-on work with the more button, or get both add-ons? I have no CSS knowledge, but it would be nice to see in later versions. Thank you!
If you mean the add-ons from this thread, it can be done - just make sure that the covers use animetitle or something similar CSS (it'll say at the top of the topic which code it uses). Only the ones that say "#more" disable the more button.
 
Feb 8, 2016 4:08 PM
Offline
Joined: Sep 2014
Posts: 4
@Doomcat55

I was reffering more specifically to the add-on included in the original post.
 
Feb 8, 2016 5:03 PM

Offline
Joined: Jul 2015
Posts: 822
Wigsinator said:
@Doomcat55

I was reffering more specifically to the add-on included in the original post.
Oh, my bad. I adapted the mods to make a version that'll let you use it with the more button, plus the same code works for both anime and manga lists.

1) Add to the top of your CSS, and replace "USERNAME" with your username:
@import "http://mal-image.appspot.com/all/USERNAME/?code=.animetitle%5Bhref%5E%3D%22%2F%5BTYPE%5D%2F%5BID%5D%2F%22%5D%3Abefore%7Bbackground-image%3Aurl(%5BURL%5D)%3B%7D";

2) Add Style 1 OR Style 2 to the bottom of your code.

Style 1
tab\le:hover .animetitle:before {
    content: "";
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover;
    border-color: rgb(255, 255, 255);
    border-radius: 25px;
    box-shadow: 0 0 12px 2px rgba(0, 0, 0, 0.41);
    display: block !important;
    height: 350px;
    left: 10px;
    padding-bottom: 0;
    position: fixed;
    top: 160px;
    width: 226px;
} 


Style 2
.animetitle:before {
    content: "";
    background-color: #2e2f2f;
    background-position: 50% 50%;
    background-repeat: no-repeat no-repeat;
    background-size: cover;
    border: 1px solid #2e2f2f;
    border-radius: 5px;
    display: inline-block !important;
    height: 20px;
    margin-left: -50px;
    position: absolute;
    width: 35px;
}
.animetitle:hover:before {
    background-color: transparent;
    background-size: cover;
    border-radius: 25px;
    border-style: none;
    border-width: 1px;
    box-shadow: 0 0 12px 2px rgba(0, 0, 0, 0.41);
    margin-left: -220px;
    margin-top: -320px;
    padding-right: 170px;
    padding-top: 300px !important;
    position: absolute;
    z-index: 1;
}
.animetitle:hover:after {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    content: " ";
    height: 22px;
    left: -50px;
    position: absolute;
    width: 37px;
    z-index: 20;
}
.animetitle {
    margin-left: 50px;
    position: relative;
}
.table_header:nth-of-type(2) a {
    margin-left: 50px;
}
Modified by Doomcat55, Feb 8, 2016 5:31 PM
 
Feb 10, 2016 5:17 AM
Offline
Joined: Sep 2014
Posts: 4
Doomcat55 said:
I adapted the mods to make a version that'll let you use it with the more button, plus the same code works for both anime and manga lists.


That's awesome, thank you!
 
Feb 10, 2016 12:50 PM

Offline
Joined: Feb 2013
Posts: 9
I have porblem with the Hover Cover Mod

http://myanimelist.net/animelist/ceceko

Code:


There is no image showing
 
Feb 10, 2016 1:10 PM

Offline
Joined: Aug 2013
Posts: 503
ceceko said:
I have porblem with the Hover Cover Mod

http://myanimelist.net/animelist/ceceko

Code:


There is no image showing
well that is not all that strange since you lack a cover import, you only have the structure and not the actual cover links. Look here to find your fix. http://myanimelist.net/forum/?topicid=439897




 
Feb 10, 2016 1:21 PM

Offline
Joined: Feb 2013
Posts: 9
Ehm thank you so much :)
 
Apr 10, 2016 4:42 PM

Offline
Joined: Jan 2012
Posts: 58
Side bar minimalist theme v1 [Feburary 17, 2016]

anime code: http://pastebin.com/4CSMZHfV



1) This comes with a hover cover mod, so please change my username with yours at the import on the top.

2) to replace sidebar avatar, change the image in #inlineContent at the bottom.

3) to replace banner image, change the iamge in #list_surround::before
Modified by isaychris, Apr 10, 2016 4:47 PM
 
Apr 13, 2016 7:12 AM

Offline
Joined: Oct 2014
Posts: 389
isaychris said:
Side bar minimalist theme v1 [Feburary 17, 2016]


I saw this difference in banners compared to min V6.0, could V6.0 be fixed to look nice like Side Bar V1.0 but still keep the HUD?

Maybe not just V6.0 but older ones like V5.3 as well? I still use the older verion for manga since I prefer the top bar.


One other note for Side Bar is the hover mod gets in the way for mobile when using a pinch-zoom view.
 
Apr 16, 2016 3:03 AM

Offline
Joined: Jan 2012
Posts: 58
[April 4, 2016] [Modern] Minimalist blue grey



live preview: http://myanimelist.net/animelist/vzangetsuha

code:
- Layout: http://pastebin.com/ce6s50tZ
- banner: http://i.imgur.com/lxDniKJ.gif
- wallpaper: https://dl.dropboxusercontent.com/u/188037746/15/pw_maze_white.png

Info:
- This is for modern layout only. If you don't know how to install it, use this tutorial: https://myanimelist.net/forum/?topicid=1499052
- remember to upload the wallpaper and banner.
- the banner size will stay at 950x200
- To change username in banner, locate .cover-block::before on the top of the code and change the content value to your own username.
Modified by Shishio-kun, Jan 2, 2017 6:04 PM
 
May 21, 2017 7:01 PM

Offline
Joined: Jan 2012
Posts: 58
IMPORTANT UPDATE:

Hi all. My dropbox account that was hosting the theme files closed due to inactivity, so if you were using the compact version of my themes, please update the import link with any these:

V6 anime
@import "https://isaychris.github.io/themes/minimal/v6/anime_compact.css";

V6 manga
@import "https://isaychris.github.io/themes/minimal/v6/manga_compact.css";

V5.3 anime
@import "https://isaychris.github.io/themes/minimal/v5.3/anime_compact.css";

V5.3 manga =
@import "https://isaychris.github.io/themes/minimal/v5.3/manga_compact.css";
Modified by isaychris, May 21, 2017 7:06 PM
 
Top