AniDB

http://www.anidb.net/wiki/index.php?tit ... Css_styles

for an overview of current possible styles for anidb.

if you create one yourself and want to share it with other please add an entry and provide an url for dl your css

Rar wrote:If I was going to change markup order, I'd be moving menu and search after the content.

The idea behind tabindex, though, is that you can have the tab order independent of the markup order.

Thus, even if you move the markup around, you could (for example) keep search, login, and the left and right sidebars and the content in the same tab order.

In my opinion, putting search and login before the sidebars and the content makes sense, because they're used very frequently, and unlikely to change size. The left sidebar, by comparison, often has new links added to it, which would change the tab number of the search or login field, were they after it in the tab order.

Rar wrote:Were the 'bangs' bold? I never payed much attention to that corner of the menu, there are currently various issues with it from hurriedly trying to fill in the stuff I forgot.

Here's before and after screenshots: before, as well as being red, they were fatter than they are now. I was hesitant to post just about them, as it's not really very important, and I wasn't sure whether the change was deliberate or not.

One thing that really needs changing is the images used in the relationship graphs ... they need to have transparent backgrounds in order to be able to change the colours used on the site...

Now I believe it's related to these changes (but could be from hosting change also). Notifications are empty (no link), but if you go to the history you see from which anime the notification was.

I just wanted to say good work guys. I really like the blue and its static menu bar. Though it would be nice to have a direct link ot the anime hint, that is the only thing that I still have to go to myplace for...

Thank you for your efforts.

DonGato wrote:Now I believe it's related to these changes (but could be from hosting change also). Notifications are empty (no link), but if you go to the history you see from which anime the notification was.

Are you maybe using some kind of browser/extension/proxy that prefetches links? The notifies <a> now has a URL, not just a javascript, so it may be the case that something is following the link and prefetching it (thereby acknowledging your notify)?

Unrelatedly, if you go to a long nonav page (for example http://anidb.info/perl-bin/animedb.pl?s ... 12&nonav=1) in mozilla 1.7.11, the grey background is only as long as the first screen; if you scroll down, the left-to-right border peeks out from under the grey. The DOM inspector isn't being helpful, but I believe the <div> "layout-content" is not growing properly to enclose the divs it contains.

I don't see this behaviour in IE6, so it might be browser dependent.

Could be that. I'm using single window mode in Firefox and TBE, so popups are opened in a background tab but since 1.5 the popups are shown first as a window and then added to a tab. That could be the problem. Don't remember if that happened with 1.0.7 as well.

Maybe is time to use something not being a popup to show notifications. :/

One thing I only recently discovered is that AniDB.net (with the new CSS layout) isn't friendly to Pocket IE anymore

My knowledge of CSS and related stuff is practically zero so I'm afraid I can't say exactly what is wrong but I can at least describe what I'm seeing...

First of all, the webpage is veeery long: the main page is so long I need 270(!) scroll-downs to reach its end.

What's more, the first thing I see is the upper left part of the main page ("main, mylist, myplace, login etc"), then the upper part of the page (the 3 girls and the search field), then an incredibly looong list of the news (it's so long because there's a line break every 3-4 letters) and finally the anime and group stats. This is regardless of the layout I've selected (one column, default, desktop).

Another issue is that the login/signup/profile/logout buttons are a little garbled in that there is another small text in white with the very same words (login/signup/profile/logout) superimposed over them.

The MyList view works better because it's very much shorter in length. The rest of the issues are also present there though, e.g. the garbled text and the odd order of the various elements of the page.


The AniDB webpage used to work much better for Pocket PC devices before the CSS implementation. I don't know if it can (or you care to) be fixed but I can manage to take some screenshots of my Pocket IE if you'd like.

You say Pocket IE, I say Microsoft Internet Explorer is NOT supported by AniDB! and The page is broken!

edit: the "it's so long because there's a line break every 3-4 letters" part sounds very weird - not even IE should be broken enough for that to happen.

I am sorry to say this, but as we venture further into css based designs and dynamically generated content on the client side, less and less PDA/mobile phone based browsers will be able to correctly display anidb.
They should display something, but it will not look very pretty.

We're generally focusing on supporting the latest versions of Mozilla Firefox and Opera (the desktop versions!). Everything else is not officially supported.

And if there is really demand for a PDA/mobile phone friendly version of anidb, who knows, maybe we will introduce a special, slimmed down interface for that someday. But I don't think many ppl would use it.

BYe!
EXP

http://mini.opera.com/ <- bug reports for that, I don't mind.

Also, turn of css (in profile) if using mobile device, the default design has some odd bits to emulate the old version. As small-screen things have to rewrite the markup somewhat to display the page sensibly, it's better if you don't start from a pixel-based layout like the default. If anyone wants to write a small-screen-limited-css-support skin targetted at this kinda thing, feel free.

Rar

Exp, Rar, thank you for considering this even as a remote possibility...

I've toyed with Minimo (Firefox for PDAs) but it's rather buggy at the current stage of development. Opera I didn't try, I'll give it a shot! Thanks!

(This is of course very low priority... but it's so helpfull! Accessing anidb via PDA or mobile phone is like having your database always with you while at the same time being able to directly manipulate it... it makes trading so much easier! I usually prefer it over the "MyList export" feature) /END of shameless support for the use of PDAs

Is it documented anywhere which parts of the site are CSS-ready and which are not? As far as I can see from the code:

• + navigation menus, login and search: CSS-compliant;
• + show=ep: CSS-compliant;
• + latest additions, latest reviews, calendar: CSS-compliant;
• + genre tree: CSS-compliant;
• ± main page: more or less compliant except for .news;
• ± show=producer: mostly compliant (should use <th> for left column in the main table);
• - show=anime, show=file: presentation markup;
• - category, group, genre, anime, user lists: presentation markup;
• - mylists: presentation markup.

Would be nice to have a page where progress is tracked, so as to know when to start coding CSS.

No, largely because most of the pages are still old-style. We're trying to get organised now to do the rest in a less piecemeal fashion, but it's likely that big scary pages like show=mylist, and probably show=anime, will remain old-style for a while yet.

I could stick something progressy somewhere on the wiki, maybe - I often want feedback/suggestions on the css front, but generally interested parties are not around. Helping people get started doing their own designs might make that side of things easier for me as well.

Rar

Hy!
I finished implementing my own design for AniDB, but there were still things i couldn't find out after looking through the whole css-file. I didn't change the Layout, but instead replaced the pictures from the standard layout.

Here's a preview pic: http://img261.imageshack.us/img261/7972 ... ain6sx.jpg

My questions:
- How can I change the horizontal line in the middle?
- The text in the login-box is grey instead of white (i tried adding color: white in the css). Where exactly can I edit this part?

Thanks in advance!