New
Nov 1, 2014 6:13 AM
#2351
Shishio-kun said: Moving the other top bar buttons should be .header_cw + table, .header_completed + table, .header_onhold + table, .header_dropped + table, .header_ptw + table #list_surround:before should be for the part behind the top bar buttons #list_surround is for the list color, you've made it skyblue needs to be a rgba color as it was before. Use this to find the color: http://www.css3maker.com/css-3-rgba.html You seem to have taken off the anime covers (the animes?) by clearing the import, so thats why they're not there. Screenshot and circle exactly what you want translucent, moved etc in future questions please. If stuff doesn't work leave it in your code too Thanks! Still not used to this type of coding yet (only have done c++, C#, and a bit of java a few years ago >_<). I removed the covers while I was messing with the coding cause the halloween event was kind of distracting when looking for subtle changes. Next time I'll screenshot and show what I was referring to, my apologies. Also, thanks a bunch for the rgba link, I like combined codes like this and it made it easier :D |
Nov 1, 2014 11:09 AM
#2352
Hey Shishio, I read through all the tutorials and the FAQ but it seems no one has the issue I'm having. My list only shows my completed animes and there are no links to my watching, planning, dropped, etc. I'm hoping there is a way to fix this, thank you! |
Imagination has the power to change everything. |
Nov 1, 2014 11:49 AM
#2353
Shu_Kurisu said: Hey Shishio, I read through all the tutorials and the FAQ but it seems no one has the issue I'm having. My list only shows my completed animes and there are no links to my watching, planning, dropped, etc. I'm hoping there is a way to fix this, thank you! I fixed it!! thank you anyways :] |
Imagination has the power to change everything. |
Nov 2, 2014 6:59 AM
#2354
Hello , i noticed your club recently and it is truly amazing but there is something i want to know that is not in the F.A.Q or anything, am i allowed to request specific anime list customization for specific anime ? if yes then where? |
Nov 2, 2014 8:18 AM
#2355
Osamaelhakim said: there are currently no request topic, you can make a sugestion in the sugestion topic, but there is no guarantie it will lead to anything.Hello , i noticed your club recently and it is truly amazing but there is something i want to know that is not in the F.A.Q or anything, am i allowed to request specific anime list customization for specific anime ? if yes then where? |
Nov 2, 2014 10:25 PM
#2356
Hi, I'm having a problem with getting covers to show up. Just for reference I have had them work before, but I tried tweaking some things, screwed everything up, and now I can't get it to work again. My import line at the top: My CSS section: /* COVER AREA The surrounding area containing each cover pic which appears when you point to a row (requires #more CSS to see a DVD or manga cover). Move the cover's location around with left and top. Remove only the border-radius: 25px 25px 25px 25px; lines to take the rounded corners away. Increase height and width to make the pics bigger. Delete border-style: solid; to remove the border. For changing the original background color see the bottom of the original post: http://myanimelist.net/forum/?topicid=563993 */ .hide { background-size: cover; left: 900px; top: 160px; height: 350px; width: 226px; border-style: solid; border-color: white; border-top: 1px solid white;; border-left: 1px solid white; border-right: 1px solid white; border-bottom: 1px solid white; border-radius: 25px 25px 25px 25px; background-color: rgba(200, 5, 200, 0.75); background-position: center 50% !important; background-repeat: no-repeat !Important; display: block !important; position: fixed; visibility: hidden; opacity: 0; } I had some changes in there and that's when it stopped working. I tried reverting the stuff back to defaults but it still wouldn't work. Also if the order in which it goes in there matters that could be the problem but I assumed it didn't matter. Lastly, the "more" button disabling at the end #list_surround table:nth-of-type(n+4):hover td:nth-of-type(3), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(4), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(5), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(6), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(7), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(8) { display: table-cell; } #list_surround small a:last-of-type { display: none !important; } .animetitle + small { visibility: visible !important; } #list_surround a[href*="http://myanimelist.net/panel.php?go=edit"], #list_surround a[href*="http://myanimelist.net/editlist.php?type="], #list_surround a[href*="http://myanimelist.net/panel.php?go=add"] { visibility: visible !important; margin-right: 10px } .td1:nth-of-type(6) small, .td2:nth-of-type(6) small, .td1:nth-of-type(5) small, .td2:nth-of-type(5) small, .td1:nth-of-type(4) small, .td2:nth-of-type(4) small { visibility: visible !important; } .td1:nth-of-type(6) small:hover, .td2:nth-of-type(6) small:hover, .td1:nth-of-type(5) small:hover, .td2:nth-of-type(5) small:hover, .td1:nth-of-type(4) small:hover, .td2:nth-of-type(4) small:hover{ text-decoration: underline; } So yeah. I can't get any sort of covers to show up any more, much less go through with the tweaks I was trying out. I would appreciate any help. Also here is the whole CSS for reference: @import url(https://googledrive.com/host/0BxjwQr0BBXs-aDYxM2JlaFM2bnM); /* Got a question or want to learn more? Try this link: http://myanimelist.net/forum/?topicid=419405&show=0#post1 */ /* COVER AREA The surrounding area containing each cover pic which appears when you point to a row (requires #more CSS to see a DVD or manga cover). Move the cover's location around with left and top. Remove only the border-radius: 25px 25px 25px 25px; lines to take the rounded corners away. Increase height and width to make the pics bigger. Delete border-style: solid; to remove the border. For changing the original background color see the bottom of the original post: http://myanimelist.net/forum/?topicid=563993 */ .hide { background-size: cover; left: 900px; top: 160px; height: 350px; width: 226px; border-style: solid; border-color: white; border-top: 1px solid white;; border-left: 1px solid white; border-right: 1px solid white; border-bottom: 1px solid white; border-radius: 25px 25px 25px 25px; background-color: rgba(200, 5, 200, 0.75); background-position: center 50% !important; background-repeat: no-repeat !Important; display: block !important; position: fixed; visibility: hidden; opacity: 0; } /* BACKGROUND IMAGE This is the main background image for the whole page. Change the image link to the background you want! If you're not seeing a background, make sure you are copied the entire CSS code or added any new background image codes correctly. Also your image link may be broken, try uploading a new background then! */ body { background-image: url(http://i.imgur.com/aUEVAph.png); background-size: cover; background-attachment: fixed; } /* HEADER COLOR AND FONT These codes control the main headers' fonts and colors. Every header is above each part of your list (they say things like Currently Watching, Completed, Dropped, etc). */ .header_title { background-color: DimGray; color:black; font-family:courier; font-size:30px; } /* SUB-HEADERS BACKGROUND COLOR COLOR Below each main header is the sub-header which says Score, Episodes, Tags, etc. */ .table_header { background-color: Gray; } /* ANIME/MANGA TITLE FONTS This is the type and color of the anime/manga titles on your list, like Bleach, Vampire Knight, etc. */ .animetitle, .animetitle:visited { color:black; font-family:courier; font-size:14px; } /* LIST FONTS This is the type and color for more of the numbers, links, and words on the list itself! */ .td1, .td2, a, a:visited, .category_totals, .table_header, #grand_totals, #copyright { color:black; font-family:courier; } /* LIST WIDTH Use this to increase the width of your list! */ #list_surround { width: 600px; } /* LIST COLOR The numbers in parenthesis below control the color of your list background itself. The first number is the amount of red, the second amount of green, third blue, and each can be set to a maximum of 255 and minimum of 0. The 4th number in parenthesis is the opacity amount, which can be set from .0 (invisible) to 1 (completely opaque). For more info on RGBA color see this tutorial: http://myanimelist.net/forum/?topicid=440525 */ .category_totals, .td1, .td2, #grand_totals, #copyright { background-color: rgba(128, 128, 128, .5); } /* ROW HOVER COLOR Change the color you see on a row only when you put your cursor over it with this code, you use the same color change style as in the above code. */ tr:hover [class^=td] { background-color: rgba(128, 128, 128, .75) !important; } /* LIST POSITION Change "left" to "right" to switch the list side, or vice versa. */ #list_surround { left: 5px; position: absolute; } /* REPOSITION MAIN BACKGROUND Change the position your background starts on your screen from with the two properties after "background-position" below. For example, the default code starts it from the left and top corner of the screen. You change 'right' and 'top' with two properties, they can be any of the following: left, top, bottom, right, or center. So if you want your background to start from the center of the screen, use "center center". If you want it to start from the top and left, use "top left". If you want it to start from the top and center, use "top center". If you want it to start from the right and top, use "right top" If you want it to start from the right and bottom, use "right bottom" and so forth... Additionally, you can change "left" to a % to determine how far left or right the background starts from. For example "30% top" will start the background from the top but 30% of the pic's width from the left of the layout. You can also change top to a % to change the amount you want to start it from the top or bottom. */ body { background-position: top right;} /*OTHER CODES Important codes for the layout's setup. Please don't mess with these unless you know what you're doing! To learn more, use the link at the top of this CSS. */ body { font-weight: light; background-repeat: no-repeat; background-color: #FBFDE8; } a { text-decoration:none; } a:visited { text-decoration:none; } a:hover, a:visited:hover { color:red; text-decoration:underline; } .category_totals, .td1, .td2, #grand_totals, #copyright { border-width:0; padding:2px; } .category_totals:HOVER, .td1:HOVER, .td2:HOVER, #grand_totals:HOVER, #copyright:HOVER { border-width:0; padding:2px; } .status_selected { background-color:black; padding:2px; color:white; text-decoration: blink; } .status_not_selected { background-color:black; padding:2px; color:white; } #copyright:after { content: " Custom CSS by Shishio-kun. Google 'Shishio's Custom Lists' for more designs or info."; } .status_selected a{ color:blue; } .status_not_selected a{ color:white; } .thickbox { color:cyan; font-family:fantasy; font-size:12px; } .header_title { height:52px; padding:2px; } .table_header { border-width:0; font-weight:bold; padding:2px; } .category_totals { height:30px; } #copyright, #grand_totals { text-align: center; margin:0 auto; } tr:hover [class^="td"] { transition: all 0.2s linear 0s; } #list_surround table:nth-of-type(n+4):hover td:nth-of-type(3), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(4), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(5), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(6), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(7), #list_surround table:nth-of-type(n+4):hover td:nth-of-type(8) { display: table-cell; } #list_surround small a:last-of-type { display: none !important; } .animetitle + small { visibility: visible !important; } #list_surround a[href*="http://myanimelist.net/panel.php?go=edit"], #list_surround a[href*="http://myanimelist.net/editlist.php?type="], #list_surround a[href*="http://myanimelist.net/panel.php?go=add"] { visibility: visible !important; margin-right: 10px } .td1:nth-of-type(6) small, .td2:nth-of-type(6) small, .td1:nth-of-type(5) small, .td2:nth-of-type(5) small, .td1:nth-of-type(4) small, .td2:nth-of-type(4) small { visibility: visible !important; } .td1:nth-of-type(6) small:hover, .td2:nth-of-type(6) small:hover, .td1:nth-of-type(5) small:hover, .td2:nth-of-type(5) small:hover, .td1:nth-of-type(4) small:hover, .td2:nth-of-type(4) small:hover{ text-decoration: underline; } |
Nov 3, 2014 9:11 PM
#2357
Hi, I was almost done customizing my list, but there is one problem I have been trying to fix for the past several hours. My MAL: http://myanimelist.net/animelist/musishin The row that has "anime title," "type," and "progress" are misaligned with the rest of the table. I tried looking everywhere for a solution, but I just cannot figure it out. Any help would be much appreciated. |
Nov 3, 2014 9:54 PM
#2358
musishin said: Hi, I was almost done customizing my list, but there is one problem I have been trying to fix for the past several hours. My MAL: http://myanimelist.net/animelist/musishin The row that has "anime title," "type," and "progress" are misaligned with the rest of the table. I tried looking everywhere for a solution, but I just cannot figure it out. Any help would be much appreciated. looks fine to me: http://puu.sh/cCDSS/b8f9092fa9.jpg it might be a browser issue. Post a screen shot and tell me which browser you are using |
Nov 3, 2014 11:10 PM
#2359
musishin said: Hi, I was almost done customizing my list, but there is one problem I have been trying to fix for the past several hours. My MAL: http://myanimelist.net/animelist/musishin The row that has "anime title," "type," and "progress" are misaligned with the rest of the table. I tried looking everywhere for a solution, but I just cannot figure it out. Any help would be much appreciated. Find @media screen and (-webkit-min-device-pixel-ratio: 0) td[class^='td']:nth-of-type(2) { width and increase width to an amount that works. It says to do this in the notes at the bottom of your code. Always check the code's notes first. I usually put this kinda info in there so you don't have to search thru everything. |
Nov 3, 2014 11:54 PM
#2360
Shishio-kun said: musishin said: Hi, I was almost done customizing my list, but there is one problem I have been trying to fix for the past several hours. My MAL: http://myanimelist.net/animelist/musishin The row that has "anime title," "type," and "progress" are misaligned with the rest of the table. I tried looking everywhere for a solution, but I just cannot figure it out. Any help would be much appreciated. Find @media screen and (-webkit-min-device-pixel-ratio: 0) td[class^='td']:nth-of-type(2) { width and increase width to an amount that works. It says to do this in the notes at the bottom of your code. Always check the code's notes first. I usually put this kinda info in there so you don't have to search thru everything. ah! sorry! I actually did see that, but I'm on safari and didn't know it applied there as well, so I skimmed over it. Should have paid more attention, but thank you anyway, appreciate the help ^^; |
Nov 4, 2014 12:20 AM
#2361
Oh you're a Safari user, I actually forgot about that browser and figured you were using Chrome, not thats there's anything wrong with them- anyways pretty much anything that applies to Chrome in terms of CSS hacks and stuff will apply to Safari now, and maybe Opera and IE, since they're all "webkit" browsers now (I think). |
Nov 4, 2014 7:29 PM
#2362
Is it possible to change the "more" link for each anime in one's list to display text placed in the comments form only, rather than the entire extended info on the anime (such as the Rating/Fansub Group/Storage/Rewatch Value/etc.)? I'd like to change it to only show text I've placed in the comments section so I can place mini-reviews there and use the tag section for... well, tags and other stuff. |
Nov 5, 2014 5:24 AM
#2363
I am almost ready with this theme, but apparently IE has a gigantic "lol nope" and doesn't load it. Dunno why, It works fine on other browsers. theme: http://myanimelist.net/animelist/seaven source: https://dl.dropboxusercontent.com/u/30833664/ghibli/ghibli.css |
Nov 7, 2014 12:20 AM
#2364
Does anyone have any idea what may be wrong with this code? I can't release a list design if it doesn't work on every major browser. |
Nov 7, 2014 1:50 AM
#2365
seaven said: Does anyone have any idea what may be wrong with this code? I can't release a list design if it doesn't work on every major browser. Seems fine in IE to me. Can you screenshot or describe whats different for you? I'm using the latest IE. |
Nov 7, 2014 3:11 AM
#2366
When you said it works for you I looked around. This is what I get in Lunascape6 with Trident Engine on, and IE with my default settings (which were messed up for whatever reason, I am not using this browser): http://puu.sh/cGGOm/323f6bc211.png By changing Browser Mode to IE9 I fixed the view. IE7 and IE8 have the problem. As far as Lunascape is concerned, I have no fix. Trident Engine breaks the list, WebKit engine has some issues with Menubar, but the rest works fine, Gecko engine displays everything properly. It is highly possible that my default settings were messed up and for everyone else the list would work fine. If that's the case I think I am ready to release it. |
Nov 7, 2014 10:05 PM
#2367
what is the Correct Size for a Member card? |
Nov 7, 2014 10:26 PM
#2368
ZmBzRALIVE said: what is the Correct Size for a Member card? There is no correct size. But if they were too small (under 100px wide?) or way too big (over 400px wide?) they would probably look bad, might not even look like a card anymore. |
Nov 7, 2014 10:42 PM
#2369
Not sure if this was asked yet but... I'm using a premade Yotsuba layout, and it looks great. Only problem is, the list is a bit narrow for my tastes. Is there any way to make it a little wider? mal: http://myanimelist.net/animelist/HuaXue |
Nov 7, 2014 10:57 PM
#2370
HuaXue said: Not sure if this was asked yet but... I'm using a premade Yotsuba layout, and it looks great. Only problem is, the list is a bit narrow for my tastes. Is there any way to make it a little wider? mal: http://myanimelist.net/animelist/HuaXue Do You mean the list it's self? cause if so then yes it's easy Replace with body { background-attachment: fixed !important; background-COLOR: #e4e893 !important; background-image: url(http://i.imgur.com/rTFNd5R.jpg) !important; background-repeat: repeat !important; background-size: cover !important; color: #FFFFFF; font-family: Verdana, Arial; font-size: 10px; } #list_surround { position: absolute !important; right: 60px !important; } #inlineContent { display: inline-block !important; height: 362px !important; left: 0 !important; position: absolute !important; top: 0 !important; width: 605px !important; z-index: -1 !important; } #grand_totals { background-color: transparent; border: 0 none; border-radius: 3px 3px 3px 3px; color: #EEEEEE; line-height: 20px; min-height: 20px; text-align: center; transition: all 0.25s ease-in-out 0s; vertical-align: middle; } a { color: #7aa23f; text-decoration: none; } a:visited { color: #7aa23f; text-decoration: none; } a:hover { color: #45631b; text-decoration: none; } small { color: #365300; font-size: 8px !important; text-decoration: none; } #searchBox { background-color: #e4e893; border-color: #FFFFFF; border-style: solid; border-width: 1px; color: #FFFFFF; font-size: 14px !important; height: 14px; text-align: center; text-transform: uppercase; } #list_surround { background-color: transparent; background: transparent; background-position: center top; background-repeat: no-repeat; margin-left: 5px; padding-top: 50px; text-transform: none; width: 800px; } #list_surround tr:hover .category_totals, #list_surround[align="center"] tbody tr:hover td, #list_surround[align="center"] + tbody tr:hover { background-color: transparent; } .td1, .td2 { background: rgba(228, 232, 147, 0.8); background-position: center center; border-style: hidden; color: #365300; padding: 3px; } .table_header { background: rgba(228, 232, 147, 0.8); border-style: hidden; color: #7ea04a !important; padding: 3px; } .td1[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td1[width="45"] { font-size: 11px; font-weight: bold; } .td1[width="70"] { font-size: 11px; font-weight: bold; } .td2[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td2[width="45"] { font-size: 11px; font-weight: bold; } .td2[width="70"] { font-size: 11px; font-weight: bold; } .td1:last-child, .td2:last-child, .table_header:last-child { background-position: right center; } .table_header[width="125"] { padding-left: 1px; padding-right: 20px; width: 200px; } .td1:first-child, .td2:first-child, .table_header:first-child { background-position: left center; padding-left: 10px; text-align: center; width: 20px; } [id^="menu"] .td1 { padding-left: 50px; padding-right: 20px; text-align: left; } [id^="menu"] .td2 { padding-left: 50px; padding-right: 20px; text-align: left; } small *, small { font-size: 11px; } .table_headerLink { color: #365300; font-weight: normal; } .table_headerLink:visited { color: #000000; font-weight: normal; } .table_headerLink:hover { color: #FFFFFF; font-weight: normal; } .status_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 14px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-top-style: solid; border-width: 2px !important; } .status_not_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 12px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-width: 2px !important; border-top-style: solid; } .header_title { font-size: 40px; font-family: century gothic; margin-top: -20px; margin-bottom: 10px; margin-left: 40px; } .header_cw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_completed { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_onhold { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_dropped { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_ptw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .category_totals { background: rgba(228, 232, 147, 0.8); color: #365300; font-size: 10px; height: 40px; text-align: center; border-radius: 0 0 30px 30px; } #grand_totals { background-position: center top; background-repeat: no-repeat; color: #FFFFFF; font-family: Verdana,Arial; font-size: 10px; height: 25px; padding: 29px; text-align: center; } #copyright { background-image: url("http://img7.imageshack.us/img7/7540/copyrightbackground.png"); background-repeat: no-repeat; color: #ECE0E3; font-size: 9px; font-weight: normal; height: 50px; margin: 0 auto; padding-top: 10px; text-align: center; text-shadow: 0 0 0.5em #FFDEEE; width: 475px; } That should do it. but if not You can PM me and I'll fix it for You. |
Nov 7, 2014 10:59 PM
#2371
Shishio-kun said: ZmBzRALIVE said: what is the Correct Size for a Member card? There is no correct size. But if they were too small (under 100px wide?) or way too big (over 400px wide?) they would probably look bad, might not even look like a card anymore. I mean, What is the most common size for it? Cause I notice Most of them are the same size. |
Nov 7, 2014 11:45 PM
#2372
ZmBzRALIVE said: HuaXue said: Not sure if this was asked yet but... I'm using a premade Yotsuba layout, and it looks great. Only problem is, the list is a bit narrow for my tastes. Is there any way to make it a little wider? mal: http://myanimelist.net/animelist/HuaXue Do You mean the list it's self? cause if so then yes it's easy Replace with body { background-attachment: fixed !important; background-COLOR: #e4e893 !important; background-image: url(http://i.imgur.com/rTFNd5R.jpg) !important; background-repeat: repeat !important; background-size: cover !important; color: #FFFFFF; font-family: Verdana, Arial; font-size: 10px; } #list_surround { position: absolute !important; right: 60px !important; } #inlineContent { display: inline-block !important; height: 362px !important; left: 0 !important; position: absolute !important; top: 0 !important; width: 605px !important; z-index: -1 !important; } #grand_totals { background-color: transparent; border: 0 none; border-radius: 3px 3px 3px 3px; color: #EEEEEE; line-height: 20px; min-height: 20px; text-align: center; transition: all 0.25s ease-in-out 0s; vertical-align: middle; } a { color: #7aa23f; text-decoration: none; } a:visited { color: #7aa23f; text-decoration: none; } a:hover { color: #45631b; text-decoration: none; } small { color: #365300; font-size: 8px !important; text-decoration: none; } #searchBox { background-color: #e4e893; border-color: #FFFFFF; border-style: solid; border-width: 1px; color: #FFFFFF; font-size: 14px !important; height: 14px; text-align: center; text-transform: uppercase; } #list_surround { background-color: transparent; background: transparent; background-position: center top; background-repeat: no-repeat; margin-left: 5px; padding-top: 50px; text-transform: none; width: 800px; } #list_surround tr:hover .category_totals, #list_surround[align="center"] tbody tr:hover td, #list_surround[align="center"] + tbody tr:hover { background-color: transparent; } .td1, .td2 { background: rgba(228, 232, 147, 0.8); background-position: center center; border-style: hidden; color: #365300; padding: 3px; } .table_header { background: rgba(228, 232, 147, 0.8); border-style: hidden; color: #7ea04a !important; padding: 3px; } .td1[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td1[width="45"] { font-size: 11px; font-weight: bold; } .td1[width="70"] { font-size: 11px; font-weight: bold; } .td2[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td2[width="45"] { font-size: 11px; font-weight: bold; } .td2[width="70"] { font-size: 11px; font-weight: bold; } .td1:last-child, .td2:last-child, .table_header:last-child { background-position: right center; } .table_header[width="125"] { padding-left: 1px; padding-right: 20px; width: 200px; } .td1:first-child, .td2:first-child, .table_header:first-child { background-position: left center; padding-left: 10px; text-align: center; width: 20px; } [id^="menu"] .td1 { padding-left: 50px; padding-right: 20px; text-align: left; } [id^="menu"] .td2 { padding-left: 50px; padding-right: 20px; text-align: left; } small *, small { font-size: 11px; } .table_headerLink { color: #365300; font-weight: normal; } .table_headerLink:visited { color: #000000; font-weight: normal; } .table_headerLink:hover { color: #FFFFFF; font-weight: normal; } .status_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 14px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-top-style: solid; border-width: 2px !important; } .status_not_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 12px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-width: 2px !important; border-top-style: solid; } .header_title { font-size: 40px; font-family: century gothic; margin-top: -20px; margin-bottom: 10px; margin-left: 40px; } .header_cw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_completed { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_onhold { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_dropped { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_ptw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .category_totals { background: rgba(228, 232, 147, 0.8); color: #365300; font-size: 10px; height: 40px; text-align: center; border-radius: 0 0 30px 30px; } #grand_totals { background-position: center top; background-repeat: no-repeat; color: #FFFFFF; font-family: Verdana,Arial; font-size: 10px; height: 25px; padding: 29px; text-align: center; } #copyright { background-image: url("http://img7.imageshack.us/img7/7540/copyrightbackground.png"); background-repeat: no-repeat; color: #ECE0E3; font-size: 9px; font-weight: normal; height: 50px; margin: 0 auto; padding-top: 10px; text-align: center; text-shadow: 0 0 0.5em #FFDEEE; width: 475px; } That should do it. but if not You can PM me and I'll fix it for You. Oh that was quick. It works perfectly. Thank you! |
Nov 8, 2014 12:06 AM
#2373
HuaXue said: ZmBzRALIVE said: HuaXue said: Not sure if this was asked yet but... I'm using a premade Yotsuba layout, and it looks great. Only problem is, the list is a bit narrow for my tastes. Is there any way to make it a little wider? mal: http://myanimelist.net/animelist/HuaXue Do You mean the list it's self? cause if so then yes it's easy Replace with body { background-attachment: fixed !important; background-COLOR: #e4e893 !important; background-image: url(http://i.imgur.com/rTFNd5R.jpg) !important; background-repeat: repeat !important; background-size: cover !important; color: #FFFFFF; font-family: Verdana, Arial; font-size: 10px; } #list_surround { position: absolute !important; right: 60px !important; } #inlineContent { display: inline-block !important; height: 362px !important; left: 0 !important; position: absolute !important; top: 0 !important; width: 605px !important; z-index: -1 !important; } #grand_totals { background-color: transparent; border: 0 none; border-radius: 3px 3px 3px 3px; color: #EEEEEE; line-height: 20px; min-height: 20px; text-align: center; transition: all 0.25s ease-in-out 0s; vertical-align: middle; } a { color: #7aa23f; text-decoration: none; } a:visited { color: #7aa23f; text-decoration: none; } a:hover { color: #45631b; text-decoration: none; } small { color: #365300; font-size: 8px !important; text-decoration: none; } #searchBox { background-color: #e4e893; border-color: #FFFFFF; border-style: solid; border-width: 1px; color: #FFFFFF; font-size: 14px !important; height: 14px; text-align: center; text-transform: uppercase; } #list_surround { background-color: transparent; background: transparent; background-position: center top; background-repeat: no-repeat; margin-left: 5px; padding-top: 50px; text-transform: none; width: 800px; } #list_surround tr:hover .category_totals, #list_surround[align="center"] tbody tr:hover td, #list_surround[align="center"] + tbody tr:hover { background-color: transparent; } .td1, .td2 { background: rgba(228, 232, 147, 0.8); background-position: center center; border-style: hidden; color: #365300; padding: 3px; } .table_header { background: rgba(228, 232, 147, 0.8); border-style: hidden; color: #7ea04a !important; padding: 3px; } .td1[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td1[width="45"] { font-size: 11px; font-weight: bold; } .td1[width="70"] { font-size: 11px; font-weight: bold; } .td2[width="125"] { font-size: 11px; padding: 1px 20px 1px 1px; width: 200px; } .td2[width="45"] { font-size: 11px; font-weight: bold; } .td2[width="70"] { font-size: 11px; font-weight: bold; } .td1:last-child, .td2:last-child, .table_header:last-child { background-position: right center; } .table_header[width="125"] { padding-left: 1px; padding-right: 20px; width: 200px; } .td1:first-child, .td2:first-child, .table_header:first-child { background-position: left center; padding-left: 10px; text-align: center; width: 20px; } [id^="menu"] .td1 { padding-left: 50px; padding-right: 20px; text-align: left; } [id^="menu"] .td2 { padding-left: 50px; padding-right: 20px; text-align: left; } small *, small { font-size: 11px; } .table_headerLink { color: #365300; font-weight: normal; } .table_headerLink:visited { color: #000000; font-weight: normal; } .table_headerLink:hover { color: #FFFFFF; font-weight: normal; } .status_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 14px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-top-style: solid; border-width: 2px !important; } .status_not_selected { color: #FFFFFF; font-family: Century Gothic,Verdana,Arial; font-size: 12px; font-weight: bold; padding: 5px; background: rgba(228, 232, 147, 0.8); border-bottom-style: solid; border-width: 2px !important; border-top-style: solid; } .header_title { font-size: 40px; font-family: century gothic; margin-top: -20px; margin-bottom: 10px; margin-left: 40px; } .header_cw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_completed { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_onhold { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_dropped { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .header_ptw { margin-top: 25px; background: rgba(228, 232, 147, 0.8); border-radius: 30px 30px 0 0; } .category_totals { background: rgba(228, 232, 147, 0.8); color: #365300; font-size: 10px; height: 40px; text-align: center; border-radius: 0 0 30px 30px; } #grand_totals { background-position: center top; background-repeat: no-repeat; color: #FFFFFF; font-family: Verdana,Arial; font-size: 10px; height: 25px; padding: 29px; text-align: center; } #copyright { background-image: url("http://img7.imageshack.us/img7/7540/copyrightbackground.png"); background-repeat: no-repeat; color: #ECE0E3; font-size: 9px; font-weight: normal; height: 50px; margin: 0 auto; padding-top: 10px; text-align: center; text-shadow: 0 0 0.5em #FFDEEE; width: 475px; } That should do it. but if not You can PM me and I'll fix it for You. Oh that was quick. It works perfectly. Thank you! Haha no problem :) If You have any more problem's let me know c: |
Nov 8, 2014 12:19 AM
#2374
ZmBzRALIVE said: Shishio-kun said: ZmBzRALIVE said: what is the Correct Size for a Member card? There is no correct size. But if they were too small (under 100px wide?) or way too big (over 400px wide?) they would probably look bad, might not even look like a card anymore. I mean, What is the most common size for it? Cause I notice Most of them are the same size. I'd say the average size of most good cards is about 360 x 240. 360w 240h if a horizontal card. 360h 240w if a vertical card. You can also just right click the cards and look at image info to see the sizes for yourself. |
Nov 8, 2014 12:19 AM
#2375
Hey Guy's I'm having a Bit of a problem with My TopBar So Yeah Is it possible to fix this? Here is the coding: Thank's, ZmBzRALIVE |
ZmBiUnicornNov 8, 2014 12:49 AM
Nov 8, 2014 12:26 AM
#2376
ZmBzRALIVE said: Hey Guy's I'm having a Bit of a problem with My Header So Yeah Is it possible to fix this? Here is the coding: Thank's, ZmBzRALIVE You didn't describe what was wrong with it or if you changed anything about it- so I'm gonna assume its supposed to be the original one. The background codes were taken out. So thats why you're not seeing the backgrounds on it anymore. You can just get the original codes for it here: http://storage.live.com/items/4A07C1EEED420167%21165 The background images are in there. btw most ppl call that the topbar, not the header, headers are above the tables on your list. edit: Oh nevermind, I can see the doubling problem in the spoiler pic now. |
Shishio-kunNov 8, 2014 1:44 AM
Nov 8, 2014 12:50 AM
#2377
Shishio-kun said: ZmBzRALIVE said: Hey Guy's I'm having a Bit of a problem with My Header So Yeah Is it possible to fix this? Here is the coding: Thank's, ZmBzRALIVE You didn't describe what was wrong with it or if you changed anything about it- so I'm gonna assume its supposed to be the original one. The background codes were taken out. So thats why you're not seeing the backgrounds on it anymore. You can just get the original codes for it here: http://storage.live.com/items/4A07C1EEED420167%21165 The background images are in there. btw most ppl call that the topbar, not the header, headers are above the tables on your list. -.- The problem is that the image's for the button's are over lapping each other :3 so yeah..... It's even like this with the Original Coding so.... Yeah I'm guessing it's a problem with My coding for the whole page not the "Import" because it work's fine everywhere else so... yeah |
ZmBiUnicornNov 8, 2014 1:34 AM
Nov 8, 2014 1:52 AM
#2378
Based on what I'm seeing now, you have too much width on the topbar buttons in your current topbar CSS. Also, if your layout CSS uses "a" or similar code it can customize all the links on the page including those topbar icons which are links, and things like padding and width on that code can affect the topbar links: https://dl.dropboxusercontent.com/s/1oykcnyvy1rs492/MrEpicMichael%27s%20Top%20Bar.CSS?dl=0 Like with "*", you generally don't want to use "a" or "a:hover". "a:visited" etc codes if possible, or at least override the a codes in your topbar with !Important. For example is "a" had padding: 100px;, and thats affecting your topbar links, then set your topbar links to 0 (or w/e they are by default) with !important before the semi-colon. This way the a code stuff won't affect your topbar's padding and cause problems. You're now using a different topbar in your anilist layout than the one you showed here... the problem is in this part of your code. By clearing away parts of your code in Firebug, its easy to find whats causing the topbar issue: .td1, .td2, a, a:visited, .category_totals, .table_header #grand_totals, #copyright { border-color: rgba(0, 0, 0, 0); border-radius: 5px 5px 5px 5px; border-style: solid; border-width: 1px; padding: 15px 15px 5px 5px; Color: #2F467A; /* This command allows You to edit Your "List" Text color. */ Font-Family: Lucida Grande; /* This command allows You to edit Your Font In Your List. */ Font-Size: 18px; /* This command allows You to edit the "Font Size" for the "Edit, More, Ect. Button" in Your List. */ } Its the a selectors and the padding |
Nov 8, 2014 1:10 PM
#2379
Hi my posters are not working I need help! |
"If it’s your wish, I will follow you everywhere even if your throne crumbles, and your shiny crown turns to rust even if the bodies pile up endlessly, above the bottomless pile corpses Beside you as you lie softly down, I will be until i hear the words “Check Mate” ! -Sebastian (Black Butler) |
Nov 8, 2014 1:16 PM
#2380
Messi98r8 said: Hi my posters are not working I need help! Copied and pasted from same question in the Support forum Shishio-kun said: Why: U5's dropbox crashed, it does this like once a week now, thats where your covers come from. With the account crashed the CSS links to it are no longer working. Your topbar is also a dead link. Solutions: I put a ton of solutions to these problems on the front page of the club where you got this layout and topbars from. You can use the "All anime covers update" to get a line of CSS that will replace your covers for now. You can use the "All topbars fixed..." update to get the topbar you used to have back. All this is also featured under "Site problems and fixes" at the top of club info and in the stickies of forum of same club. |
Nov 12, 2014 2:14 AM
#2381
Guys, I can't seem to get rid of the extra space on the right side of my mal. You can see here what I mean, http://i.imgur.com/Atkh1e9.png MAL: http://myanimelist.net/animelist/FantomX Any help would be appreciated. |
Nov 12, 2014 3:28 AM
#2382
FantomX said: remove the section "body: after"Guys, I can't seem to get rid of the extra space on the right side of my mal. You can see here what I mean, http://i.imgur.com/Atkh1e9.png MAL: http://myanimelist.net/animelist/FantomX Any help would be appreciated. |
Nov 12, 2014 4:29 AM
#2383
Oiomi-chan said: Thanks. That worked. :)FantomX said: remove the section "body: after"Guys, I can't seem to get rid of the extra space on the right side of my mal. You can see here what I mean, http://i.imgur.com/Atkh1e9.png MAL: http://myanimelist.net/animelist/FantomX Any help would be appreciated. |
SelfScientistNov 12, 2014 4:35 AM
Nov 13, 2014 9:52 AM
#2384
Ok, so I'm working on a bit of an overhaul of my list, but I'm not sure how to do a certain major element. I've tried google as well as looking for other lists that implement it, but I can't find the code I'm looking for. You can see my list here [url]http://myanimelist.net/animelist/morcac[/url] for reference. What I want to do is move the tags section so that it is directly to the right of the score section for each show, and make the comment section appear to the far right. The end goal being that I can give more complex scores by placing something like .25 in the tag while still maintaining my notes on each show. My problem is that I don't know how MAL labels any of these objects meaning that I have no idea how to move them. Anyone have a solution? |
7TeenWritersNov 13, 2014 9:56 AM
Nov 14, 2014 4:47 PM
#2385
morcac said: Ok, so I'm working on a bit of an overhaul of my list, but I'm not sure how to do a certain major element. I've tried google as well as looking for other lists that implement it, but I can't find the code I'm looking for. You can see my list here [url]http://myanimelist.net/animelist/morcac[/url] for reference. What I want to do is move the tags section so that it is directly to the right of the score section for each show, and make the comment section appear to the far right. The end goal being that I can give more complex scores by placing something like .25 in the tag while still maintaining my notes on each show. My problem is that I don't know how MAL labels any of these objects meaning that I have no idea how to move them. Anyone have a solution? To move the tags column you can use- .td1:nth-of-type(6), .td2:nth-of-type(6) { background: green; margin-left: -500px; position: absolute; } I turn it green so its easy to find, you can remove that later. You can use the margin-left code to move it around (play with the number). You could move it over the score column. The comments thing is a pain to code since its hidden and part of a lot of other stuff, maybe someone else will code that for you- I think an easier alternative would be to use animetitle specific after codes, like: .animetitle[href*="anime/6547/"]:after{ color: gold !important; margin-left: 10px; content: "This anime was ok."; } Should add "This anime was ok." to Angel Beats on your list in gold text. Notice the number 6547 in the first line, this corresponds to its number on MAL if you visit or look at the link on it. Every anime can have a code and line like this. Content is where you put your custom text. |
Nov 14, 2014 5:56 PM
#2386
Shishio-kun said: morcac said: Ok, so I'm working on a bit of an overhaul of my list, but I'm not sure how to do a certain major element. I've tried google as well as looking for other lists that implement it, but I can't find the code I'm looking for. You can see my list here [url]http://myanimelist.net/animelist/morcac[/url] for reference. What I want to do is move the tags section so that it is directly to the right of the score section for each show, and make the comment section appear to the far right. The end goal being that I can give more complex scores by placing something like .25 in the tag while still maintaining my notes on each show. My problem is that I don't know how MAL labels any of these objects meaning that I have no idea how to move them. Anyone have a solution? To move the tags column you can use- .td1:nth-of-type(6), .td2:nth-of-type(6) { background: green; margin-left: -500px; position: absolute; } I turn it green so its easy to find, you can remove that later. You can use the margin-left code to move it around (play with the number). You could move it over the score column. The comments thing is a pain to code since its hidden and part of a lot of other stuff, maybe someone else will code that for you- I think an easier alternative would be to use animetitle specific after codes, like: .animetitle[href*="anime/6547/"]:after{ color: gold !important; margin-left: 10px; content: "This anime was ok."; } Should add "This anime was ok." to Angel Beats on your list in gold text. Notice the number 6547 in the first line, this corresponds to its number on MAL if you visit or look at the link on it. Every anime can have a code and line like this. Content is where you put your custom text. Thanks, this is what I needed. Unfortunately I'm experiencing some issues. It took a bit of work to get things positioned somewhat right (it's still not perfect, but I can fix that easily enough). Now the problem is with the fact that my rows are semi-transparent. In the places where they're on top of each other the color is different. Any way to keep them from overlapping like this? Also the headers for each object (score and the like) move independently, what would I use to reposition them? I'm also slightly concerned about being able to make the table match up and look uniform in the end because after what I did the length changes a bit for each row for some reason. Lastly for the comments, I like how it works, but my major worry is that there isn't as much space as I would like. Some code to increase the height of each row to allow multiple lines of text might be helpful (or another solution if you can think of something that works better). Sorry for the really specific requests. |
Nov 15, 2014 1:47 AM
#2387
You know what instead, you should probably use the animetitle after for the extra score thing. You just move it right past the score. You can keep the tags as they are then: .animetitle[href*="anime/6547/"]:after { color: black !important; content: ".25"; left: 50%; margin-left: 170px; position: absolute !important; } If you're not gonna use that tho, you can try set the background color to transparent so the color of moved parts so it doesn't overlap colors. You can also use an editor like Firebug to move the stuff too so its easier. Its .table_header:nth-of-type(6) to select individual headers. The number in the parenthesis is for the column # (tags is 6th column). You can set them to visibility hidden or another code that hides a selector. Might say in the code how to give more height to the rows. You can also try .td1, .td2 { padding-bottom: 200px; } There's a tutorial in the Customize your list section on expanding tags: http://myanimelist.net/forum/?topicid=419405 |
Nov 15, 2014 8:35 AM
#2388
Hey Guy's Quick Question .animeTitle, animetitle:visited { Color: #B01F24; Background-Color: rgba(0, 0, 0, 0.8); Font-Family: Lucida Grande; Font-Size: 18px; What does this Section do again? |
Nov 15, 2014 8:55 AM
#2389
Shishio-kun said: You know what instead, you should probably use the animetitle after for the extra score thing. You just move it right past the score. You can keep the tags as they are then: .animetitle[href*="anime/6547/"]:after { color: black !important; content: ".25"; left: 50%; margin-left: 170px; position: absolute !important; } If you're not gonna use that tho, you can try set the background color to transparent so the color of moved parts so it doesn't overlap colors. You can also use an editor like Firebug to move the stuff too so its easier. Its .table_header:nth-of-type(6) to select individual headers. The number in the parenthesis is for the column # (tags is 6th column). You can set them to visibility hidden or another code that hides a selector. Might say in the code how to give more height to the rows. You can also try .td1, .td2 { padding-bottom: 200px; } There's a tutorial in the Customize your list section on expanding tags: http://myanimelist.net/forum/?topicid=419405 Thanks, that's everything I needed. I implemented it and it works great! Now just for the finishing touches. |
Nov 15, 2014 11:21 AM
#2390
ZmBzRALIVE said: Hey Guy's .animeTitle, animetitle:visited { Color: #B01F24; Background-Color: rgba(0, 0, 0, 0.8); Font-Family: Lucida Grande; Font-Size: 18px; What does this Section do again? Its supposed to be for the anime/manga title links on your list. But both those codes won't work cuz they're both wrong. It should be .animetitle, .animetitle:visited You also have to finish that set with a closing bracket. |
Nov 15, 2014 1:14 PM
#2391
Hello :) I use this style in base : http://myanimelist.net/forum/?topicid=393503&show=20#msg15991383 than i link from SAO style nav. bar and menu : [http://myanimelist.net/forum/?topicid=1156725#msg30240717 And add image preview on mouse hover. Works all without SAO menu(SAO top bar working). What overflows it i didn't notice. The "table" item of menu simplly have 0 width. @import url(https://googledrive.com/host/0BxjwQr0BBXs-aWFrYzJjVnpoVVE); /*bottom category menu*//* @import url("http://dl.dropbox.com/u/61796201/css/Suzune-chan/bottommenu.css") all; */ /*thin top bar*//* @import url("http://dl.dropbox.com/u/61796201/css/Suzune-chan/topbar.css") all; */ /*Temporary .....Header, navigation*/ @import "https://dl.dropboxusercontent.com/u/102421246/MAL/CSS/Lists/SAO/SaoTopMenuHahaido.css"; @import url(https://googledrive.com/host/0BxjwQr0BBXs-aDYxM2JlaFM2bnM); @import "https://dl.dropboxusercontent.com/u/102421246/MAL/CSS/Lists/SAO/SaoHahaidoCategory.css"; /*Temporary .....*/ @import url(http://fonts.googleapis.com/css?family=Happy+Monkey); /* @import "http://dl.dropbox.com/u/78340470/Icon%20Style%20Menu%20Bar/IconStyleCSS.css";*/ /* BACKGROUND IMAGE This is the main background image for the whole page. Change the image link to the background you want! For more help see here: http://myanimelist.net/forum/?topicid=419405&show=0#post1 */ body { background-image: url(http://s2.hostingkartinok.com/uploads/images/2012/06/ee1d87f7eb7e8cb13898ae57d22a9aa4.png); background-attachment: fixed; } /* REPOSITION MAIN BACKGROUND Change the position your background starts on your screen from with the two properties after "background-position" below. For example, the default code starts it from the left and top corner of the screen. You change 'left' and 'top' other properties, they can be any of the following: left, top, bottom, right, or center. So if you want your background to start from the center of the screen, use "center center". If you want it to start from the top and center, use "top center". If you want it to start from the right and top, use "right top" If you want it to start from the right and bottom, use "right bottom" and so forth... Additionally, you can change "left" to a % to determine how far left or right the background starts from. For example "30% top" will start the background from the top but 30% of the pic's width from the left of the layout. You can also change top to a % to change the amount you want to start it from the top or bottom. */ body{ background-position: left top; background-size: 1920px 1080px } /* HEADER COLOR AND FONT These codes control the main headers' fonts and colors. Every header is above each part of your list (they say things like Currently Watching, Completed, Dropped, etc). */ .header_title { color: white; font-family: 'Happy Monkey', cursive; font-size: 26px; text-shadow: 3px 3px 3px #000; text-align: left; background-color: transparent; background-image: url(http://s2.hostingkartinok.com/uploads/images/2012/06/242259dd6373d5eaa625c6b1c18bfed2.png); } /* SUB-HEADERS BACKGROUND COLOR COLOR Below each main header is the sub-header which says Score, Episodes, Tags, etc. */ .table_header { background-color:Black; } /* ANIME/MANGA TITLE FONTS This is the type and color of the anime/manga titles on your list, like Bleach, Vampire Knight, etc. */ .animetitle, .animetitle:visited { color:white; font-family: 'Happy Monkey', cursive; text-shadow: 2px 2px 2px #000; font-size:12px; } /* LIST FONTS This is the type and color for more of the numbers, links, and words on the list itself! */ .td1, .td2, a, a:visited, .category_totals, .table_header, #grand_totals, #copyright { color:wheat; font-family: 'Happy Monkey', cursive; text-shadow: 2px 2px 2px #000; font-size:13px; } /* LIST WIDTH Use this to increase the width of your list! */ #list_surround { width:900px; } /* LIST POSITION Change left to right to set it on the right side. Add to the px amount (5px by default) to change how far from the side it is. To center a list, see this tutorial: http://myanimelist.net/forum/?topicid=393437&show=0#post1 */ #list_surround { position: absolute !important; margin: auto !important; right: 0px !important; padding:-200px; left: 0px !important;} /*OTHER CODES Important codes for the layout's setup. Please don't mess with these. If you want to customize more on the page, come to my group and ask or move on to a more advanced layout. */ body { font-weight: light; background-repeat: no-repeat; background-color: #FBFDE8; } *#list_surround { background-image:url(); left:2px; position:absolute; } a { text-decoration:none; } a:visited { text-decoration:none; } a:hover, a:visited:hover { color:#D3D3D3; text-decoration:underline; } .category_totals, .td1, .td2, #grand_totals, #copyright { background-image:url(http://s2.hostingkartinok.com/uploads/images/2012/06/242259dd6373d5eaa625c6b1c18bfed2.png); border-width:0; padding:2px; } .category_totals:HOVER, .td1:HOVER, .td2:HOVER, #grand_totals:HOVER, #copyright:HOVER {background-image:url(http://s1.hostingkartinok.com/uploads/images/2012/06/b8b3dd79e72266b695c3650624abb9c2.png); border-width:0; padding:2px; } #copyright:after { content: " Custom CSS by Shishio-kun. Google 'Shishio's Custom Lists' for more designs and info."; } *.status_selected { display: none; background-color:black; padding: 2px; color:white; text-decoration: blink; } *.status_not_selected { display: none; background-color:black; padding: 2px; color:white; } *.status_selected a{ display: none; color:blue; } *.status_not_selected a{ display: none; color:white; } .thickbox { color:cyan; font-family: 'Happy Monkey', cursive; text-shadow: 2px 2px 2px #000; font-size:12px; } .header_title { height:32px; padding:2px; } .table_header { border-width:0; font-weight:bold; padding:2px; } .category_totals { height:30px; } #copyright, #grand_totals { text-align: center; margin:0 auto; } /* COVER AREA The surrounding area containing each cover pic which appears when you point to a row (requires #more CSS to see a DVD or manga cover). Move the actual section by changing the numbers after the top and left codes. Resize the pic with the px amount after background-size:. It will resize the actual cover pic! Adjust the surrounding colored area with the px amounts after padding. Height and width can do this too. Change the position of the cover pic with the % amounts after background-position. Its by default set to be 50% to the left (centered horizontally) and 50% from the top (centered vertically). Remove only the border-radius: 25px 25px 25px 25px; lines to take the rounded corners away. Increase height and width to make the pics bigger. Delete border-style: solid; to remove the border. For changing the original background color see the bottom of the original post: http://myanimelist.net/forum/?topicid=563993 */ .hide { background-color: rgba(200, 5, 200, 0.75); background-position: 50% 50% !important; background-repeat: no-repeat !important; border-color: white; border-radius: 25px 25px 25px 25px; border-style: solid; border-width: 1px; display: block !important; height: 350px; left: 670px; position: fixed; top: 158px; width: 234px; padding: 79px 40px 10px 10px; background-size: 250px !important; visibility: hidden; opacity: 0; } /* PREVIEW MSG ABOVE COVERS Remove content: "preview"; to remove the PREVIEW text. Change the text in quotations after content to what you want it to say above your cover pic. Top and width controls the position of the text. */ .hide:before { background: none repeat scroll 0 0 transparent; border-radius: 25px 25px 0 0; color: white; content: "PREVIEW"; padding-bottom: 5px; position: absolute; text-align: center; top: 0px; width: 250px; } /* OTHER SETTINGS */ :hover + .hide { visibility: visible; opacity: 1; } |
kseon12Nov 15, 2014 1:19 PM
Nov 15, 2014 2:01 PM
#2392
kseon12 said: Hello :) I use this style in base : http://myanimelist.net/forum/?topicid=393503&show=20#msg15991383 than i link from SAO style nav. bar and menu : [http://myanimelist.net/forum/?topicid=1156725#msg30240717 And add image preview on mouse hover. Works all without SAO menu(SAO top bar working). What overflows it i didn't notice. The "table" item of menu simplly have 0 width. I don't know what you're asking, and I don't see any problems on your list. |
Nov 15, 2014 2:42 PM
#2393
Shishio-kun said: ZmBzRALIVE said: Hey Guy's .animeTitle, animetitle:visited { Color: #B01F24; Background-Color: rgba(0, 0, 0, 0.8); Font-Family: Lucida Grande; Font-Size: 18px; What does this Section do again? Its supposed to be for the anime/manga title links on your list. But both those codes won't work cuz they're both wrong. It should be .animetitle, .animetitle:visited You also have to finish that set with a closing bracket. Thank's I thought so but I was not sure been a while so I forgot, Haha. So yeah I just realized that I put a Cap's. Thank You for pointing it out Senpai :3 |
Nov 15, 2014 3:02 PM
#2394
Shishio-kun said: kseon12 said: Hello :) I use this style in base : http://myanimelist.net/forum/?topicid=393503&show=20#msg15991383 than i link from SAO style nav. bar and menu : [http://myanimelist.net/forum/?topicid=1156725#msg30240717 And add image preview on mouse hover. Works all without SAO menu(SAO top bar working). What overflows it i didn't notice. The "table" item of menu simplly have 0 width. I don't know what you're asking, and I don't see any problems on your list. there should be right bar (like on the picture below) with watching/complete/etc http://i.imgur.com/emOMp5a.png but it simply not displaying |
Nov 15, 2014 3:48 PM
#2395
another quick question, How do You like...Import..font's? so everyone can see them without them being installed? :3 |
Nov 16, 2014 9:48 AM
#2396
Nov 16, 2014 12:32 PM
#2397
kseon12 said: there should be right bar (like on the picture below) with watching/complete/etc http://i.imgur.com/emOMp5a.png but it simply not displaying Layout you chose to add stuff to turns off category links. Use a different layout or remove all the codes: *.status_selected { display: none; background-color:black; padding: 2px; color:white; text-decoration: blink; } *.status_not_selected { display: none; background-color:black; padding: 2px; color:white; } *.status_selected a{ display: none; color:blue; } *.status_not_selected a{ display: none; color:white; } ZmBzRALIVE said: another quick question, How do You like...Import..font's? so everyone can see them without them being installed? :3 Go to customize your list tutorials and find topic on this: http://myanimelist.net/forum/?topicid=419405 Also you can just upload a font to a hosting site like Dropbox then import a direct link to it in your CSS. In the original spacebar topbar CSS you see an example of this too. CrazyBear said: I'm hesitant to ask this, but how do I change a header in my manga list from "Watching" to something like "Reading" instead? Find the code for it in your CSS (#list_surround .header_cw) and change the background image with one you make. The topic where you got the layout might have more information too. Also try to use the link above and find the header changing tutorial for more info. |
Nov 16, 2014 4:21 PM
#2398
Shishio-kun Domo arigatou :) I didn't know tag names, that's why i didn't pay attention to that lines |
Nov 16, 2014 7:04 PM
#2399
I am having trouble with the "more" button on my them. Since MAL readded the youtube embedding I am trying to integrate it in my current theme. I managed to find what handles the button. } #list_surround small a { visibility: hidden; font-size: 40px; } After just playing around I got the button to show up, but I cannot click it. } #list_surround small a { color: #808080; font-size: 12px !important; font-style: italic; font-variant: small-caps; left: 1; opacity: 0.8; position: absolute; text-decoration: none; top: 1px; visibility: visible !important; width: 24px; z-index: 1; } If at all possible is there a way that I can have the button on the left side of my portraits and when clicked a popup window similar to my edit window appears, or something that at least functions without looking horrible. I thank you in advance for your help. FULL CSS @import "https://dl.dropboxusercontent.com/u/97405770/Layout_DVDcover/CSS/topbar.css"; @import "https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/Universal/anime.css"; @import "https://dl.dropboxusercontent.com/u/97405770/Layout_DVDcover/CSS/FixedCss.css"; body,a { cursor:url(https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/V3/Curser%20Assets/Iwasawa.png) 1 2, auto; } a:hover { cursor: url(https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/V3/Curser%20Assets/Iwasawa_link_select.png) 1 2, auto; } /*#################################################*/ /*#############Change Banner images below##############*/ /*#################################################*/ .header_cw { background: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/Watching.png")!important; } .header_completed { background: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/completed.png")!important; } .header_onhold { background: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/Hold.png")!important; } .header_dropped { background: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/Dropped.png")!important; } .header_ptw { background: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/PTW.png")!important; } /*############Change background image below############*/ body { background-image: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/BackDrop.jpg"); } /*#################################################*/ /*#################################################*/ .status_selected a:hover { } #list_surround:nth-of-type(n+4) .category_totals { } #list_surround:nth-of-type(n+4) { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); float: left; height: 274px !important; margin-left: -10px !important; opacity: 10; position: relative; -layout: fixed; width: 180px !important; z-index: 1 !important; } tr:hover{ opacity: 1 !important; } /* SORT */ .table_header span { display: none !important; } /* Disable Tags in the Sort Options */ .table_header[width="125"] { display: none !important; } .header_cw +, .header_completed +, .header_onhold +, .header_dropped +, .header_ptw + { position: fixed; display: block !important; left: 381px; top: 32px; width: 110px !important; } .table_header { position: absolute !important; display: inline-block; z-index: 2; } .table_header:hover .table_headerLink { visibility: visible !important; opacity: 1 !important; } .table_headerLink strong { font-weight: normal !important; } .table_headerLink, .table_header:nth-of-type(2):before { display: inline-block; width: 110px; padding: 7px 0; font-family: calibri; line-height: 17px; font-size: 11px; color: #FFFFFF; text-align: center; text-decoration: none; font-weight: normal !important; border-style: solid; border-color: #000000; border-width: 0 1px 1px 1px; background-color: rgba(0, 0, 0, .6); } .table_headerLink { font-variant: small-caps; opacity: 0; position: relative !important; text-shadow: 0 0 5px #000000; visibility: hidden; } .table_header:nth-of-type(2):before { content: "Sort List"; left: 381px; opacity: 1; position: fixed; top: 0; visibility: visible; z-index: 2; font-variant: small-caps; font-size: 12px; border-radius: 0 0 0 5px; } tr:hover .table_headerLink { visibility: visible; opacity: 1 } .table_headerLink:hover, tr:hover .table_header:nth-of-type(2):before { background-color: rgba(0, 0, 0, 1); } .table_header:nth-of-type(3) { margin-top: 32px; z-index: 2; } .table_header:nth-of-type(4) { margin-top: 64px; z-index: 2; } .table_header:nth-of-type(5) { margin-top: 96px; z-index: 2; } .table_header:nth-of-type(6) { margin-top: 128px; z-index: 2; } .table_header:nth-of-type(7) { margin-top: 128px; z-index: 2;} .table_header:nth-of-type(8) { margin-top: 160px; z-index: 2; } #list_surround >:first-of-type { position: fixed !important; left: 492px; top: 0; width: 550px; z-index: 2; } .status_selected, .status_not_selected { position: relative !important; width: 110px !important; } .status_selected a, .status_not_selected a { display: inline-block; width: 110px; padding: 7px 0; font-family: calibri; font-size: 13px; color: #FFFFFF; font-variant: small-caps; text-decoration: none; border-style: solid; border-color: #000000; border-width: 0 0 1px 1px; background-color: rgba(0, 0, 0, .6); } .status_selected:last-child, .status_not_selected:last-child { display: none !important; } .status_selected a, .status_not_selected a:hover { background-color: rgb(0, 0, 0); } .hide { background-image: url("https://dl.dropboxusercontent.com/u/24965022/MAL%20Theme%20Assets/AnimePage/NoCoverImage.jpg"); border-radius: 5px; background-size: 100%; border-color: #000000; border-style: solid; border-width: 1px; display: inline-block !important; float: left; height: 265px !important; margin-bottom: 8px; margin-left: -160px; padding-left: 0; position: relative; visibility: visible !important; width: 189px; z-index: 0; box-shadow: 0 0 5px black inset; } body { background-attachment: fixed; background-clip: border-box; background-color: rgba(0, 0, 0, 0); background-repeat: no-repeat; background-size: cover !important; font-family: calibri; } a:hover { color: white !important; } #list_surround { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); border-left-style: solid; border-right-style: solid; border-width: 1px; margin: 0 auto auto 30px; padding-top: 242px; position: absolute; width: 1016px; box-shadow: 0 0 4px black; } /*############################COLUMNS#####################*/ .td1, .td2 { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); padding-right: 15px; } .td1 a, .td2 a { color: #FFFFFF; } td[class^="td"]:nth-of-type(2) {} .animetitle { color: #D3D3D3 !important; font-family: century gothic; font-variant: small-caps; left: 25px; max-width: 180px; overflow: hidden; position: absolute; text-align: center; text-decoration: none; text-overflow: ellipsis; text-shadow: 1px 1px 1px #000000, 0 0 4px #000000; top: 213px; white-space: nowrap; } td[class^="td"]:nth-of-type(3) { background: transparent; color: #FFFFE0; display: inline !important; font-family: fantasy; font-size: 20px; left: 169px !important; position: relative; text-align: center !important; text-decoration: none; text-shadow: 0 0 1px #FFD700, 0 0 2px #FFA500; top: 237px !important; width: 30px !important; padding-right: 0px ; } td[class^="td"]:nth-of-type(3) a { color: #FFFFE0 !important; font-family: century gothic; font-size: 22px; text-decoration: none; } td[class^="td"]:nth-of-type(4) { font-size: 14px; font-style: italic; font-weight: bold; left: 30px !important; position: relative; top: 239px !important; } td[class^="td"]:nth-of-type(5) { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6); border-bottom-style: none !important; border-color: #000000; border-top: 1px solid #000000; border-width: 1px; box-shadow: 0 0px 4px black inset; color: #FFFFE0; font-family: century gothic; font-size: 16px; font-style: italic; font-weight: bold; height: 18px; left: 3px; margin-left: 17px; padding-bottom: 3px; padding-left: 10px; padding-top: 34px; position: absolute; top: 211px; width: 166px; z-index: -1; border-radius: 0px 0px 3px 3px; } td[class^="td"]:nth-of-type(5) a { font-style: italic; font-weight: bold; text-decoration: none; } td[class^="td"]:nth-of-type(6) { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.65); color: #FFFFE0; font-family: comic sans ms; font-size: 12px; font-style: italic; height: 191px !important; margin-left: 17px; opacity: 0; padding-left: 12px; padding-top: 20px; position: absolute; text-align: left; top: 1px !important; width: 162px; border-radius: 2px 2px 0 0; } td[class^="td"]:nth-of-type(6) a { color: #FFFFE0; font-family: comic sans ms; font-size: 12px; font-style: italic; text-decoration: none; } td[class^="td"]:nth-of-type(6) a:hover { color: #FFFFE0 !important; } td[class^="td"]:nth-of-type(1) { background: url("https://dl.dropboxusercontent.com/u/97405770/Layout_DVDcover/Add.Images/star3.png") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); content: " "; display: inline; font-size: 0; left: 168px; padding: 16px; position: relative !important; top: 248px; } td[class^="td"]:nth-of-type(7) { display: inline; position: absolute; background: transparent; font-size: 0; width: 174px; height: 5px; left: 20px; top: 0px; border-top: solid; border-width: 1px; border-color: black; border-radius: 4px 4px 0 0; border-left-style: solid; border-right-style: solid; } td[class^="td"]:nth-of-type(8) { display: none; } /*############################BANNER CELLS######################*/ .header_title { color: rgba(0, 0, 0, 0.6); font-size: 101px; font-variant: small-caps; position: relative; top: 20px; left: -25px; font-family: century gothic; } .header_cw { border-bottom: 1px solid #000000; border-color: #000000; border-width: 1px; height: 250px; padding-left: 25px; padding-top: 140px; position: absolute; top: 0 !important; width: 1015px; } .header_completed { border-bottom: 1px solid #000000; border-color: #000000; border-width: 1px; height: 250px; padding-left: 25px; padding-top: 140px; position: absolute; top: 0 !important; width: 1015px; } .header_onhold { border-bottom: 1px solid #000000; border-color: #000000; border-width: 1px; height: 250px; padding-left: 25px; padding-top: 140px; position: absolute; top: 0 !important; width: 1015px; } .header_dropped { border-bottom: 1px solid #000000; border-color: #000000; border-width: 1px; height: 250px; padding-left: 25px; padding-top: 140px; position: absolute; top: 0 !important; width: 1015px; } .header_ptw { border-bottom: 1px solid #000000; border-color: #000000; border-width: 1px; height: 250px; padding-left: 25px; padding-top: 140px; position: absolute; top: 0 !important; width: 1015px; } /*#####################EDIT################*/ #list_surround small { background: transparent; font-size: 10; left: 39px; text-decoration: none; top: 20px; visibility: hidden; } .td1 a.List_LightBox, .td2 a.List_LightBox { color: #808080; font-size: 12px !important; font-style: italic; font-variant: small-caps; left: 186px; opacity: 0.8; position: absolute; text-decoration: none; top: 1px; visibility: visible !important; width: 24px; z-index: 2; } #list_surround small a { visibility: hidden; font-size: 40px; } /*### RELATED TO SCORE ###*/ .td1[align="center"][width="45"], .td2[align="center"][width="45"] { position: absolute; } /*### TYPE ###*/ .td1[align="center"][width="50"], .td2[align="center"][width="50"] { color: #FFFFE0; font-family: century gothic; font-style: italic; font-variant: small-caps; position: absolute; text-align: left; top: 232px !important; width: 225px; z-index: 10; font-size: 13px; margin-left: 1px; } .td1[align="center"][width="50"]:before, .td2[align="center"][width="50"]:before { color: #FFFFFF; content: " Type: "; font-style: normal; font-variant: small-caps; font-weight: normal; position: relative; text-shadow: 0 0 0 !important; } /*### PROGRESS ###*/ .td1[width="70"], .td2[width="70"] { text-align: left; } .td1[width="70"] a, .td2[width="70"] a { color: lightyellow !important; font-size: 13px; font-family: century gothic; } .td1[width="70"]:before, .td2[width="70"]:before { color: #FFFFFF; content: " Progress: "; font-variant: small-caps; position: relative; font-family: century gothic; font-size: 13px; font-weight: normal; font-style: normal; } /*### COMMENT ###*/ .td1[width="125"], .td2[width="125"] { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); left: 4px; position: absolute; top: 178px; width: 225px; } .td1[width="125"]:before, .td2[width="125"]:before { } /*### AIRING ###*/ .animetitle + small { background-color: rgba(0, 0, 0, 0.75) !important; background-image: url("https://dl.dropboxusercontent.com/u/97405770/Layout_DVDcover/Add.Images/airing.png") !important; background-position: -2px center !important; background-repeat: no-repeat no-repeat !important; background-size: 22px auto !important; border-color: #000000; border-radius: 5px 5px 0 0; border-style: solid; border-width: 1px; box-shadow: 0 2px 3px #808080 inset; color: #FFFFE0; font-family: century gothic; font-size: 12px !important; font-style: italic; font-variant: small-caps; left: 30px !important; letter-spacing: 0.3px; opacity: 1; padding: 0 3px 2px 22px; position: absolute; text-align: center; text-shadow: 0 0 3px #FFFFFF, -1px -1px 5px #FFFFFF; top: 192px !important; visibility: visible !important; z-index: 3; border-bottom-style: none; } /*### COPYRIGHT ###*/ #copyright:before { content: 'Design by Lirina. Topbar by Luxiamimi. '; display: block; font-size: 0px; color: lightyellow !important; text-align: right; font-style: normal; } #copyright { color: #FFFFFF; font-family: Tahoma; font-size: 0px; left: 740px; margin: auto !important; padding: 4px; position: absolute; right: 0; text-align: right !important; top: 206px; width: 265px; z-index: 1 !important; border-radius: 5px 0 ; font-style: italic; } .category_totals { display: none; } #copyright a { color: #FFFFFF; text-decoration: none; } #copyright:before { color: #FFFFFF; } input.inputtext, textarea.textarea, textarea.inputtext { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.6) !important; border-color: #000000; border-radius: 3px !important; border-style: solid; border-width: 1px; height: 125px; margin-left: 2px !important; padding: 3px 5px 5px !important; transition: box-shadow 0.2s linear 0s !important; width: 150px !important; } |
Nov 17, 2014 1:22 AM
#2400
Hi Shisio-kun, thanks for all you've done with the list styles; I've really enjoyed being able to customize my lists. I've been using your anime-cover with a separate tag/review box but for some reason the tag box extends downwards to the bottom of my browser (I don't see the bottom of the textbox). I have the height set at 950 so it shouldn't be that long. I tried messing around with a few different heights and setting the height pretty low (around 200 I think) made the textbox appear in the screen again, but I was hoping you could help me with this problem so I could comment beyond 1 or 2 sentences. I'm not sure if this is relevant but I think this problem started occurring around Halloween. Here is a picture of what I am talking about Relevant CSS COVER AREA The surrounding area containing each cover pic which appears when you point to a row (requires #more CSS). Left and top adjust the position it appears on screen. Control the height and width of the pic with height and width. Remove only the border-radius: 25px 25px 25px 25px; lines to take the rounded corners away. Increase height and width to make the pics bigger. Delete border-style: solid; to remove the border. */ .hide { background-size: cover; left: 10px; top: 120px; height: 300px; width: 210px; border-color: white; border-top: 2px solid white !important; border-left: 2px solid white !important; border-right: 2px solid white !important; border-bottom: 2px solid white !important; border-radius: 25px 25px 25px 25px; background-color: white; background-position: center 50% !important; background-repeat: no-repeat !Important; display: block !important; position: fixed; visibility: hidden; opacity: 0; } /* PREVIEW MSG ABOVE COVERS Remove content: "preview"; to remove the PREVIEW text. Change the text in quotations after content to what you want it to say above your cover pic. Top and width controls the position of the text. */ .hide:before { background: transparent; color: white; padding-bottom: 5px; position: absolute; text-align: center; width: 225px; top: -25px; border-radius: 25px 25px 0 0; } /* MINI REVIEW (HOVER TAG) Move the area around with the left and top codes. Adjust the surrounding area of the tags by adjusting the padding. Control the height and width of the section with the height and width codes. If your tags/mini-reviews aren't hovering correctly or you need help understanding or adjusting the background color code, see the bottom of the original tutorial: http://myanimelist.net/forum/?topicid=563993 */ td[class^='td']:nth-of-type(6) { visibility: visible; opacity: 0; position: fixed; top: 430px; left: 10px; background-color: blue; border-color: white; border-radius: 25px 25px 25px 25px; border-style: solid; border-width: 2px; font-size: 15px; height: 950px; width: 175px; padding: 10px 10px 0px 24px; color: white !important; z-index: 1; text-align: left; } /* TAG TEXT COLOR*/ tr:hover td[class^='td']:nth-of-type(6) a { color: black !important; } /* OTHER SETTINGS */ :hover + .hide , tr:hover td[class^='td']:nth-of-type(6){ visibility: visible; opacity: 1; } /* REMOVE HEADER Deletes the header Tags which isn't necessary. */ .table_header:nth-of-type(6) { display: none; } /* REMOVE TAG EDIT BUTTON Deletes the Tag's edit link which will is inaccessible with this setup, use the edit button by Animetitle to edit your tags. */ td:nth-of-type(6) small { display: none; } /* GOOGLE CHROME FIX Adjust this amount 50px at a time if your columns are uneven in Chrome. */ @media screen and (-webkit-min-device-pixel-ratio:0) { td[class^='td']:nth-of-type(2) { width: 420px !important;} } P.S. - sorry, but also do you know why comma's are in white in my tag/review boxes? The other punctuation marks are in black |
More topics from this board
Sticky: » [ BBCODE ] All 2023 BBcodes, Guides, and Templates ( 1 2 )Shishio-kun - Feb 16, 2023 |
51 |
by Shishio-kun
»»
Yesterday, 12:37 PM |
|
» ✳️ Amazing new colorful layout for your list: Guchuko!Shishio-kun - Oct 14 |
3 |
by Mocha
»»
Oct 16, 6:27 PM |
|
» [CSS- MODERN] ⭐ Minimal Dashboard layout by 5cm ~ Compact and convenient! ( 1 2 3 )Shishio-kun - Sep 4, 2020 |
131 |
by Shishio-kun
»»
Oct 14, 11:55 AM |
|
» [CSS - Modern] 🍰 Clarity by V.L ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Apr 19, 2018 |
1232 |
by sunnysummerday
»»
Oct 14, 9:37 AM |
|
» [CSS - Modern] ⭐️ Brink by V.L -- Cover-style theme! ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Mar 16, 2019 |
435 |
by slayra
»»
Oct 12, 4:04 AM |