dope / lemonade Goto Github PK

It would be really nice if this could be installed (and upgraded) as a Bower package. :)

Thanks in advance!

Would you mind adding CDN support? 😀

When I try to use two different elements like this

<div class="frame">
  <header class="bit-2">Should be left</header>
  <main class="bit-2">Should be right</main>
</div>

They get switched the other way because the selector [class*='bit-']:last-of-type matches both of them.

example

Have a nice day

Currently about to start working on version two, If you have any requests/suggestions please let me know below.

Thanks :)

Hello, thanks for making the grid. It looks very good and I'm trying it on a responsive website that I'm making during these days.

I've got a question for you: is it possible to have columns with different sizes on a single row (frame)?

Like this:

[__2x__] [_1x_] [_1x_] [_1x_]

Thanks

Nicholas

Hey, I really love Lemonade, I use is with https://github.com/LukyVj/EfficaCSS, an tod I would love to see a SASS version of it.

I could maybe create it ?

Any reason for:

/* Floats last ".bit-" to the right */
[class*='bit-']:last-of-type {
  float: right;
}

?

It seems like left/centering would be better.

Here's an example: http://jsbin.com/sabuqowota/2/edit?html,css,output

To fix this issue, you can do something like:

@media (min-width: 50em) and (max-width: 68.75em) {
  .bit-4:nth-child(3n) {
    clear: left;
  }
}

@media (min-width: 30em) and (max-width: 50em) {
  .bit-4:nth-child(3n) {
    clear: left;
  }
}

But this would need to be generalized for all the other media-queries and bits.

This may sound silly or too simple but I am confused in calculating the width of a column and its gutter.

Let's say for a 1024, what is the width of the column and its gutter width?

I just used 65px for the column width and 10px for the gutter width. I'll close this issue now.

Hey,

I'm sat here wondering whats next for Lemonade. As it stands it is just a 12 column grid where you can define new columns. Do we need more than that? Do we need an optional stylesheet with a basic reset, styled buttons and typography?

What do you want to see?

Thank you :)

Some of us don't use a preprocessor, so it'd be nice to just grab the unminified lemonade.css file when needed.

output:
lemonade.css
lemonade.min.css

hmm?

Thought I'd open this up for discussion.

Idea: get rid of the frames, convert floats to inline-block. That way you don't need the extra divs for rows, and then you just change the "bit-" style to:

[class*='bit-'] {
display:inline-block;
padding: 5px;
margin-right: -.25em;
vertical-align: top;
}

Seems even simpler and works like a champ for me. Is there any reason not to do this?

*lifting this idea from toast, http://daneden.me/toast/