translucencss 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. data/stylesheets/translucencss/_util.scss +2 -0
  2. data/stylesheets/translucencss/util/_alignment.scss +33 -0
  3. data/stylesheets/translucencss/util/_aspect-ratio.scss +6 -0
  4. data/stylesheets/translucencss/util/_ellipsis.scss +2 -1
  5. metadata +3 -1
data/stylesheets/translucencss/_util.scss CHANGED
@@ -1,3 +1,5 @@
1
+ @import "util/alignment";
2
+ @import "util/aspect-ratio";
1
3
  @import "util/colors";
2
4
  @import "util/clearfix";
3
5
  @import "util/ie";
data/stylesheets/translucencss/util/_alignment.scss ADDED
@@ -0,0 +1,33 @@
1
+ @import "compass/css3/transform";
2
+
3
+ // http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/
4
+ @mixin vertical-center($position: relative) {
5
+ position: $position;
6
+ top: 50%;
7
+ @include transform(translateY(-50%));
8
+ }
9
+
10
+ @mixin block-centering {
11
+ margin-left: auto;
12
+ margin-right: auto;
13
+ }
14
+
15
+ // http://www.sitepoint.com/css-extend-full-width-bars/
16
+ @mixin full-width-overflow($align: center, $fallback: -50em) {
17
+ margin-left: $fallback;
18
+ margin-left: -50vw;
19
+ margin-right: $fallback;
20
+ margin-right: -50vw;
21
+
22
+ text-align: $align;
23
+
24
+ @if $align == left or $align == justify {
25
+ padding-left: $fallback;
26
+ padding-left: -50vw;
27
+ }
28
+
29
+ @if $align == right or $align == justify {
30
+ padding-right: $fallback;
31
+ padding-right: -50vw;
32
+ }
33
+ }
data/stylesheets/translucencss/util/_aspect-ratio.scss ADDED
@@ -0,0 +1,6 @@
1
+ // @ratio: 3 / 4 | 75%
2
+ @mixin aspect-ratio($ratio) {
3
+ content: '';
4
+ display: block;
5
+ padding-bottom: if(unitless($ratio), percentage($ratio), $ratio);
6
+ }
data/stylesheets/translucencss/util/_ellipsis.scss CHANGED
@@ -2,7 +2,8 @@
2
2
 
3
3
  $text-overflow-support: not webkit, not moz, o, not ms, not khtml;
4
4
 
5
- @mixin single-line-ellipsis {
5
+ @mixin single-line-ellipsis($width: null) {
6
+ max-width: $width;
6
7
  text-overflow: ellipsis;
7
8
  white-space: nowrap;
8
9
  overflow: hidden;
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: translucencss
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.2
4
+ version: 0.1.3
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -51,7 +51,9 @@ files:
51
51
  - stylesheets/translucencss/util/_ie.scss
52
52
  - stylesheets/translucencss/util/_images.scss
53
53
  - stylesheets/translucencss/util/_ellipsis.scss
54
+ - stylesheets/translucencss/util/_alignment.scss
54
55
  - stylesheets/translucencss/util/_spacing.scss
56
+ - stylesheets/translucencss/util/_aspect-ratio.scss
55
57
  - stylesheets/translucencss/css3/_object-fit.scss
56
58
  - stylesheets/translucencss/css3/_flexbox.scss
57
59
  - stylesheets/translucencss/css3/_flexbox_old.scss