From 1d03f0f0be4f48efa63b956c27a42da270473b77 Mon Sep 17 00:00:00 2001 From: pedrosantos Date: Fri, 26 Aug 2016 12:15:47 +0100 Subject: [PATCH 1/3] #16 update to readme file --- README.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/README.md b/README.md index bb9c738..dc8744e 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,7 @@ -# Ritmo - ![Ritmo - A vertical rhythm sass toolkit](http://ritmo.marzeelabs.org/images/logo-small.jpg "Ritmo") **RITMO** is a fork from Compass vertical-rhythm. It rules the vertical rhythm of the site based on the initial font size, managing the vertical margins, paddings and line-height.

It keeps your site organized and structured on a coherent baseline grid. It uses **rem** unit by default but it can also use **em** or **px** values for measurement. The only dependency is SASS. We also provide an npm package. -Find all the documentation at [ritmo.marzeelabs.org](http://ritmo.marzeelabs.org). \ No newline at end of file +Find all the documentation at [ritmo.marzeelabs.org](http://ritmo.marzeelabs.org). From e5610bd01d45174e76a2f4503308cb0a933fce00 Mon Sep 17 00:00:00 2001 From: Jolidog Date: Fri, 9 Sep 2016 11:34:57 +0100 Subject: [PATCH 2/3] chmod files --- .gitignore | 0 LICENSE.md | 0 README.md | 0 _ritmo.scss | 0 logic/_functions.scss | 0 logic/_mixins.scss | 0 logic/_units.scss | 0 package.json | 0 8 files changed, 0 insertions(+), 0 deletions(-) mode change 100644 => 100755 .gitignore mode change 100644 => 100755 LICENSE.md mode change 100644 => 100755 README.md mode change 100644 => 100755 _ritmo.scss mode change 100644 => 100755 logic/_functions.scss mode change 100644 => 100755 logic/_mixins.scss mode change 100644 => 100755 logic/_units.scss mode change 100644 => 100755 package.json diff --git a/.gitignore b/.gitignore old mode 100644 new mode 100755 diff --git a/LICENSE.md b/LICENSE.md old mode 100644 new mode 100755 diff --git a/README.md b/README.md old mode 100644 new mode 100755 diff --git a/_ritmo.scss b/_ritmo.scss old mode 100644 new mode 100755 diff --git a/logic/_functions.scss b/logic/_functions.scss old mode 100644 new mode 100755 diff --git a/logic/_mixins.scss b/logic/_mixins.scss old mode 100644 new mode 100755 diff --git a/logic/_units.scss b/logic/_units.scss old mode 100644 new mode 100755 diff --git a/package.json b/package.json old mode 100644 new mode 100755 From e7d1feaf459f06f944d4d4c4e84a851c86ea20a2 Mon Sep 17 00:00:00 2001 From: Jolidog Date: Fri, 9 Sep 2016 16:16:40 +0100 Subject: [PATCH 3/3] #18 Removed border styles. Renamed variables and functions where rhythm was still used. --- _ritmo.scss | 14 ++++++------- logic/_functions.scss | 10 ++++----- logic/_mixins.scss | 47 +++++++++++++++++-------------------------- logic/_units.scss | 4 ++-- 4 files changed, 32 insertions(+), 43 deletions(-) diff --git a/_ritmo.scss b/_ritmo.scss index 5cfed18..8d3fafc 100755 --- a/_ritmo.scss +++ b/_ritmo.scss @@ -15,15 +15,13 @@ $base-line-multi: 5 !default; // Supported values: px, em, rem. Percent units can't be used since they // make calculating padding and margins impractical, and percentage borders are // not valid or supported in css. -$rhythm-unit: 'rem' !default; +$ritmo-unit: 'rem' !default; -// Whether to output fallback values in px when using rem as the rhythm-unit. +// Whether to output fallback values in px when using rem as the $ritmo-unit. $rem-with-px-fallback: false !default; // Default values for rhythm borders properties. -// Supports style alone eg. `solid` or list of style and color eg. `solid #aaa`; -$default-rhythm-border-width: 1px !default; -$default-rhythm-border-style: solid !default; +$ritmo-border-width: 1px !default; // Allows the `ritmo-font-size` mixin and the `lines-for-font-size` function // to round the line height to the nearest half line height instead of the @@ -35,7 +33,7 @@ $round-to-nearest-half-line: false !default; $min-line-padding: 2px !default; // @private Whether the rhythm output is in absolute units (px) or not (em, rem) -$relative-font-sizing: if($rhythm-unit == px, false, true); +$relative-font-sizing: if($ritmo-unit == px, false, true); // Import the partials @import "logic/functions", @@ -43,11 +41,11 @@ $relative-font-sizing: if($rhythm-unit == px, false, true); "logic/mixins"; -// Helper variables +// Constant variables // The leader is the amount of whitespace in a line. // It might be useful in your calculations. -$base-leader: convert-length(($base-line-unit * $base-line-multi) - $base-font-size, $rhythm-unit, $base-font-size); +$base-leader: convert-length(($base-line-unit * $base-line-multi) - $base-font-size, $ritmo-unit, $base-font-size); // The half-leader is the amount of whitespace above and below a line. // It might be useful in your calculations. diff --git a/logic/_functions.scss b/logic/_functions.scss index 7a23b4c..8318c75 100755 --- a/logic/_functions.scss +++ b/logic/_functions.scss @@ -144,11 +144,11 @@ // Calculate rhythm units. @function ritmo($lines: 1, $font-size: $base-font-size, $offset: 0) { - $rhythm: convert-length($lines * $base-line-unit - $offset, $rhythm-unit, $font-size); - @if unit($rhythm) == px { - $rhythm: floor($rhythm); + $ritmo: convert-length($lines * $base-line-unit - $offset, $ritmo-unit, $font-size); + @if unit($ritmo) == px { + $ritmo: floor($ritmo); } - @return $rhythm; + @return $ritmo; } // Calculate the minimum multiple of rhythm units needed to contain the font-size. @@ -161,4 +161,4 @@ $lines: $lines + if($round-to-nearest-half-line, 0.5, 1); } @return $lines; -} \ No newline at end of file +} diff --git a/logic/_mixins.scss b/logic/_mixins.scss index 21f5f34..0b54b0c 100755 --- a/logic/_mixins.scss +++ b/logic/_mixins.scss @@ -1,7 +1,7 @@ // @private Outputs rhythm values. For rem units, outputs pixel fallbacks // by default. @mixin output-ritmo($property, $values) { - @if $rhythm-unit == rem and $rem-with-px-fallback { + @if $ritmo-unit == rem and $rem-with-px-fallback { @include rem($property, $values); } @else { @@ -28,7 +28,7 @@ // Webkit has a bug that prevents line-height being set in rem on ; // To work around this and simplify output, we can set initial line-height - // in ems for all relative rhythm units, even when $rhythm-unit is `rem`. + // in ems for all relative rhythm units, even when $ritmo-unit is `rem`. @if $relative-font-sizing { line-height: convert-length($base-line-unit * $base-line-multi, em); } @@ -48,7 +48,7 @@ @if $lines == auto { $lines: lines-for-font-size($to-size); } - @include output-ritmo(font-size, convert-length($to-size, $rhythm-unit, $from-size)); + @include output-ritmo(font-size, convert-length($to-size, $ritmo-unit, $from-size)); @include ritmo-leading($lines, $to-size); } @@ -128,18 +128,13 @@ // rhythm. The whitespace must be greater than the width of the border. @mixin ritmo-side-border( $side, - $width: $default-rhythm-border-width, + $width: $ritmo-border-width, $lines: 1, - $font-size: $base-font-size, - $border-style: $default-rhythm-border-style + $font-size: $base-font-size ) { // If applying borders to all sides, use shorthand properties $border-prop: if($side == all, border, border-#{$side}); - @include output-ritmo(#{$border-prop}-width, convert-length($width, $rhythm-unit, $font-size)); - #{$border-prop}-style: nth($border-style, 1); - @if type-of($border-style) == list and length($border-style) > 1 { - #{$border-prop}-color: nth($border-style, 2); - } + @include output-ritmo(#{$border-prop}-width, convert-length($width, $ritmo-unit, $font-size)); $padding-prop: if($side == all, padding, padding-#{$side}); @include output-ritmo(#{$padding-prop}, ritmo($lines, $font-size, $offset: $width)); } @@ -147,41 +142,37 @@ // Apply a leading border. // $border-style and $width are deprecated and will be removed in a future version of Compass. @mixin ritmo-top-border( - $width: $default-rhythm-border-width, + $width: $ritmo-border-width, $lines: 1, - $font-size: $base-font-size, - $border-style: $default-rhythm-border-style + $font-size: $base-font-size ) { - @include ritmo-side-border(top, $width, $lines, $font-size, $border-style); + @include ritmo-side-border(top, $width, $lines, $font-size); } // Apply a trailing border. @mixin ritmo-bottom-border( - $width: $default-rhythm-border-width, + $width: $ritmo-border-width, $lines: 1, - $font-size: $base-font-size, - $border-style: $default-rhythm-border-style + $font-size: $base-font-size ) { - @include ritmo-side-border(bottom, $width, $lines, $font-size, $border-style); + @include ritmo-side-border(bottom, $width, $lines, $font-size); } // Apply both leading and trailing borders. @mixin ritmo-horizontal-borders( - $width: $default-rhythm-border-width, + $width: $ritmo-border-width, $lines: 1, - $font-size: $base-font-size, - $border-style: $default-rhythm-border-style + $font-size: $base-font-size ) { - @include ritmo-top-border($width, $lines, $font-size, $border-style); - @include ritmo-bottom-border($width, $lines, $font-size, $border-style); + @include ritmo-top-border($width, $lines, $font-size); + @include ritmo-bottom-border($width, $lines, $font-size); } // Apply borders and whitespace equally to all sides. @mixin ritmo-borders( - $width: $default-rhythm-border-width, + $width: $ritmo-border-width, $lines: 1, - $font-size: $base-font-size, - $border-style: $default-rhythm-border-style + $font-size: $base-font-size ) { - @include ritmo-side-border(all, $width, $lines, $font-size, $border-style); + @include ritmo-side-border(all, $width, $lines, $font-size); } diff --git a/logic/_units.scss b/logic/_units.scss index c748713..c51735a 100755 --- a/logic/_units.scss +++ b/logic/_units.scss @@ -1,8 +1,8 @@ // Validate units @if unit($base-font-size) != 'px' { @warn "$base-font-size must resolve to a pixel unit."; } @if unit($base-line-unit) != 'px' { @warn "$base-line-unit must resolve to a pixel unit."; } -@if $rhythm-unit != 'px' and $rhythm-unit != 'em' and $rhythm-unit != 'rem' { - @warn "$rhythm-unit must be `px`, `em` or `rem`."; +@if $ritmo-unit != 'px' and $ritmo-unit != 'em' and $ritmo-unit != 'rem' { + @warn "$ritmo-unit must be `px`, `em` or `rem`."; } // Output a given style rule containing rem values along with an (optional)