Forum Settings
Forums
Pages (112) « First ... « 98 99 [100] 101 102 » ... Last »
Post New Reply
Mar 14, 2012 12:24 AM

Offline
Joined: Feb 2012
Posts: 532
Well, here's what I've got so far. This is my first time working wth CSS and I KNOW I need to clean up the "status images" I didn't realize they were sloppy when I uploaded them lol.

I'm thinking of putting black flowers around the status images so the flow cut off isn't so jarring. Meeby a border of some kind. I also know that Watching, Complete...ect... don't show up quite clear enough.

BUT I'm at a good stopping place and I'm going to bed now lol.

Constructive crit is welcome, as are suggestions and tips. Keep in mind, I did all the image editing on a laptop with no mouse. Not too shabby I'd say.

I feel I should thank aero as I used her source code to help me figure out CSS. Sooo... Thanks Aero!

Edit: If anyone has a source where I could find some single line writing like I have on my list, I would LOVE a link!
Modified by sisgood, Mar 14, 2012 12:29 AM
 
Mar 14, 2012 1:05 PM

Offline
Joined: Feb 2012
Posts: 532
Ok I've got it as good as it's getting for a while. I fixed the transparancy of the caligraphy so the words can be seen now, I added a butterfly and cleaned up the image. I also washed out the bg image to make the butterfly pop a little.

With how busy my bg is, I'm not sure if I could do a banner easilly but I'm open to suggestions.

I think I pretty much accomplished what I set out to do. Everything fits with the bg really well and my list headers look ALmost like Japanese caligraphy. Everything is readable on my monitor and the colors mesh well.

Feedback would be great btw. :3
 
Mar 14, 2012 7:03 PM

Offline
Joined: Mar 2010
Posts: 122
@sisgood
Criticism (not trying to sound mean):
1) I noticed that your background resizes, depending on the browser size. So, I would also have the lis do that too. For example, instead of using fixed values for the width of the list, I would use percentage ones instead, so it changes depending on the size of the brower and it would be concsistent with the background interms of proportion.
2) I've noticed that you have borders in some places while there are none in others. It kinda irritates me (I'm kind of a perfectionist). For example, you have a bored on the left side of your list for every other row. Why not just have a border around the entire list or none at all.
3) Change the color of the links when your hover your cursor over them. Its really difficult to read it.
4) Make the "category" links at the top (currently watching, completed, etc) larger or somehow more noticable. I had a hard time trying to find it. haha.

Those are just a few things you should be aware of. Putting all the small stuff aside, its a really good design for a first try. :)
 
Mar 14, 2012 8:35 PM

Offline
Joined: Feb 2012
Posts: 532
@ Drize

Thanks for the feedback!

If I could find the code to resize my list along with my bg, I would use it. Any ideas where I could look?

I kind of like the borders only on every-other column. To me, it gives the list structure without boxing it it too much.

I changed the hover color to black.

I THINK I increased the font some. I might throw a bg under there... or maybe a caligraphy line if I can find one.

You didn't sound mean at all btw. :3
 
Mar 22, 2012 9:54 PM

Offline
Joined: Apr 2011
Posts: 1203
http://myanimelist.net/animelist/-Akarin-

spent a lot of time creating this design ^^
 
Mar 23, 2012 5:29 PM

Offline
Joined: Mar 2009
Posts: 2096
@-Akarin-

It looks really cool *___* How long did it take you to code all the pictures? @_@
 
Mar 23, 2012 5:44 PM

Offline
Joined: Apr 2011
Posts: 1203
@Rukayex
Thanks ^^

If you look in "completed" section, you'll see that I've not coded these pictures yet. It will be too long to complete it.. -_-

And as of the whole design, it took 3 days for me to create it.
 
Mar 24, 2012 2:15 AM

Offline
Joined: Oct 2007
Posts: 3411
But that was worth the price you paid for.


"A Legend is but a tale of a beautiful lie."
 
Mar 24, 2012 7:56 PM

Offline
Joined: Apr 2011
Posts: 1203
I gave up manually coding all images and finally wrote the script that automatically generates css file ^^
 
Mar 27, 2012 12:11 PM
Offline
Joined: Jul 2010
Posts: 1453
Hi there guys^^ I've decided to finally change my list design, which I have since January 2011, and I wanted to try out something a bit more complex than I had, adding an image above a part of the list. But unfortunately, I can't seem to get around with it. Here's what I got so far:
#inlineContent
{
display: block !important
background-image: url(insert url here)!important;
background-position: center !important;
background-repeat: no-repeat !important;
position: fixed !important;
top:0px !important;
width:1800px !important;
height:200px !important;
z-index: 50 !important;
}

The problem is the fact that I have no idea what I'm doing wrong since... well, nothing shows up at all, so I must be doing a lot wrong. So I'm here to request your help guys^^ Can anyone tell me how to do this, please?
Modified by hontobaka, Mar 27, 2012 12:20 PM
 
Mar 27, 2012 12:32 PM

Offline
Joined: Mar 2009
Posts: 2096
@Dusk252:

You forgot a ; after display:block!important.
 
Mar 27, 2012 12:51 PM
Offline
Joined: Jul 2010
Posts: 1453
I can't believe that was the problem... I'm totally stupid, I looked at this so many times, checked if the words were well spelled... How the heck did I miss that?

Well, thank you very much anyway^^

Oh, and I have another problem now. The image has a transparent part, but I can't click through. Do you now if it is possible to allow that or not?

Also, one more question if you don't mind: can I add two images instead of just one? If so, how could I do that?
Modified by hontobaka, Mar 27, 2012 12:58 PM
 
Mar 27, 2012 1:38 PM

Offline
Joined: Mar 2009
Posts: 2096
Nope, you can't click through the transparent part. It's like having saran wrap over half your plate of food - you can still see the food but can't touch it where the wrap covers it. XD

Yeah, you can add two images.

background: url(insert link here) fixed bottom left no-repeat, url(insert link here) fixed bottom right no-repeat;

or

background-image: url(insert link here);
background-image: url(insert 2nd link here);
(and all the other attributes, like position and such, spaced out in individual lines as you did)
 
Mar 27, 2012 1:42 PM
Offline
Joined: Jul 2010
Posts: 1453
I see... Then I'll have to change the concept due to that thing issue with the transparency.
Thanks a lot, that was really helpful.
 
Mar 28, 2012 1:00 PM
Offline
Joined: Jul 2010
Posts: 1453
List finally updated! It's a Penguindrum theme this time.


After all it seems you can allow click-through. A bit of research got me to a property I'd never heard about - "pointer-events". By setting its value to "none", click and hover events will go through to the underlaying elements. Of course that means I can click through the whole image rather than simply the transparent part, but it serves my purpose.

Any feedback and/or suggestions for improvement are appreciated!

(I'd also like some suggestions regarding the header titles. I'm actually content with those but "Precious Memories" doesn't exactly fit as, while it has to do with the theme, it's not any kind of actual term used in the anime. I thought about "Hole in the Sky", which is, according to Sanetoshi, the name of the weird library in which Himari was shown her memories, but it's too much of an abstract name to make any kind of sense to someone who hasn't watched the series, and somewhat of an obscure reference even to those who did. But I'm not sure... Should I use it?)
 
Mar 28, 2012 1:18 PM

Offline
Joined: Mar 2009
Posts: 2096
Oh, cool! *___* That click-through ability is a nice discovery. :D I like the design and color scheme too. The header titles are ok to me.

But there is something odd here: The search bar stays fixed, instead of moving as you scroll down. O.o Also, the thing at the bottom (is it Grand Totals?) ... is hidden by the overlay image, so you can't read it well. ^^" http://i.imgur.com/dV890.png
 
Mar 28, 2012 1:38 PM
Offline
Joined: Jul 2010
Posts: 1453
Nice^^ Glad you like it! Thanks a lot for your help earlier too^^

And thanks for mentioning those faults. I hadn't noticed the search thing. It's fixed now. But that other issue strikes me as weired. Not only does it not happen in my browser, but there's a huge amount of content there to be entirely hidden by the overlay image. It's both the Grand Totals and the copyright after that, as you can see here.
Modified by hontobaka, Mar 28, 2012 1:44 PM
 
Mar 28, 2012 2:09 PM
Offline
Joined: Feb 2008
Posts: 669
Mine is finally finished: http://myanimelist.net/animelist/Lirina&status=1&order=0

Need to make a new banner though because I suddenly changed my name ...
 
Mar 30, 2012 1:57 AM

Offline
Joined: Feb 2011
Posts: 282
Updated mine. There's some bit of a problem though. Notice at the right side it only says 'Viewing 's animelist.' I can't seem to get it to display my username. welp

http://myanimelist.net/animelist/wetpantsu
 
Mar 30, 2012 7:11 AM

Offline
Joined: Apr 2011
Posts: 1203
@wetpantsu

It's because of this part

#mal_cs_pic, #mal_cs_listinfo, #mal_cs_listinfo div, #mal_cs_links, #mal_cs_links div, #mal_cs_otherlinks a, #mal_cs_powered img {
display: none !important;
}

replace bold part with something like this:

#mal_cs_otherlinks div:last-of-type a
 
Mar 30, 2012 9:47 AM

Offline
Joined: Feb 2011
Posts: 282
-Akarin- said:
#mal_cs_otherlinks div:last-of-type a
Wow, we could do that? Cool! xD Thanks a lot!
 
Mar 30, 2012 4:46 PM

Offline
Joined: Mar 2010
Posts: 59

Started this design February 3rd,
have been working on it every other week(end) for about two months now.
Modified by Channeru, Mar 30, 2012 4:50 PM
 
Mar 31, 2012 12:48 PM
DB Administrator
~~(8:>

Offline
Joined: Jan 2007
Posts: 12392
Me likey, nice work. Seeing the score somewhere would be cool but it's a nice looking nonetheless.


Open Staff Applications  
Guidelines & FAQ  
Report Abuse
  
[H+] ³
  
 
~~(8:>  Thx Kina.

 
Apr 1, 2012 6:00 PM

Offline
Joined: Apr 2011
Posts: 1203
I'm bored with my previous design and created the new one. Tried to make it minimalistic and beautiful ^^

 
Apr 1, 2012 11:27 PM

Offline
Joined: Nov 2010
Posts: 161
@-Akarin-, gooooooorgeous! Lovely design, I love the smoothly animated buttons, too.
 
Apr 2, 2012 4:04 AM

Offline
Joined: Apr 2011
Posts: 1203
@Nythe, thanks ^^

I think about adding anime thumbnails to list or leaving everything as it is now... Really don't know about this.
Maybe I'll add them, and if they won't look good enough then I'll delete them.
 
Apr 2, 2012 11:03 AM
DB Administrator
~~(8:>

Offline
Joined: Jan 2007
Posts: 12392
-Akarin- said:
I'm bored with my previous design and created the new one. Tried to make it minimalistic and beautiful ^^
Holy crap! Is that one for sale? I'd love to use that one at some point. Feel like I've been using my rather dark one for too long.

[edit]: And I just noticed my list background doesn't work anymore.
Modified by cyruz, Apr 2, 2012 11:07 AM


Open Staff Applications  
Guidelines & FAQ  
Report Abuse
  
[H+] ³
  
 
~~(8:>  Thx Kina.

 
Apr 2, 2012 2:25 PM

Offline
Joined: Mar 2009
Posts: 2096
-Akarin- : It looks cool in Firefox.... but a bit less cool in Chrome xD
screenshot - http://i.imgur.com/N5zEH.png


And....I also updated both lists recently. ^^"
Both of them work best in Chrome (and IE, surprisingly o_o) and Firefox.
Links/screenshots:
 
Apr 2, 2012 2:31 PM

Offline
Joined: Apr 2011
Posts: 1203
@Rukayex
it's an old version, you should just update the cache :)
---

Looks great!
But maybe you should do something with table widths and heights?
http://i.imgur.com/vdS6G.png
 
Apr 2, 2012 2:46 PM

Offline
Joined: Sep 2009
Posts: 1364
-Akarin- said:
I'm bored with my previous design and created the new one. Tried to make it minimalistic and beautiful ^^

Whoa! Such a clean and neat design!

@Rukayex
Lovely <3 Esp the Miku one
 
Apr 2, 2012 2:52 PM

Offline
Joined: Feb 2008
Posts: 6189
Ruka-chan's lists... Best, as usual.
.
 
Apr 2, 2012 5:29 PM

Offline
Joined: Mar 2009
Posts: 2096
Thanks for the comments guys! o/

@-Akarin-: Are you on Mac / using Safari? I heard from someone else that apparently the font gets... very large for some reason. xD Thanks for pointing it out. I will try to fix it soon. @_@
 
Apr 2, 2012 5:35 PM

Offline
Joined: Apr 2011
Posts: 1203
Rukayex said:
@-Akarin-: Are you on Mac / using Safari?

no, I'm using Chrome on win7 :)
Opera shows the same picture as well.

font-family: 'Blue Highway', Helvetica, Arial

I guess it's because not everyone has these fonts except Arial ;)
Modified by Akarin, Apr 2, 2012 5:38 PM
 
Apr 4, 2012 3:11 PM

Offline
Joined: Apr 2011
Posts: 1203
@LIDocain
No, I don't appreciate you using my css...
Why don't you try to make your own design?
 
Apr 5, 2012 11:11 AM

Offline
Joined: Jan 2009
Posts: 338
-Akarin- said:

I guess it's because not everyone has these fonts except Arial ;)

Your title bars look great Akarin

What happens if you use a font someone doesn't have installed?(Using an alternate font as well)
Does it display a default text instead?

Rukayex said:

And....I also updated both lists recently. ^^"

Love the anime list theme,Ruka
Manga Sorted By Theme                         Anime Sorted By Theme
 
Apr 5, 2012 11:24 AM

Offline
Joined: Apr 2011
Posts: 1203
titaniachkt said:

What happens if you use a font someone doesn't have installed?(Using an alternate font as well)
Does it display a default text instead?

thanks ^^.

yes, it'll be changed to default font.
by the way, you can use the @font-face tags in css to allow user download fonts that he hasn't installed.
Modified by Akarin, Apr 5, 2012 11:38 AM
 
Apr 5, 2012 12:07 PM

Offline
Joined: Jan 2009
Posts: 338
Sounds good
Time to learn css it seems
Manga Sorted By Theme                         Anime Sorted By Theme
 
Apr 7, 2012 5:15 AM

Offline
Joined: Mar 2011
Posts: 66
@1NZ3RU: Another great list with images. I always wanted to make one. You took image urls using some script, right?

@-Akarin-: So... clean. I like this paper-like list.

@Rukayex: I love it. Especially anime list.

I'll make a new one too. Somewhen...
 
May 6, 2012 9:07 PM

Offline
Joined: Dec 2009
Posts: 531
Just updated my list. Just stuck with my old style and changed the headers + background =P.
 
May 7, 2012 8:16 PM

Offline
Joined: Mar 2008
Posts: 478
@Davyu: I love your category headers! *_* Amazing job. I think the wallpaper might be a little too busy, but it's a very attractive list overall.
 
May 8, 2012 7:04 PM

Offline
Joined: Dec 2009
Posts: 531
Thanks! =P. Yea I agree, the wallpaper is kinda busy. I was going to go with something more simple, but couldn't find anything =(.
 
May 10, 2012 2:28 AM

Offline
Joined: Mar 2011
Posts: 98
Just made my very first customized list on MAL last week! Always wanted to make one cause I saw lots of amazing ones around x) Might not look as pro as the other's such as cyruz etc ^^'' (cause its my first time) but i tried my best. Planning to change the category images when i find better images. Feel free to give me your opinions!
 
May 10, 2012 3:17 AM

Offline
Joined: Jan 2012
Posts: 618
Some of your lists are absolutely amazing! Good job!

I'm too dumb to do anything fancy so I'm using the boring standard style editor.
Have pretty long tags, so it's easier to keep things simple.
 
May 10, 2012 9:03 AM
Offline
Joined: Mar 2012
Posts: 858
To my list isn't necessary to go. List doesn't deserve it. =P And here can see.


Actually, everything is standard.
In fact, you are updated your lists so beautiful. I don't even know how.
 
May 12, 2012 4:20 AM
Offline
Joined: May 2012
Posts: 3
Hello I was wondering if someone could help me

I've seen loads of amazing animelist and was wondering if there are any pre-made layouts where the header with image covers (currently watching,on-hold,dropped, etc). If not how do I know what sizes I require.


example

http://www.freeimagehosting.net/t2l4h
 
May 12, 2012 12:05 PM

Offline
Joined: Jun 2010
Posts: 121
Allenwalker1 said:
Hello I was wondering if someone could help me

I've seen loads of amazing animelist and was wondering if there are any pre-made layouts where the header with image covers (currently watching,on-hold,dropped, etc). If not how do I know what sizes I require.


example

http://www.freeimagehosting.net/t2l4h


Hey, you can take a look at my list here and I basically did what you're looking to do. I used a sample list layout and created my own headers/pictures for it. It required no CSS/HTML knowledge; I just replaced the original pictures with ones that I wanted in the code.

I have tried in vain to find the original thread here in the MAL forums that had the exact template that I used. But, I came across this one which looks like it has a lot of templates to choose from. I strongly suggest you go through the Rules and Common Links thread to find some good resources.

Best of luck!

Edit: Oh, and when you actually decide on a template. To figure out the exact image dimensions, you'll most likely have to look in the code, once you find an image (usually ends in .jpg or .png), copy that link, paste it into firefox and hit enter. You should now see whatever image that was in the code. Right click -> 'View Image info', this will give you the exact dimensions.
Modified by Emotocon, May 12, 2012 12:09 PM
 
May 13, 2012 10:42 PM

Offline
Joined: Dec 2010
Posts: 2663
Re-did my anime list...

http://myanimelist.net/animelist/DesolateOne

I tried to go for a simple, sleek look.

 
May 14, 2012 9:26 AM

Offline
Joined: Feb 2008
Posts: 6189
DesolateOne said:
Re-did my anime list...

http://myanimelist.net/animelist/DesolateOne

I tried to go for a simple, sleek look.


I like it. Simplicity is the best.
But drop shadow seems cut out on the end. :/
.
 
May 14, 2012 8:07 PM

Offline
Joined: Dec 2010
Posts: 2663
You're right. Gotta fix that. Thanks.

 
May 14, 2012 10:01 PM

Offline
Joined: Feb 2012
Posts: 532
I re-did mine with major help from Shishio's Custom Lists and Profiles (CSS + BBcode help) with Image sharing. It's a public club here on MAL.
I found CSS codes on there that I didn't find after hours of searching on the standard search sites. Oh, and they also have some pre-made layouts for Allenwalker1
To get to my list, check my sig.
 
Pages (112) « First ... « 98 99 [100] 101 102 » ... Last »