This is a custom layout for modern template lists. If you don't know how to install the codes, click here to view the Beginner's Tutorial. If there are problems: install the latest version, or check the Repair Thread for patches and updates (found here). All premade modern layouts can be found in the gallery by clicking here, and more ways to customize your list can be found here. NieR: Automata Menu Layout By Killingdyl Layout does not support custom background image. Layout supports custom banner image set through the modern style editor. Layout works best on screens at least 1500px wide. Layout supports roughly 7 columns. Layout does not look good with cover images.  Code: @import "https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css"; Alternatively you may copy the source code and do minor modifications. Change 'Your' to your name modification Feel free to post here if any issues arises. I will be do minor fixes and improvement to smaller display sizes, but no more major changes will be made. |
Shishio-kunFeb 21, 2023 1:02 PM
Shinobu-Oshino said: Any way to make the anime list column infinite and not a square? btw sorry for my bad english If you put the layout on your list I can look into it. |
@Shishio-kun Looks like this theme could use updating with the new import format.@\import "https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css"; Also, very nice theme killingdyl! I hadn't stumbled upon this before but I really love the style. |
| Wow thanks, I wasn't even aware of this theme missing from our list! @killingdyl I'll add it to the list of other modern themes, it's great. |
| Nice layout killingdyl! But i am having some problem with the name part. Evereytime i try to type my name it is repeating twice somehow. How should i fix this part? |
  |
-saffy- said: Looks like you've changed the text under the ".header .username:after" selector. Leaving it as it is in the default theme should fix the problem, I believe. Here's how it should look:Nice layout killingdyl! But i am having some problem with the name part. Evereytime i try to type my name it is repeating twice somehow. How should i fix this part? .anime .header .username::after {
content: ' - Anime List';
text-shadow: initial;
font-size: 18pt;
font-weight: bold;
}
.manga .header .username::after {
content: ' - Manga List';
text-shadow: initial;
font-size: 18pt;
font-weight: bold;
}If you want to change the text from "YOUR" to "Saffy" (when viewing your list as yourself) then that would require a little modification of the theme. (Killingdyl, if you don't want me responding in this thread @ me so I know and I'll let you handle it in the future ^^) |
Valerio_LyndonDec 26, 2018 12:53 AM
| @Valerio_Lyndon & @killingdyl thank you for the help. I was able to change it :) |
| |
@Reddoheddo Enable the cover image on the theme and upload the image you want. :) |
nlmod said: You can find the code that removes it by searching for ".list-menu-float" or "LIST MENU". Just remove lines 66-68 and it will display again.Hey is there a way to add a "List" button, the one MAL uses where you can go to "anime list", "manga list", "quick add" and "list settings"? I'm a big fan of this layout but I really miss a button to somehow go to MAL homepage or to quick add a new anime I'm watching. EDIT: or let me know which lines of the code you used to hide the default one so I can add in a custom one.  If you want a quick fix to make it look somewhat less out of place, you could use this code I whipped up just now, it puts the buttons up top right.  |
Valerio_Lyndon said: nlmod said: You can find the code that removes it by searching for ".list-menu-float" or "LIST MENU". Just remove lines 66-68 and it will display again.Hey is there a way to add a "List" button, the one MAL uses where you can go to "anime list", "manga list", "quick add" and "list settings"? I'm a big fan of this layout but I really miss a button to somehow go to MAL homepage or to quick add a new anime I'm watching. EDIT: or let me know which lines of the code you used to hide the default one so I can add in a custom one. If you want a quick fix to make it look somewhat less out of place, you could use this code I whipped up just now, it puts the buttons up top right. Thanks a lot, this was exactly what I had in mind. |
Fahad_826 said: Is there a way to change the dimensions of the picture on the right? Like make it a lil taller? You could add this CSS to the bottom of your code, and more will show up. .cover-block .image-container img { background-size: contain; height: 1000px; } And you could make it even wider and taller with codes like this, just keep increasing the width and height numbers to more than a 1000px. Would be good for 4k screens, maybe .cover-block { width: 1000px; height: 1000px; } |
Fahad_826 said: It wasn't overlooked, was an intentional decision. But to change it, you could add this code to the bottom of your custom CSS. This will add back in the add/edit/more buttons and a home button in the bottom right corner.Help! I cant remove an entry from my plan to watch list.In the default version you could click on "more" And more details would show up but there is no option there.Did the op forgot to add that to the code? Also theres no button to go back to the main page like how you normally have ;-; Sorry if im complaining too much lol. |
Valerio_LyndonMay 1, 2019 7:30 PM
Which part of the CSS do I have to modify to use it with images? If I just enable them in the settings, the lines look a bit off.  |
LordAxerionMay 19, 2019 3:36 AM
| @LordAxerion To save you some time, here's a couple of premade fixes you can use to make images look less out of place. For help with modifying themes yourself, you can check out Shishio's video(s) on the topic. Inspect Element would be a good place to start: [Video]. It's quite easy to get started if you have a little time to spare. :) |
Valerio_Lyndon said: @LordAxerion To save you some time, here's a couple of premade fixes you can use to make images look less out of place. For help with modifying themes yourself, you can check out Shishio's video(s) on the topic. Inspect Element would be a good place to start: [Video]. It's quite easy to get started if you have a little time to spare. :) Thanks a lot! |
| Just chiming in, but this is the prettiest design I've seen so far. *3* |
 |
| How to hide the list anime photo? |
【𝕷𝖎𝖋𝖊 𝖎𝖘 𝖘𝖎𝖒𝖕𝖑𝖊. 𝖋𝖗𝖞, 𝖗𝖊𝖒𝖔𝖛𝖊, 𝖙𝖍𝖊𝖓 𝖉𝖗𝖆𝖎𝖓】 |
NineTY4 said: Go here: https://myanimelist.net/editprofile.php?go=listpreferences Then turn off the "image" checkbox and save the preferences.How to hide the list anime photo? |
Valerio_Lyndon said: ThanksNineTY4 said: Go here: https://myanimelist.net/editprofile.php?go=listpreferences Then turn off the "image" checkbox and save the preferences.How to hide the list anime photo? |
【𝕷𝖎𝖋𝖊 𝖎𝖘 𝖘𝖎𝖒𝖕𝖑𝖊. 𝖋𝖗𝖞, 𝖗𝖊𝖒𝖔𝖛𝖊, 𝖙𝖍𝖊𝖓 𝖉𝖗𝖆𝖎𝖓】 |
| I really like the look of this layout, have been using for a long time but i just switched to classic. Was wondering if there was a classic code for this because it's such an amazing layout and i want to keep using but can't find anything similar for classic. |
akex005Aug 11, 2019 5:24 PM
| Where can I find the source code for this layout? |
Yukii97Mar 28, 2020 8:21 AM
Yukii97 said: Where can I find the source code for this layout? here https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css but you can use this line for your CSS and it will install the layout @\import "https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css"; |
Shishio-kun said: Yukii97 said: Where can I find the source code for this layout? here https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css but you can use this line for your CSS and it will install the layout @\import "https://dl.dropboxusercontent.com/s/6rs6scid2acpkrq/NieRAutomata.css"; Thank you! I wanted to change some things in the layout, that's I why I wanted the source code :) |
| Can someone help me out with my list, i need remove the white line that's in between the anime covers and titles , it's really buggin meh i want it to be like this one https://myanimelist.net/animelist/HaxWansoo Thanks in advance :D |
  |
Saskee said: Can someone help me out with my list, i need remove the white line that's in between the anime covers and titles , it's really buggin meh i want it to be like this one https://myanimelist.net/animelist/HaxWansoo Thanks in advance :D Edit or remove this line, in the lower half .list-table tbody.list-item { background: linear-gradient(to bottom, transparent 2px, #d7d1b9 2px, #d7d1b9 5px, transparent 5px, transparent 45px, #d7d1b9 45px, #d7d1b9 48px, transparent 48px);} |
Shishio-kun said: Saskee said: Can someone help me out with my list, i need remove the white line that's in between the anime covers and titles , it's really buggin meh i want it to be like this one https://myanimelist.net/animelist/HaxWansoo Thanks in advance :D Edit or remove this line, in the lower half .list-table tbody.list-item { background: linear-gradient(to bottom, transparent 2px, #d7d1b9 2px, #d7d1b9 5px, transparent 5px, transparent 45px, #d7d1b9 45px, #d7d1b9 48px, transparent 48px);} If i remove that block of code, it fixes the line problem, but some of the anime lines don't have background color now , they are white :/ |
|
Saskee said: Shishio-kun said: Edit or remove this line, in the lower half .list-table tbody.list-item { background: linear-gradient(to bottom, transparent 2px, #d7d1b9 2px, #d7d1b9 5px, transparent 5px, transparent 45px, #d7d1b9 45px, #d7d1b9 48px, transparent 48px);} If i remove that block of code, it fixes the line problem, but some of the anime lines don't have background color now , they are white :/ In that case you have to edit it, like make it a single color, or edit it the way HaxWansoo has it. I think it would be easier to just take this code, and edit it with your background pics if needed: |
| Thanks a lot, this code worked like a charm :D |
|
Saskee said: Thanks a lot, this code worked like a charm :D Awesome :D |
I have a prob now with my cover picture, i can't seem to fit it in that box when i try to resize the pic the box also becomes smaller i don't want that, any advice on how to fix that? i want this pic |
|
| @Saskee The pic says access denied, upload it to Imgur |
https://www.ps4wallpapers.com/wp-content/uploads/2018/03/PS4Wallpapers.com_5aa23be22862f_cbar6-qw2wg.jpg How about now? And i know the resolution on this one is not supported, but i tried resizing it and the whole box became smaller :/ |
|
Saskee said: https://www.ps4wallpapers.com/wp-content/uploads/2018/03/PS4Wallpapers.com_5aa23be22862f_cbar6-qw2wg.jpg How about now? And i know the resolution on this one is not supported, but i tried resizing it and the whole box became smaller :/ I'm still not sure what you want to do with it. What exactly do you want to do with it for it to be fixed from your point of view- do you want the box wider or taller? Or do you want the wallpaper to look different somehow like to see the entire wallpaper? You can add this to make the box taller .cover-block .image-container img { height: 800PX !important; } You can also crop the wallpaper in Lunapic or Imgur to reshape it so it fits the box better, that sounds like the best solution to make it fit how you want. |
Shishio-kun said: Saskee said: https://www.ps4wallpapers.com/wp-content/uploads/2018/03/PS4Wallpapers.com_5aa23be22862f_cbar6-qw2wg.jpg How about now? And i know the resolution on this one is not supported, but i tried resizing it and the whole box became smaller :/ I'm still not sure what you want to do with it. What exactly do you want to do with it for it to be fixed from your point of view- do you want the box wider or taller? Or do you want the wallpaper to look different somehow like to see the entire wallpaper? You can add this to make the box taller .cover-block .image-container img { height: 800PX !important; } You can also crop the wallpaper in Lunapic or Imgur to reshape it so it fits the box better, that sounds like the best solution to make it fit how you want. I want the box to be like this one https://myanimelist.net/animelist/pipipetica?status=1 with the pic i provided, same height same width, i can resize the pic to match the box after i fix the box. |
|
Saskee said: Shishio-kun said: I'm still not sure what you want to do with it. What exactly do you want to do with it for it to be fixed from your point of view- do you want the box wider or taller? Or do you want the wallpaper to look different somehow like to see the entire wallpaper? You can add this to make the box taller .cover-block .image-container img { height: 800PX !important; } You can also crop the wallpaper in Lunapic or Imgur to reshape it so it fits the box better, that sounds like the best solution to make it fit how you want. I want the box to be like this one https://myanimelist.net/animelist/pipipetica?status=1 with the pic i provided, same height same width, i can resize the pic to match the box after i fix the box. Your list is wider so it cant be the same height as their's (not enough room). You can modify the box with codes at the bottom https://pastebin.com/raw/sKhi15Gv If there's anything else you need to do review the Inspect Element video on my channel and learn to edit it on your own |
Is there a way to center the score with the other anime information? See image for issue: |
Dr_Quantum101 said: Is there a way to center the score with the other anime information? See image for issue: please try to fix the issue with Inspect Element to repair the code. https://www.youtube.com/watch?v=cTGbVutdqfc If you can't repair it yourself post back |
Shishio-kun said: Dr_Quantum101 said: Is there a way to center the score with the other anime information? See image for issue: please try to fix the issue with Inspect Element to repair the code. https://www.youtube.com/watch?v=cTGbVutdqfc If you can't repair it yourself post back Fixed thanks! Changed score cell line-height from 50px to 80px for anyone else who has the same issue. Score cell code: .list-table .list-table-data .data.score a { |
More topics from this board
» ❓ Ask for help here + See Frequently Asked Questions ( 1 2 3 4 5 ... Last Page )Shishio-kun - Apr 15, 2010 |
7812 |
by mtsRhea
»»
Apr 21, 5:25 AM |
|
» [CSS- MODERN] ⭐ Minimal Dashboard layout by 5cm ~ Compact and convenient! ( 1 2 3 )Shishio-kun - Sep 4, 2020 |
121 |
by Pokitaru
»»
Apr 21, 3:25 AM |
|
» [CSS-MODERN] Change list text/font colors on any list layoutShishio-kun - May 4, 2021 |
3 |
by hideso
»»
Apr 20, 4:33 PM |
|
» [CSS] [VIDEO GUIDE] ⭐️ How to change fonts on a list layoutShishio-kun - Jul 15, 2019 |
17 |
by hideso
»»
Apr 20, 4:03 PM |
|
» [CSS][Modern] ☀️ Endless Summer Layout by Cateinya ( 1 2 3 4 5 ... Last Page )Cateinya - Aug 18, 2016 |
309 |
by hideso
»»
Apr 20, 3:56 PM |