sassy_ink-rails 1.0.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,114 @@
1
+ // Ink by ZURB
2
+ // zurb.com/ink/
3
+ // Licensed under MIT Open Source
4
+
5
+ @import "global";
6
+
7
+ //
8
+ // @variables
9
+ //
10
+ $include-html-media-query-classes: $include-html-classes !default;
11
+
12
+ $small-container-width: 95% !default;
13
+
14
+ // Media Query Ranges
15
+ $small-range: (0px, $container-width * (600px / 580px)) !default;
16
+
17
+ $screen: "only screen" !default;
18
+
19
+ $landscape: "#{$screen} and (orientation: landscape)" !default;
20
+ $portrait: "#{$screen} and (orientation: portrait)" !default;
21
+
22
+ $small-up: $screen !default;
23
+ $small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})" !default;
24
+
25
+ @include exports("media-query") {
26
+ @if $include-html-media-query-classes {
27
+ /* Media Queries */
28
+
29
+ @media #{$small-only} {
30
+
31
+ table[class="body"] img {
32
+ width: auto !important;
33
+ height: auto !important;
34
+ }
35
+
36
+ table[class="body"] center {
37
+ min-width: 0 !important;
38
+ }
39
+
40
+ table[class="body"] .container {
41
+ width: $small-container-width !important;
42
+ }
43
+
44
+ table[class="body"] .row {
45
+ width: 100% !important;
46
+ display: block !important;
47
+ }
48
+
49
+ table[class="body"] .wrapper {
50
+ display: block !important;
51
+ padding-right: 0 !important;
52
+ }
53
+
54
+ table[class="body"] .columns,
55
+ table[class="body"] .column {
56
+ table-layout: fixed !important;
57
+ float: none !important;
58
+ width: 100% !important;
59
+ padding-right: 0px !important;
60
+ padding-left: 0px !important;
61
+ display: block !important;
62
+ }
63
+
64
+ table[class="body"] .wrapper.first .columns,
65
+ table[class="body"] .wrapper.first .column {
66
+ display: table !important;
67
+ }
68
+
69
+ table[class="body"] table.columns td,
70
+ table[class="body"] table.column td {
71
+ width: 100% !important;
72
+ }
73
+
74
+ @for $i from 1 through $total-columns {
75
+ table[class="body"] .columns td.#{number2word($i)},
76
+ table[class="body"] .column td.#{number2word($i)} {
77
+ width: grid-calc-pct($i, $total-columns) !important;
78
+ }
79
+ }
80
+ table[class="body"] td%offset-by{
81
+ padding-left: 0 !important;
82
+ }
83
+ @for $i from 1 through ($total-columns - 1) {
84
+ .offset-by-#{number2word($i)} {
85
+ @extend %offset-by;
86
+ }
87
+ }
88
+
89
+ table[class="body"] table.columns td.expander {
90
+ width: 1px !important;
91
+ }
92
+
93
+ table[class="body"] .right-text-pad,
94
+ table[class="body"] .text-pad-right {
95
+ padding-left: $text-padding !important;
96
+ }
97
+
98
+ table[class="body"] .left-text-pad,
99
+ table[class="body"] .text-pad-left {
100
+ padding-right: $text-padding !important;
101
+ }
102
+
103
+ table[class="body"] .hide-for-small,
104
+ table[class="body"] .show-for-desktop {
105
+ display: none !important;
106
+ }
107
+
108
+ table[class="body"] .show-for-small,
109
+ table[class="body"] .hide-for-desktop {
110
+ display: inherit !important;
111
+ }
112
+ }
113
+ }
114
+ }
@@ -0,0 +1,109 @@
1
+ // Ink by ZURB
2
+ // zurb.com/ink/
3
+ // Licensed under MIT Open Source
4
+
5
+ @import "global";
6
+
7
+ //
8
+ // @variables
9
+ //
10
+ $include-html-normalize-classes: $include-html-classes !default;
11
+
12
+ // We use these to style the <hr> element
13
+ $hr-color: #d9d9d9 !default;
14
+ $hr-height: 1px !default;
15
+
16
+
17
+ @include exports("normalize") {
18
+ @if $include-html-normalize-classes {
19
+ /* Client-specific Styles & Reset */
20
+
21
+ #outlook a {
22
+ padding:0;
23
+ }
24
+
25
+ body {
26
+ width:100% !important;
27
+ min-width: 100%;
28
+ -webkit-text-size-adjust:100%;
29
+ -ms-text-size-adjust:100%;
30
+ margin:0;
31
+ padding:0;
32
+ }
33
+
34
+ /* .ExternalClass applies to Outlook.com (the artist formerly known as Hotmail) */
35
+
36
+ .ExternalClass {
37
+ width:100%;
38
+
39
+ &,
40
+ p,
41
+ span,
42
+ font,
43
+ td,
44
+ div {
45
+ line-height: 100%;
46
+ }
47
+ }
48
+
49
+
50
+
51
+
52
+ #backgroundTable {
53
+ margin:0;
54
+ padding:0;
55
+ width:100% !important;
56
+ line-height: 100% !important;
57
+ }
58
+
59
+ img {
60
+ outline:none;
61
+ text-decoration:none;
62
+ -ms-interpolation-mode: bicubic;
63
+ width: auto;
64
+ max-width: 100%;
65
+ float: left;
66
+ clear: both;
67
+ display: block;
68
+ }
69
+
70
+ center {
71
+ width: 100%;
72
+ min-width: $container-width;
73
+ }
74
+
75
+ a img {
76
+ border: none;
77
+ }
78
+
79
+ p {
80
+ margin: 0 0 0 $paragraph-margin-bottom;
81
+ }
82
+
83
+ table {
84
+ border-spacing: 0;
85
+ border-collapse: collapse;
86
+ }
87
+
88
+ td {
89
+ word-break: break-word;
90
+ -webkit-hyphens: auto;
91
+ -moz-hyphens: auto;
92
+ hyphens: auto;
93
+ border-collapse: collapse !important;
94
+ }
95
+
96
+ table, tr, td {
97
+ padding: 0;
98
+ vertical-align: top;
99
+ text-align: left;
100
+ }
101
+
102
+ hr {
103
+ color: color2hex($hr-color);
104
+ background-color: color2hex($hr-color);
105
+ height: $hr-height;
106
+ border: none;
107
+ }
108
+ }
109
+ }
@@ -0,0 +1,20 @@
1
+ // Ink by ZURB
2
+ // zurb.com/ink/
3
+ // Licensed under MIT Open Source
4
+
5
+ @import "global";
6
+
7
+ //
8
+ // @variables
9
+ //
10
+ $include-html-outlook-first-classes: $include-html-classes !default;
11
+
12
+ @include exports("outlook-first") {
13
+ @if $include-html-outlook-first-classes {
14
+ /* Outlook First */
15
+
16
+ body.outlook p {
17
+ display: inline !important;
18
+ }
19
+ }
20
+ }
@@ -0,0 +1,40 @@
1
+ // Ink by ZURB
2
+ // zurb.com/ink/
3
+ // Licensed under MIT Open Source
4
+
5
+ @import "global";
6
+
7
+ //
8
+ // @variables
9
+ //
10
+
11
+ //
12
+ // @variables
13
+ //
14
+
15
+ $include-html-panel-classes: $include-html-classes !default;
16
+
17
+ $panel-bg: #f2f2f2 !default;
18
+ $panel-border-style: solid !default;
19
+ $panel-border-color: #d9d9d9 !default;
20
+ $panel-border-size: 1px !default;
21
+
22
+ @include exports("panel") {
23
+ @if $include-html-panel-classes {
24
+ /* Panels */
25
+
26
+ .panel {
27
+ background: color2hex($panel-bg);
28
+ border: $panel-border-size $panel-border-style color2hex($panel-border-color);
29
+ padding: $panel-padding !important;
30
+ }
31
+
32
+ .sub-grid table {
33
+ width: 100%;
34
+ }
35
+
36
+ .sub-grid td.sub-columns {
37
+ padding-bottom: 0;
38
+ }
39
+ }
40
+ }
@@ -0,0 +1,130 @@
1
+ // Ink by ZURB
2
+ // zurb.com/ink/
3
+ // Licensed under MIT Open Source
4
+
5
+ @import "global";
6
+
7
+ //
8
+ // @variables
9
+ //
10
+ $include-html-type-classes: $include-html-classes !default;
11
+
12
+ // We use these to control font styles
13
+ $base-font-color: #222222 !default;
14
+ $base-font-family: Helvetica, Arial, sans-serif !default;
15
+ $base-font-weight: normal !default;
16
+ $base-line-height: 1.3 !default;
17
+
18
+ $body-font-size: 14px !default;
19
+ $body-line-height: 19px !default;
20
+
21
+ // We use these to control header font sizes
22
+ $h1-font-size: 40px !default;
23
+ $h2-font-size: 36px !default;
24
+ $h3-font-size: 32px !default;
25
+ $h4-font-size: 28px !default;
26
+ $h5-font-size: 24px !default;
27
+ $h6-font-size: 20px !default;
28
+
29
+ // A general <small> styling
30
+ $small-font-size: 10px !default;
31
+
32
+ // We use these to style lead paragraphs
33
+ $paragraph-lead-font-size: 18px !default;
34
+ $paragraph-lead-line-height: 21px !default;
35
+
36
+ // We use these to style anchors
37
+ $anchor-text-decoration: none !default;
38
+ $anchor-font-color: #2ba6cb !default;
39
+ $anchor-font-color-visited: $anchor-font-color !default;
40
+ $anchor-font-color-hover: #2795b6 !default;
41
+ $anchor-font-color-active: $anchor-font-color-hover !default;
42
+
43
+ $header-anchor-font-color: $anchor-font-color !default;
44
+ $header-anchor-font-color-visited: $header-anchor-font-color !default;
45
+ $header-anchor-font-color-active: $header-anchor-font-color !default;
46
+
47
+ @include exports("type") {
48
+ @if $include-html-type-classes {
49
+ /* Typography */
50
+
51
+ body, table.body, h1, h2, h3, h4, h5, h6, p, td {
52
+ color: color2hex($base-font-color);
53
+ font-family: $base-font-family;
54
+ font-weight: $base-font-weight;
55
+ padding:0;
56
+ margin: 0;
57
+ text-align: left;
58
+ line-height: $base-line-height;
59
+ }
60
+
61
+ h1, h2, h3, h4, h5, h6 {
62
+ word-break: normal;
63
+ }
64
+
65
+ h1 {font-size: $h1-font-size;}
66
+ h2 {font-size: $h2-font-size;}
67
+ h3 {font-size: $h3-font-size;}
68
+ h4 {font-size: $h4-font-size;}
69
+ h5 {font-size: $h5-font-size;}
70
+ h6 {font-size: $h6-font-size;}
71
+ body, table.body, p, td {font-size: $body-font-size;line-height:$body-line-height;}
72
+
73
+ p.lead, p.lede, p.leed {
74
+ font-size: $paragraph-lead-font-size;
75
+ line-height:$paragraph-lead-line-height;
76
+ }
77
+
78
+ p {
79
+ margin-bottom: $paragraph-margin-bottom;
80
+ }
81
+
82
+ small {
83
+ font-size: $small-font-size;
84
+ }
85
+
86
+ a {
87
+ color: color2hex($anchor-font-color);
88
+ text-decoration: $anchor-text-decoration;
89
+ }
90
+
91
+ a:hover {
92
+ color: color2hex($anchor-font-color-hover) !important;
93
+ }
94
+
95
+ a:active {
96
+ color: color2hex($anchor-font-color-active) !important;
97
+ }
98
+
99
+ a:visited {
100
+ color: color2hex($anchor-font-color-visited) !important;
101
+ }
102
+
103
+ h1 a,
104
+ h2 a,
105
+ h3 a,
106
+ h4 a,
107
+ h5 a,
108
+ h6 a {
109
+ color: color2hex($header-anchor-font-color);
110
+ }
111
+
112
+ h1 a:active,
113
+ h2 a:active,
114
+ h3 a:active,
115
+ h4 a:active,
116
+ h5 a:active,
117
+ h6 a:active {
118
+ color: color2hex($header-anchor-font-color-active) !important;
119
+ }
120
+
121
+ h1 a:visited,
122
+ h2 a:visited,
123
+ h3 a:visited,
124
+ h4 a:visited,
125
+ h5 a:visited,
126
+ h6 a:visited {
127
+ color: color2hex($header-anchor-font-color-visited) !important;
128
+ }
129
+ }
130
+ }
@@ -0,0 +1,19 @@
1
+ /**********************************************
2
+ * Ink v1.0.5 - Copyright 2013 ZURB Inc *
3
+ **********************************************/
4
+
5
+ // Make sure the charset is set appropriately
6
+ @charset "UTF-8";
7
+
8
+ // Behold, here are all the Ink components.
9
+ @import
10
+ "ink/settings",
11
+ "ink/components/normalize",
12
+ "ink/components/grid",
13
+ "ink/components/block-grid",
14
+ "ink/components/alignment",
15
+ "ink/components/type",
16
+ "ink/components/panels",
17
+ "ink/components/buttons",
18
+ "ink/components/outlook-first",
19
+ "ink/components/media-query";
metadata ADDED
@@ -0,0 +1,114 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: sassy_ink-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 1.0.0
5
+ platform: ruby
6
+ authors:
7
+ - Ryan Boland
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2015-05-01 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: railties
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - ">="
18
+ - !ruby/object:Gem::Version
19
+ version: '3.2'
20
+ - - "<"
21
+ - !ruby/object:Gem::Version
22
+ version: '5.0'
23
+ type: :runtime
24
+ prerelease: false
25
+ version_requirements: !ruby/object:Gem::Requirement
26
+ requirements:
27
+ - - ">="
28
+ - !ruby/object:Gem::Version
29
+ version: '3.2'
30
+ - - "<"
31
+ - !ruby/object:Gem::Version
32
+ version: '5.0'
33
+ - !ruby/object:Gem::Dependency
34
+ name: bundler
35
+ requirement: !ruby/object:Gem::Requirement
36
+ requirements:
37
+ - - "~>"
38
+ - !ruby/object:Gem::Version
39
+ version: '1.7'
40
+ type: :development
41
+ prerelease: false
42
+ version_requirements: !ruby/object:Gem::Requirement
43
+ requirements:
44
+ - - "~>"
45
+ - !ruby/object:Gem::Version
46
+ version: '1.7'
47
+ - !ruby/object:Gem::Dependency
48
+ name: rake
49
+ requirement: !ruby/object:Gem::Requirement
50
+ requirements:
51
+ - - "~>"
52
+ - !ruby/object:Gem::Version
53
+ version: '10.0'
54
+ type: :development
55
+ prerelease: false
56
+ version_requirements: !ruby/object:Gem::Requirement
57
+ requirements:
58
+ - - "~>"
59
+ - !ruby/object:Gem::Version
60
+ version: '10.0'
61
+ description: Sass port of Ink, for Rails Asset Pipeline.
62
+ email:
63
+ - bolandryanm@gmail.com
64
+ executables: []
65
+ extensions: []
66
+ extra_rdoc_files: []
67
+ files:
68
+ - ".gitignore"
69
+ - Gemfile
70
+ - LICENSE.txt
71
+ - README.md
72
+ - Rakefile
73
+ - lib/sassy_ink-rails.rb
74
+ - lib/sassy_ink/rails.rb
75
+ - lib/sassy_ink/rails/version.rb
76
+ - sassy_ink-rails.gemspec
77
+ - vendor/assets/stylesheets/ink/_functions.scss
78
+ - vendor/assets/stylesheets/ink/_settings.scss
79
+ - vendor/assets/stylesheets/ink/components/_alignment.scss
80
+ - vendor/assets/stylesheets/ink/components/_block-grid.scss
81
+ - vendor/assets/stylesheets/ink/components/_buttons.scss
82
+ - vendor/assets/stylesheets/ink/components/_global.scss
83
+ - vendor/assets/stylesheets/ink/components/_grid.scss
84
+ - vendor/assets/stylesheets/ink/components/_media-query.scss
85
+ - vendor/assets/stylesheets/ink/components/_normalize.scss
86
+ - vendor/assets/stylesheets/ink/components/_outlook-first.scss
87
+ - vendor/assets/stylesheets/ink/components/_panels.scss
88
+ - vendor/assets/stylesheets/ink/components/_type.scss
89
+ - vendor/assets/stylesheets/zurb-ink.scss
90
+ homepage: ''
91
+ licenses:
92
+ - MIT
93
+ metadata: {}
94
+ post_install_message:
95
+ rdoc_options: []
96
+ require_paths:
97
+ - lib
98
+ required_ruby_version: !ruby/object:Gem::Requirement
99
+ requirements:
100
+ - - ">="
101
+ - !ruby/object:Gem::Version
102
+ version: '0'
103
+ required_rubygems_version: !ruby/object:Gem::Requirement
104
+ requirements:
105
+ - - ">="
106
+ - !ruby/object:Gem::Version
107
+ version: '0'
108
+ requirements: []
109
+ rubyforge_project:
110
+ rubygems_version: 2.4.5
111
+ signing_key:
112
+ specification_version: 4
113
+ summary: Sass port of Ink, for Rails Asset Pipeline.
114
+ test_files: []