

Roots – Better CSS - dakrisht
http://roots.cx/axis/

======
ianstormtaylor
To whoever manages this page: please rethink the way you're introducing the
library. I read the first three paragraphs and still had no idea what was
going on. All I learned was that Stylus was involved. Then the next section
talks about when and where to use mixins, and the logic for when to use the
"native form" vs. the "mixin form" seemed weirdly rigid, so I left.

If you want people to use your library, they need to understand it. And if you
want them to understand it, you need to be more compelling. Only after going
back to make sure I'm critiquing you right did I realize this was part of a
bigger toolkit at all.

Oh, and please increase the font size.

~~~
jenius
Hey wow didn't realize this had been posted on hacker news - I'm the author of
roots and here way too late to field comments. Thanks so much for the feedback
Ian! No need to assume such a critical tone, I'm open to any and all feedback,
so let's keep it friendly.

Let me try to explain why I have that intro paragraph there. Stylus is a very
open and flexible language, and the same statement can be written many
different ways. In addition, it's not as commonly used as something like sass,
so there aren't well-known conventions that have arisen. All I was doing here
was trying to establish and explain a couple conventions, to make life easier
and more clear for everyone.

In addition, someone randomly posted the documentation page for the css
library here rather than the homepage. This might be part of the reason why
you were confused about what exactly this is.

Would love to hear more about how I could be 'more compelling' with this -
always a great goal and something I hope I am able to do -- of course keeping
in mind that this is a documentation page.

~~~
mankyd
I'd agree with the OP here. Stylus may be "very open and flexible" but I don't
know what stylus is either. I came to your page because I wanted to find out
about roots, not about stylus.

Open with a statement saying "Roots is a css framework that does X". Maybe
have a follow up statement saying "Roots is based on the stylus language".

~~~
jenius
Note that this is a documentation page for a stylus-based css library, not the
homepage. The homepage is at <http://roots.cx>

~~~
mankyd
Ah! That makes more sense :P

------
ganarajpr
This might just tempt me ( a non css-y person ) to switch over from bootstrap
to this while prototyping or otherwise. It makes things extremely modular
which is what makes sense to a programmer like me.

------
jbm
I used this library for an internal project for my employer after seeing it on
Hacker News

I found it relatively easy to use, but it was a pretty simple thing I was
dealing with (one-page registration scheme). Having Coffeescript built in was
quite nice, since I find it much easier to deal with.

I don't see it as being better than major CMS-style js libraries like Angular
JS (which I started playing with recently), but it was pretty easier to learn
for the toy application I was building. Being able to deploy to Heroku through
the command line is neat, and the auto-reload on changing the HTML was pretty
cool too.

(I'm not in any way affiliated to the person who wrote it, just someone who
used it for a small project.)

~~~
jenius
Hey jbm, author of roots here. Really glad that you ended up using this
(probably quite a few releases ago), and thanks for the feedback! I don't
quite understand what you're getting at here though, because the libraries you
are comparing it with are in no way similar.

AngularJS is a client-side javascript MVC framework and roots/axis are a
static site compiler and a css library, respectively. It's easy to use roots
with a client-side mvc framework if you prefer, I even have built in
precompiled templates to make it easier.

~~~
jbm
Hey, thanks for the framework. I liked Roots.cx, and I found that a lot of the
functionality that I really liked therein. Kudos!

My comment probably needed to be more thoroughly thought out before being
posted.

My main issue with roots (and the reason I probably will not be using it in
the future) is that I need to assume whoever takes over for me in 2 years will
understand how to use Roots (and to make sure it is still updated). I can be
pretty sure that Bootstrap will still be updated and maintained, but I can't
be sure of the same with Roots. It makes it hard to use in a work context for
anything major.

I will take a closer look at Roots and your pre-compiled templates for my
personal projects, thanks for letting me know about it.

~~~
jenius
If it helps, I can assure you personally that it will. Roots is being
aggressively developed right now and is already in use for several high-
visibility projects at the company I work at full time.

If anything, in a couple years roots will have expanded quite a good amount
and, based on my current plans for the future, it will ship with a compiler
that several orders of magnitude faster, be quite a bit more flexible with
more languages and templates, be coupled with an optional cheap and efficient
static hosting service with post-deploy compile hooks, and have a well-
developed dynamic CMS that it can be paired with.

------
brenfrow
Not the best example of good css. The menu covers up the whole screen on my
galaxy s2. Might want to think about responsive design.

~~~
andyhmltn
I'm not sure the page is intended to be responsive (I may be wrong.) It just
looks like they are using fluid widths.

~~~
daemonl
Responsive is one thing, but I can't even zoom in on a mobile...

Dear all web developers, please resize your Web browser to about a mobile
phone width before deploying. Just once. Just to check. Especially if your
page is about a web technology.

------
riquito
I have an hard time with the colors.

input-warning(color = yellow)

Yellow on yellow on my monitor is pretty much impossible to read.

input-success(color = green)

is better but I need to concentrate to read the letters

simple-button

are more similar to tags to me, and the hover effect is not noticeable

Take this as constructive criticism, I just had the time to skim over the
project. I wish you the best luck.

~~~
jenius
Thanks riquito - I'll work on these. They show up very clearly on my screen,
but I totally get that not every screen is mine, I'll try to bump up the
contrast a bit.

For the simple button, I don't disagree, it's more of a base to build on top
of. I am seeing more buttons that looks like the in production these days
though, and the lack of affordance is a little weird to me

------
s0me0ne
Nice stuff, I always wished CSS would have more shorthand codes. Not sure I'll
use it, I worry I'll become too dependent on non-official syntax. Hopefully
the W3C sees this and borrows some ideas.

------
bkad
What's the draw in using this over stylus with nib?

~~~
jenius
It's a much larger and more comprehensive library, most of nib is included in
it, and it's actually developed, maintained, and documented.

------
Dakuan
Oh goodie, another one.

~~~
khet
It's actually really good. You should give it a second look.

