Layout: Lists/Tabula Rasa

[branchandroot]

Theme name/layout: Lists
Author: Branchandroot
Layout info: layout layer
Image info: No images
Additional info (for layouts): child layout of Tabula Rasa, all columns

Grayscale Light layer | preview

Grayscale Dark layer | preview


This one should be good to go. Tabula Rasa needs to be stripped out of the layout layer, but I think everything else is good. (Except for the part about it winning Most Uninspired Name Ever. But I'm darn proud of that sidebar!)

ETA: Renamed: Librarian's Dream.

Comments

[musyc]

OH WOW. I really, really, really like this one. REALLY LIKE IT. I think I'll be sporting this by the weekend, oh yessssssssss.

[branchandroot]

Thank you! It was a pain in the butt to get the hover to act the same for all the sidebar stuff, but it was worth it.

[musyc]

Seriously, if I had sat myself down and said "okay, self, make a list of all the things you always consistently design in your own layouts", then you would have hit about 90% of them in this design. It's damn near perfect for my uses.

[haikitteh]

I love it. It's so clean and easy to read.

[branchandroot]

Thanks!

[dancing_serpent]

Oh, that one's nice!

[branchandroot]

^_^V It's a bit of a pain in the butt to theme, so I'm kind of happy we have so many theme designers around here! I only got up to two before I gave up.

[musyc]

Yeah, I'll be theming this one a lot. (Seriously, did I mention that I love it?) I've got a wine-purple theme on mine already, and I'm planning greens and blues at minimum. XD

[branchandroot]

Fantastic! I felt a little guilty putting this up with a bare two themes, I have to admit.

[erin_hartley]

Love the wine-purple one a lot!

[dancing_serpent]

*wince* Forgot to log out/into my main account. That was actually me, and of course I couldn't resist creating a theme with my favourite aqua colours already. *g*

[musyc]

:D :D Aquas are always lovely. Is it your "Sea Serpent" colorway? I think your Rose series would look great on this layout, too.

[dancing_serpent]

No, it's the New Ocean I have on my main journal. *g* The Roses might work - will try them out. Sea Serpent has only five different colours - might have to experiment a bit.

[musyc]

I think other than white (well. Just *barely* off-white) and grey, I only used five or six colors in the wines, which I shall have to name once I get to them. (Working on an Elvis-inspired series for Modish). I get a bit twitchy if the shade variations get too widespread. Should hear me sometimes poking themes. ("That color is only used once! For ONE LINE OF TEXT! Whyyyyyyyyyyyy? *makes it match something else*)

[dancing_serpent]

I get a bit twitchy if the shade variations get too widespread.

*g* Same for me!

[dancing_serpent]

Heee...Sea Serpent worked really well for this! *pleased*

[musyc]

Yay! Sea Serpent is one of my favorites of yours so I'm glad it works well for this layout.

[erin_hartley]

Thank you! Take a first look then:

Sea Serpent / Preview

*g*

[branchandroot]

Oh, sweet, that works out really nicely!

[dancing_serpent]

Thank you. *g* If it worked with those colours, some of my others will definitely work, too. Will try them out today...

[musyc]

Oh, yes! That worked great!

And this makes me think it would be nice to have a comm for theme designers to put up examples and get suggestions. dreamscapes tends to be more "here, these are done". I'd like something that's "hey, does this shade of orange work?" or "I've been staring at this so long I can't tell anymore if it's good, halp?".

[branchandroot]

Theoretically, that's what dreamscapes if for too. We do have a "draft" tag. As an embarrassingly-inactive-mod, I'd say, go ahead and throw those entries up here too.

[musyc]

Huh. I never noticed the draft tag. Learn something new! XD (My friends are generally useless for this sort of thing. It's mostly "yes, very nice, Musyc, your enjoyment of layouts is cute" and that's that. Until they break something and need help.)

[dancing_serpent]

Thanks! And yes, as Branch said - this comm is for testing things out, too. I'd love to see your works in progress. *g*

[sergeyr]

It's great, perfect!

I spent the bulk of yesterday trying to pick a layout for my fastidious taste, but those all was faulty for me, and today I planned to learn how to build my own layout... and suddenly found this one at the very first post of this comunity! Unbelievable piece of luck!

Sorry for my lamerism (and my pure English), but how I can set it as my journal style? Is it need to test at first? I can participate at testing, if I can help.

[sergeyr]

Oh my god, I had to say poor, not pure. You see, I'm not a good at English.

[branchandroot]

I'm so glad it will work for you!

Until one of our volunteer coders makes a patch to add this to the site, you'll need to create a custom layer in order to use this layout. This page will tell you what a layer is, and how to create a custom one. Once you have a blank layout layer created (be sure you make it a child of Core 2) you just need to copy the page that's linked to "layout layer" in this entry and paste it into your blank layer. Then you'll be able to select and customize it through the Select Style page, just like any other layout.

If you do run into any bugs once you're using this, please do let me know on this entry.

[sergeyr]

Great, it works, thank you very much!

Now I try to set colors as your Grayscale Light scheme (copying blocks of "set" commands from your example), but I get a compilation error in block with "navigation_link" colors. I move this block after the "propgroup more_colors" block, and it works. Is it ok or I do something wrong from the beginning?

[branchandroot]

That's just how it should work, yes! The "more colors" is full of things that don't exist in the parent layer, so you have to tell the layer they exist before you can set them.

[sergeyr]

Thanx!

[sergeyr]

I have a tiny question about Journal Title - it's not a bug as I understand, but it may confuse some non-English users. The point is that in Russian, for example (and the same for most slavic languages I know), there is no such rule as "all first letters are capital" for a title; thereby Russian title looks like "Мой основной дневник", not as "My Main Journal", for example. And I don't know why, but with your layout, my Russian title look as English title (with all first letters as capitals), while with other layouts it was normal Russin-like title (with the very first capital letter only). I'm not a grammar nazy, but it looks... well, a little non-grammar and weird for our languages.
Is it any way I can modify your layout to fix this for me and my Russian and Ukrainian friends?

[branchandroot]

That's a text transform, in CSS. A lot of themes use it on title for essentially decorative purposes--some use all capitals, for example. To undo that add this to your Custom CSS:

#title, #pagetitle, #subtitle, .entry-title, .module-header, .comment-title, .tags-container h2, #archive-year .month .header h3 { text-transform: none; }

[sergeyr]

Thanx again, it works.
Especially when I guess to insert this line in customize theme form - after several minutes of ineffective efforts to understand what's wrong, when I cram it into my layer "Custom CSS" section and nothing changes... :\

Must say, ad interim, that it's a genuine pleasure to play around with your layout! So much opportunities with colors and module placings - I can't stop and decide wich will be the best...

[ninetydegrees]

So great!

[branchandroot]

Thanks!

[laitaine]

This just beautiful! I love the hover in the sidebar, with that little flash of colour. Great job! ♥

[branchandroot]

Thank you! I got that idea from a Wordpress theme whose name I have never been able to find, and I loved it.

[baggyeyes]

I love it! I wish I could help come up with a name for it, but my brain is fried. All I can get is something like Frame, or shelves, which aren't terribly cool names.

[branchandroot]

*wry* Yeah, I couldn't think of anything even vaguely descriptive that was also catchy. Oh well!

[ninetydegrees]

I'm no good with names but here are some raw thoughts:

Compact,
Neat & Tidy,
Repertory,
Librarian's Dream

Maybe they'll inspire someone to come up with something better.

[branchandroot]

Oh, I like Librarian's Dream! *laughs* I think I'll use that one.

[ninetydegrees]

\o/ I'm glad I could help!

[musyc]

Noticed something on my droll just now that you might want to adjust in the layer. If a user makes an entry that is extremely short (in this case, nothing but a cut), then the link/comment bar gets shifted over to the left instead of remaining beneath the icon. Maybe a min-height on the entry container or a touch more margin on the comment bar? Not sure which would be more effective.

And a little personal niggle that it's entirely possible no one will ever notice but me, but thought it couldn't hurt to mention. The sidebar container and the header block have top edges that aren't precisely aligned. It's literally a single pixel difference, but it stuck out to me. (I adjusted it on my own page because I always display:none the header block in any case.)

[branchandroot]

Ack! I thought I had min-height on that. *goes to fix that* Thank you!

[branchandroot]

*after poking around at the header* It was the "show my actual margins, wretched Firefox" padding pixel! I should be able to fix that with a negative margin on .inner. Thank you, that really shows up with the darker colors, too.

[musyc]

Heh, I'm glad it was something you could find! Things like that really stick out to me, though I know most people won't even notice. Currently I'm trying to get used to the negative space around the skiplinks at the top of my #primary. The module titles and entry titles don't line up at the top of the page and it's TWITCHING me. It's not your design, it's me. I may try to get that top skiplink to go away and only have a bottom set so my title bars will be aligned, but that might be beyond my capabilities. We shall see!

ETA: AHAHAHAHA, someone just asked this very question in style_system, so I am now clear. Properly aligned top edges! The universe is in balance. XD

[denise]

I have to say, this looks particularly beautiful with the sidebar.

[branchandroot]

*grins* The sidebar was a pain in the butt to code, but it was worth it. I really liked how that turned out.

[ninetydegrees]

Looked at the source and I have a few thoughts:

-- I don't think you need to set all the colors to nothing.
-- property use userpics_position; is in TR so you don't need it either.
-- Question about .module-userprofile .userpic img { height: 1.5em; width: 1.5em; } This will distort non-square images? It might be worth implementing a size option for the profile module after all so we can alter images size attributes the way with do it with entries and comments. What do you think?

[branchandroot]

That's a good point about the colors; I usually list them just to remind myself of which ones I'm using, but that doesn't need to be in the layout layer.

Ah, forgot to take out the "use"; this one has been in progress so long, it started out needing the whole function!

Re the image, yes it would distort a non-square. I think a re-size option for the profile module would be very useful. It does seem like something users, as well as designers, might like to be able to change. I know there's a resize in the wizard, but I can't find what it refers to in Core; is that something that could be set with a specific default size?

[owl]

I like the sidebar on this style.

FYI, the journal name in the profile is overflowing the div that it's in. Mine's "only a sinner saved by grace", I think that you're probably allowed ones that are even longer.

[branchandroot]

Oooo, good catch. *prods at that* Okay, I think I know what to do about that. Thanks!

[ex_rising236]

Eee. (Also, I just figured out how to make myself a copy of the layout layer so I could do some themes for it. Eeee so much.)

[branchandroot]

Excellent! This will have a bunch of themes when it goes to press.

[nkfloofiepoof]

I feel dumb. I'm trying to set this up for my personal writing comm since the LJ layout I imported for it is mega messed up. From what I understand, I make a child layer of Tabula Rasa, edit it, and then paste in the layout layer you have linked above, yah? Well, when I hit Save & Compile, I get this error:

Compile error: : Layer is declared layout but expecting a user layer
S2::Checker, S2/Checker.pm, 365
S2::Compiler, S2/Compiler.pm, 34

What am I doing wrong? *derp!*

Also, is there a way to change the default font/font size? Thank you for helping me figure this out~ ♥

[branchandroot]

It will become a child of Tabula Rasa when it's patched, but it shouldn't be yet! Make a layout layer that is a child of Core 2. Paste the entire layout layer code into that (the current layout code includes a /copy/ of Tabula Rasa for Lists to sit on top of). Then make a theme layer that is a child of your very own Lists and paste one of the theme layers' code into that.

Default font size can be changed in the Customize area, though I forget if it's under Text or Presentation.

[nkfloofiepoof]

Yay~ I knew it was just me doing something wrong. Thank you~ ♥

[musyc]

I was poking at this today, playing with some colors, and I found what I think is a problem.

#archive-month .month { background-color: $*color_entry_background; }

#archive-year .month .header h3 { background-color: $*color_entry_title_background;
color: $*color_entry_title;
border-bottom: 1px solid $*color_primary_background;
padding: .20em .25em;
margin: 0; }

Works fine if the color_entry_title and color_entry_background are different, but is unreadable if they're the same (like they are for me). I can kludge it in my already-kludged version of this XD, but I thought I should point it out for patching.

[musyc]

Sorry, poking at it more. It's the 'h3.entry-title a' specifically on the .month page that I'm referring.