Show HN: Picnic.css, a lightweight Bootstrap alternative • Hacker News Board

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#111

Post by ldng » Mon, Sep 15, 2014, 9:30 AM UTC

desireco42 wrote: post #100

franciscop wrote: post #2

I've tried to keep it as tiny as possible with just under 3kb when gzipped. What would you change? What would you add? Any feedback or pull request is greatly welcome! MIT Licensed

Here is the thing I would like and maybe I could fork your and just try it and see how it looks. I really like attribute based properties for grid, I think this is great idea. Check it here. I think this could make your framework different from me-too frameworks. I think you could improve on it quite a bit, add optional modules for modal for example, maybe some other elements. http://glenmaddern.com/articles/introduc…

Ok, looks interesting for an organisational stand point but I have my doubts perf-wise. Has it been benchmarked a little ?

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#112

Post by DigitalSea » Mon, Sep 15, 2014, 10:00 AM UTC

illicium wrote: post #107

DigitalSea wrote: post #83

In my opinion, the only great thing about Bootstrap is the grid system and form styling, the rest is just useless cruft. As a front-end developer, I see the value in Bootstrap and I have used it before, but when installing it as a Bower component, it makes it harder to filter out the crap you don't need like button styling, header styling and other stuff Bootstrap includes that just bloats your CSS. To me, I find Boo…

The best thing about Bootstrap is that it's ubiquitous -- every frontender has heard of it and can easily jump on a project that uses it -- and that there are a lot of integrations with frameworks, like angular-bootstrap or react-bootstrap, that don't tie you to using the stock jQuery plugins. This framework doesn't have anything that relies on JS magic, like button dropdowns, collapsing panes, etc, which are useful…

The JS components are a non-issue, I agree. However, the one problem with customising Bootstrap is if you're using a front-end dependency manager like Bower, as far as I am aware, you cannot easily customise the dependencies in Bootstrap if using Bower or Component. Sure, I could use a custom generated and downloaded version of the compiled CSS files, but then I loose the ability to change colours, fonts and whatnot using variables or the internal helper functions...

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#113

Post by uniclaude » Mon, Sep 15, 2014, 10:00 AM UTC

danielnixon wrote: post #108

Lots of accessibility issues here. * Keyboard accessibility is completely busted (other comments have pointed this out). * Color contrast doesn't meet WCAG 2.0 AA (Bootstrap is bad here too). * The should have aria-role="button", tabindex="0" and a bit of JavaScript to trigger a click event when the space or enter keys are pressed while it has focus. This is for keyboard _and_ screen reader accessibility. * The check…

I'm with you on the point that accessibility should be a concern of framework developers, but none of those issues should be too hard to tackle for them. Therefore, filing an issue on the Github project would help (at least, more than commenting here), especially because the project is still young.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#114

Post by duncans » Mon, Sep 15, 2014, 10:06 AM UTC

danielnixon wrote: post #108

Lots of accessibility issues here. * Keyboard accessibility is completely busted (other comments have pointed this out). * Color contrast doesn't meet WCAG 2.0 AA (Bootstrap is bad here too). * The should have aria-role="button", tabindex="0" and a bit of JavaScript to trigger a click event when the space or enter keys are pressed while it has focus. This is for keyboard _and_ screen reader accessibility. * The check…

Have you submitted a pull request? There's plenty of accessibility related-stuff in Bootstrap so I think they care about it.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#115

Post by computerjunkie » Mon, Sep 15, 2014, 11:19 AM UTC

notastartup wrote: post #75

snarkyturtle wrote: post #73

Earlier quoted context omitted.

I think you'd like the bourbon framework, which is basically a way to structure your css and doesn't get in your way. See their grid framework: http://neat.bourbon.io/ and their default style package akin to bootstrap: http://refills.bourbon.io/

I also recommend http://purecss.io/ from Yahoo. I agree that bootstrap is quite heavy and there's a learning curve. I liked purecss because it is simple and does what you set out to do.

Cool. I will have a look at the frameworks suggested. Thanks

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#116

Post by Jgrubb » Mon, Sep 15, 2014, 11:31 AM UTC

cnp wrote: post #42

franciscop wrote: post #2

I've tried to keep it as tiny as possible with just under 3kb when gzipped. What would you change? What would you add? Any feedback or pull request is greatly welcome! MIT Licensed

Small nitpick, but you should conform your html to something more idiomatic; non-idiomatic code just screams isolation and lack of experience and those spaces between your equal signs jump right out and could scare the user off. Its silly I know, but :/

It's not silly, it's the first thing I noticed.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#117

Post by welly » Mon, Sep 15, 2014, 12:25 PM UTC

computerjunkie wrote: post #65

I tried using Bootstrap and other CSS frameworks and (as mentioned in the comments) I felt like I was fighting the frameworks to get it to do what I wanted to do. The problem with CSS frameworks is that they are invasive when it comes to writing semantic HTML. As someone who is working on developing semantic HTML and improving the skill, its annoying when you use a CSS framework which it encourages you to perform inl…

Where's the inline styling used in Semantic UI? I'm looking and looking and see no inline styling in their examples.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#118

Post by mercurial » Mon, Sep 15, 2014, 1:37 PM UTC

exodust wrote: post #96

owenversteeg wrote: post #90

Earlier quoted context omitted.

Whoops. I didn't mean it in a negative way - I was hoping that the creator could mention some other advantages of using Picnic.css that I missed. I've edited the comment to focus less on the downsides of Picnic and instead focus on the differences of Picnic and Min.

You mention IE5.5 support four times on your homepage. Nobody is using IE5.5 anymore, so that's not an attractive selling point, and slightly odd that you think it might be a selling point. The Picnic thing has "subtle animated buttons" which may be appealing to some looking for a certain design edge out of the box. Personally I roll my own everything, I don't use grids or bootstrap, so not sure why I'm even looking…

> I'm not the typical frontend developer though apparently. Div class="row" is not something you'll see in my code, ever. I'm not going back to table layouts by faking rows and columns with divs. That to me is working against the grain of HTML and CSS. When you start working *with" the grain, with the native behaviour of HTML elements, suddenly a lot more is possible and easier to accomplish when it comes to responsiveness and compatibility. But anyway.. carry on with your "not table based" layouts!

Interesting. As somebody who loathes front-end development, I'm curious to know how you work against what I consider to be the shameful lack of support for laying out elements on a page in a coherent way (something which has been present in widget toolkits for fat clients since forever). I still remember with dreads the hacks necessary to achieve a three-columns fluid layout in a cross-browser fashion, and I'm certainly not going back to that.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#119

Post by sequoia » Mon, Sep 15, 2014, 1:47 PM UTC

RegEx wrote: post #92

owenversteeg wrote: post #87

First of all, I want to say that I like the vibrant colors, small size, and checkable buttons. Smaller (and JS-less) CSS frameworks is something that I've been crusading for for years now. Secondly, I'm the creator of Min ( http://minfwk.com ), a fellow small CSS framework. Min is only 995 bytes - 5 times smaller. It also is more widely used, has feature parity with Bootstrap through the Min Bootstrap plugin, support…

This is extremely tacky. Of course you meant to put the framework down - your first statement shows you think this is a competition, and you don't want to "lose" Your edit is just to try and convince others and yourself that you weren't being a complete tool. (You were). It seems you had no other intention in your comment than to belittle the authors work and puff yourself up. If you actually thought you could learn…

Oh go soak your head. Commenter points out what they likes about OP's tool, describes their own, and asks for a sales pitch from OP about why someone should use their (OP's) tool. There's nothing wrong with any of this-- why do you think OP posted their framework here if not to receive feedback & have an opportunity to sell their tool?

People complaining that bringing up an alternate CSS framework for compare/contrast in a thread on a new CSS framework need to chill.

Re: Show HN: Picnic.css, a lightweight Bootstrap alternative

#120

Post by brianzelip » Mon, Sep 15, 2014, 1:49 PM UTC

exodust wrote: post #96

owenversteeg wrote: post #90

Earlier quoted context omitted.

Whoops. I didn't mean it in a negative way - I was hoping that the creator could mention some other advantages of using Picnic.css that I missed. I've edited the comment to focus less on the downsides of Picnic and instead focus on the differences of Picnic and Min.

You mention IE5.5 support four times on your homepage. Nobody is using IE5.5 anymore, so that's not an attractive selling point, and slightly odd that you think it might be a selling point. The Picnic thing has "subtle animated buttons" which may be appealing to some looking for a certain design edge out of the box. Personally I roll my own everything, I don't use grids or bootstrap, so not sure why I'm even looking…

@exodust I'm interested in digging into _with the grain_ web authoring as you say. Checked your profile but didn't find any links. Can you pass some along to share the approach?