search

intel / rib

Rapid Interface Builder (RIB) is a browser-based design tool for quickly prototyping and creating the user interface for web applications. Layout your UI by dropping widgets onto a canvas. Run the UI in an interactive "Preview mode". Export the generated HTML and Javascript. It's that simple!
https://01.org/rib
Apache License 2.0
148 stars 74 forks source link

[UI] Refined the navigator with CSS. #285

Open xuqingkuang opened 12 years ago

xuqingkuang commented 12 years ago

@zhizhangchen After Chrome upgraded, the width computing seems correct.

The css and home icon is updated, it could be in review now.

zhizhangchen commented 12 years ago

In Linux, the font seems a little grey and thin.

xuqingkuang commented 12 years ago

@zhizhangchen The font changed to OpenSans-SB, looks more bold now.

sbryan commented 12 years ago

Why are we changing these so drastically, especially by adding more hard coded sizes (which is causing zoom issues)?

Was there a bug for this?

Also, now the tabs section in the navbar does not align with the initial width of the left panel (contains page picker, outline view and property view), so the initial visual presentation looks odd.

sbryan commented 12 years ago

OK, so I see now that we never replaced the view tab button images with real CSS. Unfortunately, I'm not liking the way it's being done with the hard coded sizes and having to add the text content of the href in the code.

By adding the following to builder.css, you can remove the code changes to main.js:

.layoutViewButton:after { content: "layout"; }
.codeViewButton:after { content: "code"; }
.liveViewButton:after { content: "preview"; }

There are other places where we could be doing things better. I will see if I can make code suggestions.

xuqingkuang commented 12 years ago

@sbryan How about place the text contents in main.js ? it will make RIB internationalize in future more easier.