0.0.4 • Published 3 years ago

@watheia/app.ui.layout.align v0.0.4

Weekly downloads
-
License
EPL-2.0
Repository
gitlab
Last release
3 years ago

Align

A set of CSS components to align elements.

text

Same as css property text-align.

import { text } from '@watheia/app.ui.layout.align';
function A() {
	return <div className={text.center}>a</div>;
}

Breakpoints

Align elements according to html breakpoints.

import { text } from '@watheia/app.ui.layout.align';
function B() {
	return <div className={classNames(text.left, text.md.center text.l.left)}>
			b
	</div>
}

Margin center

Same as margin-left: auto; margin-right: auto.

import { marginCenter } from '@watheia/app.ui.layout.align';

function C() {
	return <div className={classNames(marginCenter)}>this is centered</div>;
}

Breakpoints:

  • (default) (all)
  • xs 360px
  • sm 480px
  • md 768px
  • l 920px
  • lg 1080px
  • xl 1440px
0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago