-
Notifications
You must be signed in to change notification settings - Fork 2
utilities
fnx|ui comes in with handy utilities you can use.
Typography: http://demo.fnx.io/fnx_ui/css/demo_typography.html
Use classes fs-s
, fs-m
, fs-l
, fs-xl
, etc. to change font-size. Align text (text--center
, text--left
, text--right
) and decorate it (bold
, underline
, italics
, strike
, monospace
).
Padding, margin, border: http://demo.fnx.io/fnx_ui/css/demo_utils.html
Use padding--top
, padding--small--left
, padding--big--bottom
, margin-*
, border--left
, border--vertical
etc to fine tune your UI. "Big" padding (margin) has the same size as the height of an input or a button. See full list of all possibilities.
Shadows: http://demo.fnx.io/fnx_ui/css/demo_shadows.html
Create material-ish depth of your UI with shadow, shadow--big and shadow--huge.
Positioning:
Use class relative
, to give you element relative position. Use class fit
, to give it:
.fit {
position: absolute;
top:0;
left:0;
bottom:0;
right:0;
}
Fit
works nicely with flex--column
, see main content source code here: http://demo.fnx.io/fnx_ui/ng2/#/Cookbook/Table.