Skip to content

Instantly share code, notes, and snippets.

@theo-bittencourt
Created March 7, 2013 16:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save theo-bittencourt/5109339 to your computer and use it in GitHub Desktop.
Save theo-bittencourt/5109339 to your computer and use it in GitHub Desktop.
@mixin selection($selectionColor, $selectionBackground, $selectionShadow: none) {
// defaults to text-shadow: none
::selection {
color: $selectionColor;
background: $selectionBackground;
text-shadow: $selectionShadow; }
::-moz-selection {
color: $selectionColor;
background: $selectionBackground;
text-shadow: $selectionShadow; }
}
@mixin font-smoothing($font-smoothing) {
// none | antialiased | subpixel-antialiased
-webkit-font-smoothing: $font-smoothing;
-moz-font-smoothing: $font-smoothing;
-ms-font-smoothing: $font-smoothing;
font-smoothing: $font-smoothing;
}
@mixin text-transform($text-transform) {
// none | [ [ capitalize | uppercase | lowercase ] || full-width || full-size-kana ]
text-transform: $text-transform;
}
@mixin text-space-collapse($text-space-collapse) {
// collapse | preserve | preserve-breaks
text-space-collapse: $text-space-collapse;
}
@mixin tab-size($tab-size) {
// <integer> | <length>
tab-size: $tab-size;
}
@mixin white-space($white-space) {
// normal | pre | nowrap | pre-wrap | pre-line
white-space: $white-space;
}
@mixin text-wrap($text-wrap) {
// normal | none | avoid
text-wrap: $text-wrap;
}
@mixin line-break($line-break) {
// auto | loose | normal | strict
line-break: $line-break;
}
@mixin word-break($word-break) {
// normal | keep-all | break-all
word-break: $word-break;
}
@mixin hyphens($hyphens) {
// none | manual | auto
-webkit-hyphens: $hyphens;
-moz-hyphens: $hyphens;
-ms-hyphens: $hyphens;
-o-hyphens: $hyphens;
hyphens: $hyphens;
}
@mixin text-wrap($text-wrap) {
// normal | none | avoid
text-wrap: $text-wrap;
}
@mixin overflow-wrap($overflow-wrap) {
// normal | break-word
$word-wrap: $overflow-wrap;
word-wrap: $word-wrap;
overflow-wrap: $overflow-wrap;
}
@mixin white-space($white-space) {
// normal | pre | nowrap | pre-wrap | pre-line
white-space: $white-space;
}
@mixin text-align($text-align) {
// [ [ start | end | left | right | center ] || <string> ] | justify | match-parent | start end
text-align: $text-align;
}
@mixin line-break($line-break) {
// auto | loose | normal | strict
line-break: $line-break;
}
@mixin word-break($word-break) {
// normal | keep-all | break-all
word-break: $word-break;
}
@mixin text-align-last($text-align-last) {
// auto | start | end | left | right | center | justify
text-align-last: $text-align-last;
}
@mixin text-justify($text-justify) {
// auto | none | inter-word | inter-ideograph | inter-cluster | distribute | kashida
text-justify: $text-justify;
}
@mixin hanging-punctuation($hanging-punctuation) {
// none | [ first || [ force-end | allow-end ] || last ]
hanging-punctuation: $hanging-punctuation;
}
@mixin text-decoration-line($text-decoration-line) {
// none | [ underline || overline || line-through ]
text-decoration-line: $text-decoration-line;
}
@mixin text-decoration-color($text-decoration-color) {
// <color>
text-decoration-color: $text-decoration-color;
}
@mixin text-decoration-style($text-decoration-style) {
// solid | double | dotted | dashed | wavy
text-decoration-style: $text-decoration-style;
}
@mixin text-decoration($text-decoration-line,$text-decoration-style,$text-decoration-color,$blink:false) {
@if $blink != false {
text-decoration: $text-decoration-line $text-decoration-style $text-decoration-color blink; }
@else {
text-decoration: $text-decoration-line $text-decoration-style $text-decoration-color; }
}
@mixin text-decoration-skip($text-decoration-skip) {
// none | [ objects || spaces || ink || edges ]
text-decoration-skip: $text-decoration-skip;
}
@mixin text-underline-position($text-underline-position) {
// auto | alphabetic | [ below || [ left | right ] ]
text-underline-position: $text-underline-position;
}
@mixin text-emphasis-style($text-emphasis-style) {
// none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>
text-emphasis-style: $ttext-emphasis-style;
}
@mixin text-emphasis-color($text-emphasis-color) {
// <color>
text-emphasis-color: $text-emphasis-color;
}
@mixin text-emphasis($text-emphasis-style, $text-emphasis-color) {
// ‘<text-emphasis-style>’ || ‘<text-emphasis-color>’
text-emphasis: $text-emphasis-style $text-emphasis-color;
}
@mixin text-emphasis-position($horizontal, $vertical) {
// [ above | below ] && [ right | left ]
$text-emphasis-position: $text-emphasis-position
}
@mixin textProps($text-wrap, $word-wrap, $overflow-wrap) {
text-wrap: $text-wrap;
word-wrap: $word-wrap;
overflow-wrap: $overflow-wrap;
}

To Do:

word-spacing, letter-spacing, text-indent, text-shadow, text-stroke

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment