px-box-design

WebJar for px-box-design

License	BSD 3-Clause
GroupId	org.webjars.bowergithub.predixdesignsystem
ArtifactId	px-box-design
Last Version	1.0.0
Release Date	Apr 17, 2018
Type	jar
Description	px-box-design WebJar for px-box-design
Project URL	http://webjars.org
Source Code Management	https://github.com/predixdesignsystem/px-box-design

Download px-box-design

Filename	Size
px-box-design-1.0.0.pom
px-box-design-1.0.0.jar	58 KB
px-box-design-1.0.0-sources.jar	22 bytes
px-box-design-1.0.0-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-box-design/ -->
<dependency>
    <groupId>org.webjars.bowergithub.predixdesignsystem</groupId>
    <artifactId>px-box-design</artifactId>
    <version>1.0.0</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-box-design/
implementation 'org.webjars.bowergithub.predixdesignsystem:px-box-design:1.0.0'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-box-design/
implementation ("org.webjars.bowergithub.predixdesignsystem:px-box-design:1.0.0")

Apache Buildr

'org.webjars.bowergithub.predixdesignsystem:px-box-design:jar:1.0.0'

Apache Ivy

<dependency org="org.webjars.bowergithub.predixdesignsystem" name="px-box-design" rev="1.0.0">
  <artifact name="px-box-design" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.bowergithub.predixdesignsystem', module='px-box-design', version='1.0.0')
)

Scala SBT

libraryDependencies += "org.webjars.bowergithub.predixdesignsystem" % "px-box-design" % "1.0.0"

Leiningen

[org.webjars.bowergithub.predixdesignsystem/px-box-design "1.0.0"]

Dependencies

compile (2)

Group / Artifact	Type	Version
org.webjars.bowergithub.predixdesignsystem : px-clearfix-design	jar	[1.0.0,2)
org.webjars.bowergithub.predixdesignsystem : px-defaults-design	jar	[2.0.0,3)

Project Modules

There are no modules declared in this project.

px-box-design

The pPredix UI Box module simply boxes off content. This module is a fork of the inuitcss Box module.

Dependencies

The px-box-design module depends on one other Px module and one inuitcss module:

• trumps.clearfix
• px-defaults-design

Installation

Install this module and its dependencies using bower:

bower install --save px-box-design

Once installed, @import into your project's Sass file in its Objects layer:

@import "px-box-design/_objects.box.scss";

Usage

These flags are available and, if needed, should be set to true prior to importing the module:

$inuit-enable-box--flush
$inuit-enable-box--tiny
$inuit-enable-box--small
$inuit-enable-box--large
$inuit-enable-box--huge

Options

Basic usage of the Box object uses the required class:

<div class="box">
    Foo Bar Baz
</div>

Other, optional classes can supplement the required base classes. These classes are available if the variable flags listed above are set to true:

• box--flush: remove all padding from boxes.
• box--[tiny|small|large|huge]: alter the padding size on boxes.

For example:

<div class="box box--large">
    Foo Bar Baz
</div>

Please view the full API here

Predix Design System

Versions

Version
1.0.0 Apr 17, 2018