5 ms·
Show HN: Furatto, a flat and sleek CSS framework
- kstaken 13y agoWhat makes this different/better than something like flatstrap?
- kurenn88 13y agoIt 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
- GreyTheory 13y agoIf you look at the git commit history, you'll actually see it is a modified version of flatstrap.
- javiayala 13y agoI love the flat font. I think I could use this framework for a couple of my prototypes.
- wmeredith 13y agoWhat is a "flat font"?
- kurenn88 13y agoI need some feedback on this framework guys!, hope you find it useful!
- javiayala 13y agoI 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 13y agoYeah I'll probably add some, if you have some suggestions, you are more than welcome!
- sidengo-jorge 13y agoGreat job, buddy!
- MWil 13y agothe font looks way too thin to me
- kurenn88 13y agoThe one from the headers right?....yeah it seems the same to me, but I wanted to some else tell me!...thanks!
- mpyne 13y agoYeah, I could barely see the diagonals on the 'w's in the headers.
- javiayala 13y agoI think is good enough. There are a lot of framework with fat fonts. It's kind of refreshing to see something else once in a while.
- brianfryer 13y agoI'm with you on this -- the headings render pretty thin on my tablet: http://imgur.com/FUtdjmD http://imgur.com/FUtdjmD Despite this, I'm totally in love with the framework -- it feels like all the good things of Bootstrap and Foundation all in one. Definitely keeping an eye on this.
- storm_kid 13y agoFuratto=Flat in Japanesse, awesome & clean.
- Ra1d3n 13y agoThe 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 13y agoGood observation, I did not notice that. I'll create the issue at github, thanks a lot I really appreciate it!.
- crazygringo 13y agoMaybe explain why it's a better choice than Bootstrap? It's certainly visually different, but still awfully similar to most end users.
- kurenn88 13y agoYou 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 13y ago> but it have some other features bootstrap does not But what's the differences beyond visual changes (which, frankly, aren't important).
- kurenn88 13y agoI 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 13y agoThey don't make a difference. With bootstrap, it's trivial to change the design.
- rozap 13y agoHonestly I think the biggest problem with Bootstrap is that everyone uses Bootstrap (because it's so nicely done) and therefore your site looks like the other million sites on the web that use it.
- minikomi 13y agoI'm seeing some strange scrolling on iPhone 4S. There's no momentum - it just instantly stops
- bushido 13y agoDid 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 13y agoHey 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! :)
- tmzt 13y agoThe controls on the first form on the Forms tab are not styled.
- kurenn88 13y agoYeah 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...
- hobonumber1 13y agoIt'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)
- ics 13y agoI was just about to link to Pure since it looks almost identical on the surface (and I just tried it out this morning for a prototype). For those wondering, Pure comes in at ~4kb.
- celwell 13y agoooo... pretty; thanks for developing Pure; looks useful.
- kurenn88 13y agoHi 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 13y agoHey 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 { ... }"
- LX-350 13y agoI 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.
- joyeuse6701 13y agolol furatto, how japanese
- dubcanada 13y agoIt 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 13y agoDitto on Chrome (29 dev) on OS X 10.6.8 -- double scrollbars. Yay, yet another fixed-black-top-nav CSS framework! With major bugs!
- Taig 13y agoThere 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 13y agoYeah it is really helpful!...sorry to hear it does not fill your eye...but I'll be working on it to improve it! Thanks!
- abailin 13y agoOne 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 13y agoI'll be adding this kind of features in the near future....I'll keep you posted!
- kurenn88 13y agoHey 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!