OCDE - Pattern Library v1.13.0

Text 

<!-- Default -->



<!-- Bold -->
u-text-bold


<!-- Italic -->
u-text-italic


<!-- Uppercase -->
u-text-uppercase


<!-- Center -->
u-text-center


<!-- Right -->
u-text-right


<!-- Nowrap -->
u-text-nowrap


<!-- Breakword -->
u-text-breakword


<!-- Interactive 1 -->
u-text-interactive1


<!-- Interactive 2 -->
u-text-interactive2


<!-- Title 1 -->
u-text-title1


<!-- Title 2 -->
u-text-title2


<!-- H 1 -->
u-text-h1


<!-- H 2 -->
u-text-h2


<!-- H 2 Compact -->
u-text-h2-compact


<!-- Bodylarge -->
u-text-bodylarge


<!-- Bodylargebold -->
u-text-bodylargebold


<!-- Bodylargecaps -->
u-text-bodylargecaps


<!-- Body -->
u-text-body


<!-- Bodybold -->
u-text-bodybold


<!-- Bodycaps -->
u-text-bodycaps


<!-- Small -->
u-text-small


<!-- Smallbold -->
u-text-smallbold


<!-- Smallcaps -->
u-text-smallcaps


{{#if modifier}} {{modifier}}{{/if}}
 
/* Default: No context defined. */


/* Bold */
{
  "modifier": "u-text-bold"
}


/* Italic */
{
  "modifier": "u-text-italic"
}


/* Uppercase */
{
  "modifier": "u-text-uppercase"
}


/* Center */
{
  "modifier": "u-text-center"
}


/* Right */
{
  "modifier": "u-text-right"
}


/* Nowrap */
{
  "modifier": "u-text-nowrap"
}


/* Breakword */
{
  "modifier": "u-text-breakword"
}


/* Interactive 1 */
{
  "modifier": "u-text-interactive1"
}


/* Interactive 2 */
{
  "modifier": "u-text-interactive2"
}


/* Title 1 */
{
  "modifier": "u-text-title1"
}


/* Title 2 */
{
  "modifier": "u-text-title2"
}


/* H 1 */
{
  "modifier": "u-text-h1"
}


/* H 2 */
{
  "modifier": "u-text-h2"
}


/* H 2 Compact */
{
  "modifier": "u-text-h2-compact"
}


/* Bodylarge */
{
  "modifier": "u-text-bodylarge"
}


/* Bodylargebold */
{
  "modifier": "u-text-bodylargebold"
}


/* Bodylargecaps */
{
  "modifier": "u-text-bodylargecaps"
}


/* Body */
{
  "modifier": "u-text-body"
}


/* Bodybold */
{
  "modifier": "u-text-bodybold"
}


/* Bodycaps */
{
  "modifier": "u-text-bodycaps"
}


/* Small */
{
  "modifier": "u-text-small"
}


/* Smallbold */
{
  "modifier": "u-text-smallbold"
}


/* Smallcaps */
{
  "modifier": "u-text-smallcaps"
}
  • Content: 
    // Autogenerated, DO NOT EDIT
.u-text-title1 { @include textstyle-title1; }
.u-text-title2 { @include textstyle-title2; }
.u-text-h1 { @include textstyle-h1; }
.u-text-h2 { @include textstyle-h2; }
.u-text-h2-compact { @include textstyle-h2-compact; }
.u-text-bodylarge { @include textstyle-bodylarge; }
.u-text-bodylargebold { @include textstyle-bodylargebold; }
.u-text-bodylargecaps { @include textstyle-bodylargecaps; }
.u-text-body { @include textstyle-body; }
.u-text-bodybold { @include textstyle-bodybold; }
.u-text-bodycaps { @include textstyle-bodycaps; }
.u-text-small { @include textstyle-small; }
.u-text-smallbold { @include textstyle-smallbold; }
.u-text-smallcaps { @include textstyle-smallcaps; }
  • URL: /components/raw/u-text/_textstyles.scss
  • Filesystem Path: src/scss/01-utilities/u-text/_textstyles.scss
  • Size: 713 Bytes
  • Content: 
    // Basic Styles

.u-text-bold {
  font-weight: bold;
}

.u-text-italic {
  font-style: italic;
}

.u-text-uppercase {
  text-transform: uppercase;
}

// Alignment

.u-text-center {
  text-align: center;
}

.u-text-right {
  text-align: right;
}

// Whitespace

.u-text-nowrap {
  white-space: nowrap;
}

// Overflow

.u-text-breakword {
  hyphens: auto;
  overflow-wrap: break-word;
  word-wrap: break-word; // IE 11, identical to overflow-wrap
}

.u-text-interactive1 {
  color: $color-interactive1;
}

.u-text-interactive2 {
  color: $color-interactive2;
}

// Textstyles
@import 'textstyles';
  • URL: /components/raw/u-text/_u-text.scss
  • Filesystem Path: src/scss/01-utilities/u-text/_u-text.scss
  • Size: 596 Bytes

No notes defined.