

Show HN: Furatto, a flat and sleek CSS framework - kurenn88
http://icalialabs.github.io/furatto/

======
hobonumber1
It's 245kb and over 9000lines of CSS :-/ Is there a reason why it's double the
size of other CSS Frameworks?

Edit: Full disclosure - I develop Pure (purecss.io)

~~~
kurenn88
Hi hobonumber,

First of all I woukd like to say that your framework is one of the ones I like
the most when developing mine...

I know it's a big file but it is because it has a lot of comments, I have to
work on the sass version to change the comments style...the minified version
is close to 133 kb or so...but I definitely have to reduce it and make it
lighter...

Any piece of advice?

~~~
hobonumber1
Hey Kurenn, I would pay close attention to every CSS rule and really think
about if it's needed or not. Also, try to follow some CSS principle such as
OOCSS or SMACSS so that you reduce selector bloat.

ie: ".tabbar-inner { ... }" is better than ".tabbar .inner { ... }"

------
crazygringo
Maybe explain why it's a better choice than Bootstrap? It's certainly visually
different, but still awfully similar to most end users.

~~~
kurenn88
You got that right....it uses the same format for naming the classes but it
have some other features bootstrap does not.. I just think to choose a
framework you have to see if the class names make sense...how easy is to adapt
and change...to fill your needs...just my humble opinion...

I'll continue working to give a better api and built more useful addons

Cheers!

~~~
jasonlotito
> but it have some other features bootstrap does not

But what's the differences beyond visual changes (which, frankly, aren't
important).

~~~
kurenn88
I think the visual elements do make a difference but taking that out...it has
probably not much differences with bootstrap...I'll be working to make it more
semantic, lightweight...and that should give a better development
experience...

You have any suggestions?

~~~
jasonlotito
They don't make a difference. With bootstrap, it's trivial to change the
design.

------
kurenn88
I need some feedback on this framework guys!, hope you find it useful!

~~~
javiayala
I don't know if it's part of your philosophy but I think that adding more
javascript tricks and libraries could add some value to your framework. Good
job though.

~~~
kurenn88
Yeah I'll probably add some, if you have some suggestions, you are more than
welcome!

------
dubcanada
It looks pretty nice, and has some nice JS but... On Chrome (latest) Windows,
I have double scrollbars.

And if I may nitpick a few things...

1\. The pagination #'s are offcenter. 2\. The titles (Navbar, Pagination, etc
are almost invisible on my screen)

~~~
jibberia
Ditto on Chrome (29 dev) on OS X 10.6.8 -- double scrollbars.

Yay, yet another fixed-black-top-nav CSS framework! With major bugs!

------
bushido
Did a quick browse through the code. A couple of things jumped out:

1\. A number of CSS classes have 'furatto' as a prefix ex. '.furrato-block'.
This seems a bit counter-productive as the word itself does not add any value
to meaning of the class names.

2\. I notice that for the responsive design the class is '.row-fluid', but
since responsive is now a norm it may make sense to have '.row' be
fluid/default and have a '.row-fixed' class for the few that may want a fixed
only.

3\. I like the font, it works well, but for the navbar links its a little
tough to read. Also the '.motto' class is almost impossible to read, though
changing the font color for the class should suffice.

4\. I really like the circular images and the inclusion of date picker and
toolbars js.

I will definitely try it out and watch it on github.

p.s. you may want to look into the double right scrollbar that is on the
github.io pages.

~~~
kurenn88
Hey thanks a lot for the feedback!!...it's really great!...I totally agree
with on the row-fluid class name I'll updated that. I want to make a more
semantic class names to give more meaning to the markup.... I'll consider the
font on the navbar...probably just reduce the font weight would do the
trick....

Thanks again for the feedback. I'll be working on it! :)

------
Taig
There are a few issues that made me close the web site after a few seconds.
I'm usually very excited about frontend frameworks and add them right to my
bookmarks; not in this case though.

\- The Furatto title on the start page is way too close to the top navigation.
\- That thin font in the navigation & title renders pretty ugly on my
MBA/Chrome. \- When I clicked the first navigation button seeing the text move
down vertically because of the top border I closed the tab.

I'm sorry I can only give negative feedback but it may be useful in some way..

~~~
kurenn88
Yeah it is really helpful!...sorry to hear it does not fill your eye...but
I'll be working on it to improve it!

Thanks!

------
storm_kid
Furatto=Flat in Japanesse, awesome & clean.

------
Ra1d3n
The toolbars popup has a fixed position, so if you open a "toolbar" and then
scroll with it still open it just hovers in the middle of the screen like
this: [http://i.imgur.com/vdoHhMr.png](http://i.imgur.com/vdoHhMr.png)

~~~
kurenn88
Good observation, I did not notice that. I'll create the issue at github,
thanks a lot I really appreciate it!.

------
kurenn88
Hey guys I just released the rails gem for those ruby devs
[https://github.com/IcaliaLabs/furatto-
rails](https://github.com/IcaliaLabs/furatto-rails) try it out!...I need to
add some more doc! enjoy!

------
javiayala
I love the flat font. I think I could use this framework for a couple of my
prototypes.

~~~
wmeredith
What is a "flat font"?

------
abailin
One thing that will prevent people from switching to this (from Bootstrap, or
similar) is the lack of navbar search form. Besides that, very beautiful. The
tag edit is a nice addition to most front-end frameworks.

~~~
kurenn88
I'll be adding this kind of features in the near future....I'll keep you
posted!

------
LX-350
I noticed that Furatto uses Normalize, can I use this framework with the
legacy version of Normalize? I am stuck working on intranet apps and need to
support IE 7/8.

~~~
kurenn88
You should be fine yeah!

~~~
LX-350
Awesome!:) I'll definitely play around with furrato and keep an eye on its
progress.

------
minikomi
I'm seeing some strange scrolling on iPhone 4S. There's no momentum - it just
instantly stops

~~~
kurenn88
I'll create the issue on github...yeah some else just notice a double
scrollbar....it is probably related!.....thanks for the feedback!

~~~
tomwilson
Same problem on my iPad.

~~~
kurenn88
Got it! :)

------
kstaken
What makes this different/better than something like flatstrap?

~~~
kurenn88
It is just another option for a framework...it included some cool features
that flatstrap does not probably the checkbox and radios buttons are the best
example...

Also it was a challenge I put on myself and built better css

------
tmzt
The controls on the first form on the Forms tab are not styled.

~~~
kurenn88
Yeah I just wanted to point out the native elements when you just want to use
the default ones. But it is probably not clear enough...

------
MWil
the font looks way too thin to me

~~~
kurenn88
The one from the headers right?....yeah it seems the same to me, but I wanted
to some else tell me!...thanks!

~~~
mpyne
Yeah, I could barely see the diagonals on the 'w's in the headers.

------
joyeuse6701
lol furatto, how japanese

