Merge branch 'stable'
* stable: Fix edge case issue when there's no cache location. Fix broken test. Transitions accepting multiple transitions separated by commas Added force-wrap mixin to prevent URLs and long lines of text from breaking layouts.
This commit is contained in:
commit
3786a8312a
@ -21,6 +21,7 @@ The Documentation for the [latest preview release](http://beta.compass-style.org
|
||||
Set `$relative-font-sizing` to `false` to enable.
|
||||
* Vertical rhythm now has a minimum padding that defaults to 2px.
|
||||
This makes some edge cases look better.
|
||||
* New mixin `force-wrap` prevents URLs and long lines of text from breaking layouts.
|
||||
|
||||
0.11.3 (06/11/2011)
|
||||
-------------------
|
||||
|
@ -0,0 +1,15 @@
|
||||
---
|
||||
title: Wrapping Long Text and URLs
|
||||
crumb: Force Wrap
|
||||
framework: compass
|
||||
stylesheet: compass/typography/text/_force-wrap.scss
|
||||
layout: core
|
||||
meta_description: Wrap URLs and long lines of text.
|
||||
classnames:
|
||||
- reference
|
||||
- core
|
||||
- typography
|
||||
---
|
||||
- render 'reference' do
|
||||
%p
|
||||
This mixin will wrap URLs and long lines of text to prevent text from breaking layouts.
|
@ -72,7 +72,7 @@ $default-transition-delay: false !default;
|
||||
|
||||
// Transition all-in-one shorthand
|
||||
|
||||
@mixin transition(
|
||||
@mixin single-transition(
|
||||
$properties: $default-transition-property,
|
||||
$duration: $default-transition-duration,
|
||||
$function: $default-transition-function,
|
||||
@ -83,3 +83,37 @@ $default-transition-delay: false !default;
|
||||
@if $function { @include transition-timing-function($function); }
|
||||
@if $delay { @include transition-delay($delay); }
|
||||
}
|
||||
|
||||
@mixin transition(
|
||||
$transition-1 : default,
|
||||
$transition-2 : false,
|
||||
$transition-3 : false,
|
||||
$transition-4 : false,
|
||||
$transition-5 : false,
|
||||
$transition-6 : false,
|
||||
$transition-7 : false,
|
||||
$transition-8 : false,
|
||||
$transition-9 : false,
|
||||
$transition-10: false
|
||||
) {
|
||||
$legacy: (type-of($transition-1) == string and type-of(if($transition-2, $transition-2, 0)) == number and type-of(if($transition-3, $transition-3, '')) == string and type-of(if($transition-4, $transition-4, 0)) == number and ($transition-2 or $transition-3 or $transition-4));
|
||||
@if $legacy {
|
||||
@warn "Passing separate arguments for a single transition to transition is deprecated. " +
|
||||
"Pass the values as a single space-separated list, or use the single-transition mixin.";
|
||||
@include single-transition(
|
||||
if($transition-1, $transition-1, $default-transition-property),
|
||||
if($transition-2, $transition-2, $default-transition-duration),
|
||||
if($transition-3, $transition-3, $default-transition-funciton),
|
||||
if($transition-4, $transition-4, $default-transition-delay)
|
||||
);
|
||||
}
|
||||
@else {
|
||||
@if $transition-1 == default {
|
||||
$transition-1 : -compass-space-list(compact($default-transition-property, $default-transition-duration, $default-transition-function, $default-transition-delay));
|
||||
}
|
||||
$transition : compact($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10);
|
||||
@include experimental(transition, $transition,
|
||||
-moz, -webkit, -o, not -ms, not -khtml, official
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -1,3 +1,4 @@
|
||||
@import "text/ellipsis";
|
||||
@import "text/nowrap";
|
||||
@import "text/replacement";
|
||||
@import "text/force-wrap";
|
||||
|
@ -0,0 +1,12 @@
|
||||
// Prevent long urls and text from breaking layouts
|
||||
// [originally from perishablepress.com](http://perishablepress.com/press/2010/06/01/wrapping-content/)
|
||||
@mixin force-wrap {
|
||||
white-space: pre; // CSS 2.0
|
||||
white-space: pre-wrap; // CSS 2.1
|
||||
white-space: pre-line; // CSS 3.0
|
||||
white-space: -pre-wrap; // Opera 4-6
|
||||
white-space: -o-pre-wrap; // Opera 7
|
||||
white-space: -moz-pre-wrap; // Mozilla
|
||||
white-space: -hp-pre-wrap; // HP Printers
|
||||
word-wrap: break-word; // IE 5+
|
||||
}
|
@ -84,7 +84,7 @@ module Compass
|
||||
def run
|
||||
if new_config?
|
||||
# Wipe out the cache and force compilation if the configuration has changed.
|
||||
remove options[:cache_location]
|
||||
remove options[:cache_location] if options[:cache_location]
|
||||
options[:force] = true
|
||||
end
|
||||
|
||||
|
9
test/fixtures/stylesheets/compass/css/force-wrap.css
vendored
Normal file
9
test/fixtures/stylesheets/compass/css/force-wrap.css
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
white-space: pre-line;
|
||||
white-space: -pre-wrap;
|
||||
white-space: -o-pre-wrap;
|
||||
white-space: -moz-pre-wrap;
|
||||
white-space: -hp-pre-wrap;
|
||||
word-wrap: break-word; }
|
3
test/fixtures/stylesheets/compass/sass/force-wrap.scss
vendored
Normal file
3
test/fixtures/stylesheets/compass/sass/force-wrap.scss
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
@import "compass/typography/text";
|
||||
|
||||
pre { @include force-wrap; }
|
Loading…
Reference in New Issue
Block a user