diff --git a/assets/sass/lib/typey/stylesheets/_typey.scss b/assets/sass/lib/typey/stylesheets/_typey.scss deleted file mode 100644 index 72d48f3..0000000 --- a/assets/sass/lib/typey/stylesheets/_typey.scss +++ /dev/null @@ -1,17 +0,0 @@ -@import "typey/functions/helpers"; -@import "typey/functions/validators"; -@import "typey/functions/em-calculators"; -@import "typey/functions/outputters"; -@import "typey/functions/sizers"; -@import "typey/functions/extras"; -@import "typey/functions/depreciated"; -@import "typey/font-stacks"; -@import "typey/defaults"; -@import "typey/mixins/debug"; -@import "typey/mixins/define-type-sizing"; -@import "typey/mixins/font-size"; -@import "typey/mixins/line-height"; -@import "typey/mixins/spacing"; -@import "typey/mixins/typeface"; -@import "typey/mixins/typeset"; -@import "typey/mixins/type-layout"; diff --git a/assets/sass/lib/typey/stylesheets/typey/_defaults.scss b/assets/sass/lib/typey/stylesheets/typey/_defaults.scss deleted file mode 100644 index 29b9728..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/_defaults.scss +++ /dev/null @@ -1,181 +0,0 @@ -// The browser font size default. No need to change this. -// Allowed units: px -$browser-font-size: 16px !default; - -// Allowed units: rem, em or px -$base-unit: rem !default; - -// The base font size will be used for most calculations involving font-size. -// Allowed units: px -$base-font-size: 16px !default; - -// The base line height will be used for most calculations involving height. -// Allowed units: px -$base-line-height: 24px !default; - -// The method to calculate line-height. Allowed values: rhythm or ratio. -// Rhytm uses a vertical rhythm approach where line-height is specified as -// a multiple of the $base-line-height. -// Ratio uses a ratio approach where line-height is specified as a ratio -// of the elements font-size. -$line-height-method: rhythm !default; - -// The default ratio of line-height to font-size. -$base-line-height-ratio: 1.5 !default; - -// By default we will provide fallbacks when rem is the base unit. -$rem-fallback: true !default; - -// By default, when rem or em are the base unit we will output a print suitable -// media query with the define-type-sizing() mixin. This will take care of all -// print media type sizing effortlessly. -$auto-print-sizing: true !default; - -// The pt font-size to be used with the print media query when -// $auto-print-sizing is enabled. -// Allowed units: pt -$print-font-size: 12pt !default; - -// Default font sizes -// Once you redefine the $font-size map it will overwrite all sizes here. -// Allowed units: px -$font-size: ( - xxxl: 60px, - xxl: 46px, - xl: 32px, - l: 24px, - m: 16px, - s: 14px, - xs: 12px -) !default; - -// Default font weights -// This map and accompanying function help provide granular control over -// setting and retrieving static font weights. -$font-weight: ( - bold: 700, - normal: 400, - lighter: 200 -) !default; - -// Declare typefaces -// These can use any key you like, and allow you to set global letter-spacing, -// weight and case for font-families. You can then use the -// font-family mixin to embed your font families anywhere you like. -// -// Each key in the $typefaces map can either be a keyed map of settings -// using any combination of the keys below, or it can be a shorthand list -// of each property value. When using shorthand it doesn't matter what order -// each value is arranged in, but best practice is to do it in the order: -// [font-family] [letter-spacing] [weight] [case] -// -// @setting list font-family -// Any standard CSS font-family. Use typey pre-written stacks or roll your own. -// @setting number letter-spacing -// CSS letter-spacing. Specified as a px value when font-size is the -// $base-font-size. -// @setting string weight -// A key from the $font-weight map. Only specify this if you want a consistant -// font-weight used accross the board with this typeface. -// @setting string case -// A value for CSS text-transform. Only specify this if you want a consistant -// case used accross the board with this typeface. -$typefaces: () !default; - -// Declare typestyles -// These can use any key you like, and allow you to set an easily reusable type -// style. They can be as simple as a font-size and line-height, or can go on -// to encompass a full range of css type properties. -// -// Each key in the $typestyles map can either be a keyed map of settings -// using any combination of the keys below, or it can be a shorthand list -// of each property value. When using shorthand for $typestyles, the first value -// must always be font-size. After that it doesn't matter what order each value -// is arranged in, but best practice is to do it in the order: -// [font-size] [line-height] [weight] [case] -// -// @setting number|string font-size -// A size from the $font-size map or px value to be converted -// @setting number $x line-height -// Multiple of line height, ratio or px value to be converted. -// @setting string weight -// A key from the $font-weight map. -// @setting string case -// A value for CSS text-transform. -$typestyles: () !default; - -// Debug grid -// Shows horizontal lines for each elements line height. -$typey-debug: false !default; - -// Debug grid coloring -$typey-debug-color: #4affff !default; - -// Lets store the allowed values for text-transform and font-style so we can -// make shorthand work a little better. -$text-transform-values: ( - lowercase, - uppercase, - capitalize -) !default; - -$font-style-values: ( - normal, - italic, - oblique -) !default; - -// Warnings for $base-unit. -@if $base-unit != px and $base-unit != rem and $base-unit != em { - @error "$base-unit must be one of the following unit types: rem, em or px"; -} - -// Warnings for $base-font-size and $base-line-height. -@if unit($base-font-size) != px { - @error "$base-font-size must be in px"; -} -@if unit($base-line-height) != px { - @error "$base-line-height must be in px"; -} - -// Warnings for $print-font-size. -@if unit($print-font-size) != pt { - @error "$print-font-size must be in pt"; -} - -// Warnings for $font-size. -@each $key, $size in $font-size { - @if unit($size) != px { - @error "Size '#{$key}' in $font-size map is not specified in px"; - } -} - -// Warnings for $font-weight. -$typey-text-transform-properties: none capitalize uppercase lowercase initial inherit; -@each $property in $typey-text-transform-properties { - @if map-has-key($font-weight, $property) { - @warn "'#{$property}' used in $font-weight map is a potential value of the text-transform property and will conflict when using typey shorthand"; - } -} - -// Warnings for $typefaces. -@each $key, $typeface in $typefaces { - @if type-of($typeface) != "map" and type-of($typeface) != "list" { - @error "Typeface '#{$key}' in $typefaces map must be a keyed map or a shorthand list in the format: [font-family] [letter-spacing] [weight] [case]"; - } -} - -// Warnings for $typestyles. -@each $key, $typestyle in $typestyles { - @if type-of($typestyle) == "list" { - @each $value in $typestyle { - @if index($typestyle, $value) == 1 { - $allowed-types: "font-size", "px"; - $type: typey-check-value($value); - @if index($allowed-types, $type) == null { - @error "Incorrect shorthand format used in '#{$key}' in $typestyles map: [font-size] must appear first"; - } - } - } - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/_font-stacks.scss b/assets/sass/lib/typey/stylesheets/typey/_font-stacks.scss deleted file mode 100644 index a6a86cd..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/_font-stacks.scss +++ /dev/null @@ -1,4 +0,0 @@ -// Three standard do-all stacks. -$serif-stack: "Calisto MT", "Book Antiqua", serif !default; -$sans-serif-stack: "Helvetica Neue", Helvetica, sans-serif !default; -$monospace-stack: Consolas, "Lucida Console", monospace, monospace !default; diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_depreciated.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_depreciated.scss deleted file mode 100644 index 45d6abc..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_depreciated.scss +++ /dev/null @@ -1,55 +0,0 @@ -// DEPRECIATED FUNCTIONS -// The names of these functions have been refined and namespaced (above) to avoid -// potential confusion with functions from other libraries. - -// (Depreciated) Output a number in the $base-unit.. -// -// @param string $weight -// A weight from the $font-weight map. -// -// @return string -// The selected font-weight. -@function output-unit($number) { - @warn "output-unit() is depreciated. Please use typey-output-in-base-unit() instead"; - @return typey-output-in-base-unit($number); -} - -// (Depreciated) Remove the unit from a number. -// -// @param number $number -// The number (with unit) to convert. Allowed units: any -// -// @return number -// The number without the unit. -@function strip-unit($number) { - @warn "strip-unit() is depreciated. Please use typey-strip-unit() instead"; - @return typey-strip-unit($number); -} - -// (Depreciated) Convert px to the $base-unit. -// -// @param number $number -// The number (with unit) to convert. Allowed units: px -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The number converted to the base unit. -@function convert-unit($number, $context: $base-font-size) { - @warn "convert-unit() is depreciated. Please use output-from-px() instead"; - @return output-from-px($number, $context); -} - -// (Depreciated) Retrieve a font weight. -// -// @param string $weight -// A weight from the $font-weight map. -// -// @return string -// The selected font-weight. -@function font-weight($weight) { - @warn "font-weight() is depreciated. Please use weight() instead"; - @return weight($weight); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_em-calculators.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_em-calculators.scss deleted file mode 100644 index f46b026..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_em-calculators.scss +++ /dev/null @@ -1,41 +0,0 @@ -// Calculate relative sizing for em when a px value is used. -// -// @param number $number -// The px value -// @param number|string $context -// The relative value to perform the calculation. -// -// @return number -// The calculated value in the base unit. -@function calculate-em-px($x, $context) { - $allowed-types: "font-size", "px"; - $type: typey-validator($context, $allowed-types); - @if $type == "font-size" { - $context-map-size: map-get($font-size, $context); - @return typey-output-in-unit(($x / $context-map-size), em); - } - @if $type == "px" { - @return typey-output-in-unit(($x / $context), em); - } -} - -// Calculate relative sizing for em when a multiplier is used. -// -// @param number $number -// Multiple of line height to be used. -// @param number|string $context -// The relative value to perform the calculation. -// -// @return number -// The calculated value in the base unit. -@function calculate-em-multiplier($x, $context) { - $allowed-types: "font-size", "px"; - $type: typey-validator($context, $allowed-types); - @if $type == "font-size" { - $context-map-size: map-get($font-size, $context); - @return typey-output-in-unit(($x * $base-line-height) / $context-map-size, em); - } - @if $type == "px" { - @return typey-output-in-unit(($x * $base-line-height) / $context, em); - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_extras.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_extras.scss deleted file mode 100644 index 1ade7f7..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_extras.scss +++ /dev/null @@ -1,34 +0,0 @@ -// Retrieve a font weight. -// -// @param string $weight -// A weight from the $font-weight map. -// -// @return string -// The selected font-weight. -@function weight($weight) { - @if type-of($weight) == "string" { - @if map-has-key($font-weight, $weight) { - @return map-get($font-weight, $weight); - } - @else { - @error "'#{$weight}' not found in $font-weight map"; - } - } - @else { - @error "Weight specified for weight() is not a string"; - } -} - -// Extend a font by adding a web-safe stack to it. -// -// Example usage: -// $new-font-stack: extend-font-stack("Open sans", $sans-serif-stack); -// -// @param string $font -// The name of the font. Use inverted commas if there are spaces in the font -// name. i.e "Open sans" -// @param list $font-stack -// The font stack variable to extend. -@function extend-font-stack($font, $font-stack) { - @return join($font, $font-stack, $separator: comma); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_helpers.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_helpers.scss deleted file mode 100644 index 7c753ff..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_helpers.scss +++ /dev/null @@ -1,59 +0,0 @@ -// Output a number in the $base-unit. -// -// @param number $number -// The number (without unit) to output. -// -// @return number -// The number with the base unit -@function typey-output-in-base-unit($number) { - @if $number == 0 { - @return 0; - } - @if $base-unit == rem { - @return $number * 1rem; - } - @if $base-unit == px { - @return $number * 1px; - } - @if $base-unit == em { - @return $number * 1em; - } -} - -// Output a number in a chosen unit. -// -// @param number $number -// The number (without unit) to output. -// @param string $unit -// (optional) The unit to output, either em, px or rem. -// -// @return number -// The number with the base unit -@function typey-output-in-unit($number, $unit: $base-unit) { - @if $number == 0 { - @return 0; - } - @if $unit == rem { - @return $number * 1rem; - } - @if $unit == px { - @return $number * 1px; - } - @if $unit == em { - @return $number * 1em; - } -} - -// Remove the unit from a number. -// -// @param number $number -// The number (with unit) to convert. Allowed units: any -// -// @return number -// The number without the unit. -@function typey-strip-unit($number) { - @if type-of($number) == "number" and not unitless($number) { - @return $number / ($number * 0 + 1); - } - @return $number; -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_outputters.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_outputters.scss deleted file mode 100644 index aa19e98..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_outputters.scss +++ /dev/null @@ -1,83 +0,0 @@ -// Take a px value and output converted value. -// -// @param number $number -// A px value to convert. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The number converted to the base unit. -@function output-from-px($number, $context: $base-font-size) { - @if $base-unit == rem { - @return typey-output-in-base-unit(($number / $base-font-size)); - } - @if $base-unit == px { - @return typey-output-in-base-unit(typey-strip-unit($number)); - } - @if $base-unit == em { - @return calculate-em-px($number, $context); - } -} - -// Take a key from the $font-size map and output converted value. -// -// @param string $size -// A size from the $font-size map. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the parent -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The selected font-size in $base-unit. -@function output-from-font-size-map($size, $context: $base-font-size) { - $map-size: map-get($font-size, $size); - @if $base-unit == rem { - @return typey-output-in-base-unit(($map-size / $base-font-size)); - } - @if $base-unit == px { - @return typey-output-in-base-unit(typey-strip-unit($map-size)); - } - @if $base-unit == em { - @return calculate-em-px($map-size, $context); - } -} - -// Take a line-height multipler and output converted value. -// -// @param number $number -// Multiple of line height to be used. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The value of the line-height multiple converted to the base unit. -@function output-from-multiplier($x, $context: $base-font-size) { - @if $base-unit == rem { - @return typey-output-in-base-unit(($x * $base-line-height) / $base-font-size); - } - @if $base-unit == px { - @return typey-output-in-base-unit(typey-strip-unit($x * $base-line-height)); - } - @if $base-unit == em { - @return calculate-em-multiplier($x, $context); - } -} - -// Take a line-height ratio and output as em. -// -// @param number $ratio -// Multiple of the $font-size to be used. -// @param number|string $context -// (optional) used to ensure function outputs the ratio regardless of whether -// it is the same as the $base-line-height-ratio. -// -// @return number -// The ratio in em. -@function output-from-ratio($ratio: $base-line-height-ratio) { - @return $ratio; -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_sizers.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_sizers.scss deleted file mode 100644 index 75a84b5..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_sizers.scss +++ /dev/null @@ -1,91 +0,0 @@ -// Takes a sizing from the $font-size map (m, xl, xxl, etc) and convert it to -// the base unit. Alternatively convert a px font-size into the base unit. -// -// @param number|string $size -// A size from the $font-size map or px value to be converted -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the parent -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The selected font-size in $base-unit. -@function font-size($size, $context: $base-font-size) { - $allowed-types: "font-size", "px"; - $type: typey-validator($size, $allowed-types); - @if $type == "font-size" { - @return output-from-font-size-map($size, $context); - } - @if $type == "px" { - @return output-from-px($size, $context); - } -} - -// Generate a value to be used as line-height from either: -// a) a multiple of $base-line-height -// b) a static px value -// c) a ratio of the font-size -// -// Example usage with multiple: -// line-height: line-height(2); -// Example usage with static value: -// line-height: line-height(18px); -// Example usage with ratio: -// line-height: line-height(1.5); -// -// @param number $x -// Multiple of $base-line-height to be used, px value to be converted, or ratio of -// font-size. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the -// elements/parents font-size if it differs from $base-font-size. -// Specified as a t-shirt size or value in px. -// @return number -// The calculated height in $base-unit. -@function line-height($x, $context: $base-font-size) { - $allowed-types: "multiplier", "px"; - $type: typey-validator($x, $allowed-types); - @if $type == "multiplier" { - @if ($line-height-method == "ratio") { - @return output-from-ratio($x); - } - @else { - @return output-from-multiplier($x, $context); - } - } - @if $type == "px" { - @return output-from-px($x, $context); - } -} - -// Generate a value to be used as some form of height or spacing from either: -// a) a multiple of $base-line-height -// b) a static px value -// -// Example usage with multiple: -// height: spacing(2); -// Example usage with static value: -// margin-bottom: spacing(18px); -// -// @param number $x -// Multiple of $base-line-height to be used or px value to be converted. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -// -// @return number -// The calculated spacing in $base-unit. -@function spacing($x, $context: $base-font-size) { - $allowed-types: "multiplier", "px", "auto"; - $type: typey-validator($x, $allowed-types); - @if $type == "multiplier" { - @return output-from-multiplier($x, $context); - } - @if $type == "px" { - @return output-from-px($x, $context); - } - @if $type == "auto" { - @return auto; - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/functions/_validators.scss b/assets/sass/lib/typey/stylesheets/typey/functions/_validators.scss deleted file mode 100644 index a7b84cd..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/functions/_validators.scss +++ /dev/null @@ -1,82 +0,0 @@ -// Takes a value and checks to ensure it's expressed correctly then returns -// the type. -// -// @param number|string|list $x -// A multiple of $base-line-height. -// A px value. -// A size from the $font-size map. -// A space seperated list container multiples and/or px values. -// -// @return string -// multiplier, px, font-size, list -@function typey-check-value($x) { - @if type-of($x) == "number" { - @if unitless($x) { - @return "multiplier"; - } - @if not unitless($x) { - @if unit($x) == px { - @return "px"; - } - @else { - @error "All units must be expressed in px"; - } - } - } - @if type-of($x) == "string" { - @if $x == "auto" { - @return "auto"; - } - @if map-has-key($font-size, $x) { - @return "font-size"; - } - @else { - @error "'#{$x}' not found in $font-size map"; - } - } - @if type-of($x) == "list" { - @if list-separator($x) == space { - @each $value in $x { - @if type-of($value) == "number" or $value == "auto" { - @if type-of($value) == "number" { - @if not unitless($value) and unit($value) != px { - @error "All units must be expressed in px"; - } - } - } - @else { - @error "Values specified inside lists must be a number or 'auto'"; - } - } - @return "list"; - } - @else { - @error "All lists must use a space as their seperator"; - } - } - @else { - @return type-of($x); - } -} - -// Takes a value and validates it against a specified type. -// -// @param number|string|list $x -// A multiple of $base-line-height. -// A px value. -// A size from the $font-size map. -// A space seperated list container multiples and/or px values. -// @param string|list $allowed-types -// Either multiplier, px, font-size, list, or a comibation specified in a list. -// -// @return string -// The values type. -@function typey-validator($x, $allowed-types) { - $type: typey-check-value($x); - @if index($allowed-types, $type) != null { - @return $type; - } - @else { - @error "'#{$type}' is not a valid type for this function (allowed types are: #{$allowed-types})"; - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_debug.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_debug.scss deleted file mode 100644 index 5b4c9ad..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_debug.scss +++ /dev/null @@ -1,41 +0,0 @@ -// Output a horizontal grid to help with debugging typography. -// -// @param number $line-height -// Multiple of line height to be used, line-height ratio or px value to be converted. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the -// elements/parents font-size if it differs from $base-font-size. -// Specified as a t-shirt size or value in px. -// @param string $color -// (optional) Use a custom grid color. -@mixin typey-debug-grid($line-height: $base-line-height, $context: $base-font-size, $color: $typey-debug-color) { - @if $typey-debug == true { - $allowed-types: "multiplier", "px"; - $type: typey-validator($line-height, $allowed-types); - $grid-height: 0; - @if $line-height-method == "rhythm" { - $grid-height: line-height($line-height, $context); - } - @if $line-height-method == "ratio" { - @if $line-height == $base-line-height { - $grid-height: line-height($base-line-height-ratio, $context) * 1em; - } - @else { - $grid-height: line-height($line-height, $context) * 1em; - } - } - - position: relative; - background-image: repeating-linear-gradient(180deg, $color, $color 1px, transparent 1px, transparent $grid-height); - - &:after { - content: ""; - position: absolute; - bottom: -1px; - left: 0; - height: 1px; - width: 100%; - background-color: $color; - } - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_define-type-sizing.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_define-type-sizing.scss deleted file mode 100644 index d444d03..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_define-type-sizing.scss +++ /dev/null @@ -1,45 +0,0 @@ -// Define defaults (use this in the HTML element). -// -// @param number $size -// (optional) The font-size. Use to set to anything other than $base-font-size. -// @param number $line-height -// (optional) The line-height. Use to set to anything other than $base-line-height. -// Set to a ratio when $line-height-as-ratio is true. Will default to $base-line-height-ratio. -// Set to false if you do not want to change a ratio of line-height already set. -@mixin define-type-sizing($size: $base-font-size, $line-height: $base-line-height) { - @if $base-unit == rem or $base-unit == em { - font-size: $size / $browser-font-size * 100%; - } - @if $base-unit == px { - font-size: $size; - } - - @if $line-height != false { - @if $line-height-method == "ratio" { - @if $line-height == $base-line-height { - $line-height: $base-line-height-ratio; - } - line-height: $line-height; - } - @else { - @if $base-unit == rem or $base-unit == em { - // In the html element, rem means relative to browser default font size; em means relative to html's font size. - line-height: calculate-em-px($line-height, $size); - } - @if $base-unit == px { - line-height: $line-height; - } - } - } - - @if $auto-print-sizing == true { - @if $base-unit == rem or $base-unit == em { - @media print { - font-size: $print-font-size; - } - } - @else { - @warn "As you are not using a relative base unit (rem or em) automatic print media sizing will not work. Set $auto-print-sizing to false to hide this warning" - } - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_font-size.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_font-size.scss deleted file mode 100644 index 06d0325..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_font-size.scss +++ /dev/null @@ -1,24 +0,0 @@ -// Define font-size (with fallback) -// -// @param number|string $size -// A size from the $font-size map or px value to be converted -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -@mixin font-size($size, $context: $base-font-size) { - $allowed-types: "font-size", "px"; - $type: typey-validator($size, $allowed-types); - @if $base-unit == rem { - @if $rem-fallback == true { - @if $type == "font-size" { - $map-size: map-get($font-size, $size); - font-size: $map-size; - } - @if $type == "px" { - font-size: $size; - } - } - } - font-size: font-size($size, $context); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_line-height.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_line-height.scss deleted file mode 100644 index 1581ceb..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_line-height.scss +++ /dev/null @@ -1,23 +0,0 @@ -// Define line-height (with fallback). -// -// @param number $x -// Multiple of line height to be used or px value to be converted. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the -// elements/parents font-size if it differs from $base-font-size. -// Specified as a t-shirt size or value in px. -@mixin line-height($x, $context: $base-font-size) { - $allowed-types: "multiplier", "px"; - $type: typey-validator($x, $allowed-types); - @if $base-unit == rem and $line-height-method == "rhythm" { - @if $rem-fallback == true { - @if $type == "multiplier" { - line-height: $x * $base-line-height; - } - @if $type == "px" { - line-height: $x; - } - } - } - line-height: line-height($x, $context); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_spacing.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_spacing.scss deleted file mode 100644 index 6feb17e..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_spacing.scss +++ /dev/null @@ -1,89 +0,0 @@ -// Define spacing (with fallbacks). -// -// @param string $type -// The type of spacing: margin, padding, margin-top, etc. -// @param number|list|string $spacing -// Multiple of $base-line-height to be used or px value to be converted. -// Can be a SASS list using the same parameters as the CSS margin property: -// i.e. top right bottom left, 1 0 2 0. -// Can also be the string "auto" when used as margin. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -@mixin spacing($property, $spacing, $context: $base-font-size) { - $allowed-types: "multiplier", "px", "list"; - $type: typey-validator($spacing, $allowed-types); - - $px-fallback-list: (); - $converted-list: (); - - @each $x in $spacing { - @if $base-unit == rem { - $allowed-types: "multiplier", "px", "auto"; - $type: typey-validator($x, $allowed-types); - @if $type == "multiplier" { - $spacing: $x * $base-line-height; - $px-fallback-list: join($px-fallback-list, $spacing, $separator: space); - } - @if $type == "px" { - $px-fallback-list: join($px-fallback-list, $x, $separator: space); - } - @if $type == "auto" { - $px-fallback-list: join($px-fallback-list, $x, $separator: space); - } - } - $spacing: spacing($x, $context); - $converted-list: join($converted-list, $spacing, $separator: space); - } - - @if $base-unit == rem { - @if $rem-fallback == true { - #{$property}: $px-fallback-list; - } - } - #{$property}: $converted-list; -} - -// Wrapper mixins for various spacing properties. -// These can be used to provide easily sized spacing in the base unit. -// -// @param number|list|string $x -// Multiple of $base-line-height to be used or px value to be converted. -// Can be a SASS list using the same parameters as the CSS margin property: -// i.e. top right bottom left, 1 0 2 0. -// Can also be the string "auto" when used as margin. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the elements/parents -// font-size if it differs from $base-font-size. Specified as a t-shirt size or -// value in px. -@mixin margin($x, $context: $base-font-size) { - @include spacing(margin, $x, $context); -} -@mixin margin-top($x, $context: $base-font-size) { - @include spacing(margin-top, $x, $context); -} -@mixin margin-bottom($x, $context: $base-font-size) { - @include spacing(margin-bottom, $x, $context); -} -@mixin margin-left($x, $context: $base-font-size) { - @include spacing(margin-left, $x, $context); -} -@mixin margin-right($x, $context: $base-font-size) { - @include spacing(margin-right, $x, $context); -} -@mixin padding($x, $context: $base-font-size) { - @include spacing(padding, $x, $context); -} -@mixin padding-top($x, $context: $base-font-size) { - @include spacing(padding-top, $x, $context); -} -@mixin padding-bottom($x, $context: $base-font-size) { - @include spacing(padding-bottom, $x, $context); -} -@mixin padding-left($x, $context: $base-font-size) { - @include spacing(padding-left, $x, $context); -} -@mixin padding-right($x, $context: $base-font-size) { - @include spacing(padding-right, $x, $context); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_type-layout.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_type-layout.scss deleted file mode 100644 index 8098a38..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_type-layout.scss +++ /dev/null @@ -1,15 +0,0 @@ -// Define a type layout (font-size and line-height). -// -// @param number|string $size -// A size from the $font-size map or a px value. -// @param number $line-height -// Multiple of line height to be used or px value to be converted. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the -// elements/parents font-size if it differs from $base-font-size. -// Specified as a t-shirt size or value in px. -@mixin type-layout($size, $line-height, $context: $base-font-size) { - @include font-size($size, $context); - @include line-height($line-height, $size); - @include typey-debug-grid($line-height, $size); -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_typeface.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_typeface.scss deleted file mode 100644 index 2ecec08..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_typeface.scss +++ /dev/null @@ -1,90 +0,0 @@ -// Embed a typeface. -// -// @param string $typeface -// A font family from the $typefaces map. -@mixin typeface($typeface) { - $typeface-name: $typeface; - $typeface: map-get($typefaces, $typeface); - - $font-family: false; - $letter-spacing: false; - $weight: false; - $style: false; - $case: false; - - // Assign values to variables when $typeface is a keyed map. - @if type-of($typeface) == "map" { - @if map-has-key($typeface, font-family) { - $font-family: map-get($typeface, font-family); - } - @if map-has-key($typeface, letter-spacing) { - $letter-spacing: map-get($typeface, letter-spacing); - } - @if map-has-key($typeface, weight) { - $weight: map-get($typeface, weight); - } - @if map-has-key($typeface, style) { - $style: map-get($typeface, style); - } - @if map-has-key($typeface, case) { - $case: map-get($typeface, case); - } - } - - // Assign values to variables when $typeface is shorthand. - @if type-of($typeface) == "list" { - @if (list-separator($typeface) == "comma") { - // This shorthand is just a list of fonts. - $font-family: $typeface; - } - @else { - @each $value in $typeface { - // This is a font-family. - @if type-of($value) == "list" { - $font-family: $value; - } - // This is a letter-spacing value. - @if type-of($value) == "number" { - $letter-spacing: $value; - } - // This is a font-weight value. - @if map-has-key($font-weight, $value) { - $weight: $value; - } - // This is a case value. - @else if type-of($value) == "string" and index($text-transform-values, $value) != null { - $case: $value; - } - // This is a style value. - @else if type-of($value) == "string" and index($font-style-values, $value) != null { - $style: $value; - } - } - } - } - - // Output properties. - @if $font-family { - font-family: $font-family; - } - @else { - @error "Typeface '#{$typeface-name}' does not have a font-family"; - } - @if $letter-spacing { - @if ($letter-spacing == 0) { - letter-spacing: 0; - } - @else { - letter-spacing: calculate-em-px($letter-spacing, $base-font-size); - } - } - @if $weight { - font-weight: weight($weight); - } - @if $style { - font-style: $style; - } - @if $case { - text-transform: $case; - } -} diff --git a/assets/sass/lib/typey/stylesheets/typey/mixins/_typeset.scss b/assets/sass/lib/typey/stylesheets/typey/mixins/_typeset.scss deleted file mode 100644 index caa0d10..0000000 --- a/assets/sass/lib/typey/stylesheets/typey/mixins/_typeset.scss +++ /dev/null @@ -1,100 +0,0 @@ -// Typeset your type. -// -// @param string $typestyle -// A type style from the $typestyles map. -// @param number|string $context -// (optional) Only used if em is the $base-unit. The value of the -// elements/parents font-size if it differs from $base-font-size. -// Specified as a t-shirt size or value in px. -@mixin typeset($typestyle, $context: $base-font-size) { - $typestyle: map-get($typestyles, $typestyle); - - $font-size: false; - $line-height: false; - $weight: false; - $style: false; - $case: false; - $letter-spacing: false; - - // Assign values to variables when $typestyle is a keyed map. - @if type-of($typestyle) == "map" { - @if map-has-key($typestyle, font-size) { - $font-size: map-get($typestyle, font-size); - } - @if map-has-key($typestyle, line-height) { - $line-height: map-get($typestyle, line-height); - } - @if map-has-key($typestyle, weight) { - $weight: map-get($typestyle, weight); - } - @if map-has-key($typestyle, style) { - $style: map-get($typestyle, style); - } - @if map-has-key($typestyle, case) { - $case: map-get($typestyle, case); - } - @if map-has-key($typestyle, letter-spacing) { - $letter-spacing: map-get($typestyle, letter-spacing); - } - } - - // Assign values to variables when $typestyle is shorthand. - @if type-of($typestyle) == "list" { - @each $value in $typestyle { - // The first value is always font-size. - @if index($typestyle, $value) == 1 { - $font-size: $value; - } - // This is a line-height value. - @else if type-of($value) == "number" and index($typestyle, $value) == 2 { - $line-height: $value; - } - // This is a font-weight value. - @else if map-has-key($font-weight, $value) { - $weight: $value; - } - // This is a case value. - @else if type-of($value) == "string" and index($text-transform-values, $value) != null { - $case: $value; - } - // This is a style value. - @else if type-of($value) == "string" and index($font-style-values, $value) != null { - $style: $value; - } - // This is a letter-spacing value. - @else if type-of($value) == "number" and index($typestyle, $value) != 2 and index($typestyle, $value) != 1 { - $letter-spacing: $value; - } - } - } - - // $typestyle may also be a solitary font-size. - @if type-of($typestyle) != "map" and type-of($typestyle) != "list" { - $font-size: $typestyle; - } - - // Output properties. - @if $font-size { - @include font-size($font-size, $context); - } - @if $line-height { - @include typey-debug-grid($line-height, $font-size); - @include line-height($line-height, $font-size); - } - @else { - // Using default line-height so set debug grid accordingly. - @include typey-debug-grid($base-line-height, $font-size); - } - @if $weight { - font-weight: weight($weight); - } - @if $style { - font-style: $style; - } - @if $case { - text-transform: $case; - } - @if $letter-spacing { - letter-spacing: calculate-em-px($letter-spacing, $font-size); - } -}