euphoria 0.1.4.72 → 0.1.41

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 (31) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +22 -11
  3. data/app/assets/javascripts/UI_Modules.coffee +1 -1
  4. data/app/assets/stylesheets/euphoria/components/_buttons.sass +94 -57
  5. data/app/assets/stylesheets/euphoria/components/_forms.sass +10 -10
  6. data/app/assets/stylesheets/euphoria/components/_menus.sass +10 -3
  7. data/app/assets/stylesheets/euphoria/components/_tables.sass +50 -55
  8. data/app/assets/stylesheets/euphoria/core/_containers.sass +34 -17
  9. data/app/assets/stylesheets/euphoria/core/_grids.sass +12 -2
  10. data/app/assets/stylesheets/euphoria/core/_type.sass +25 -7
  11. data/app/assets/stylesheets/euphoria/helpers/_reset.sass +1 -0
  12. data/app/assets/stylesheets/euphoria/interface/parallax.sass +32 -61
  13. data/euphoria.gemspec +7 -7
  14. data/lib/euphoria.rb +1 -1
  15. data/lib/euphoria/version.rb +1 -1
  16. data/lib/generators/euphoria/install_generator.rb +51 -0
  17. data/lib/generators/euphoria/templates/javascripts/UI_Modules.coffee +44 -0
  18. data/lib/generators/euphoria/templates/stylesheets/euphoria/components/_buttons.sass +78 -0
  19. data/lib/generators/euphoria/templates/stylesheets/euphoria/components/_forms.sass +111 -0
  20. data/lib/generators/euphoria/templates/stylesheets/euphoria/components/_menus.sass +172 -0
  21. data/lib/generators/euphoria/templates/stylesheets/euphoria/components/_tables.sass +89 -0
  22. data/lib/generators/euphoria/templates/stylesheets/euphoria/core/_containers.sass +42 -0
  23. data/lib/generators/euphoria/templates/stylesheets/euphoria/core/_grids.sass +75 -0
  24. data/lib/generators/euphoria/templates/stylesheets/euphoria/core/_responsive.sass +20 -0
  25. data/lib/generators/euphoria/templates/stylesheets/euphoria/core/_type.sass +21 -0
  26. data/lib/generators/euphoria/templates/stylesheets/euphoria/helpers/_mixins.sass +97 -0
  27. data/lib/generators/euphoria/templates/stylesheets/euphoria/helpers/_reset.sass +104 -0
  28. data/lib/generators/euphoria/templates/stylesheets/euphoria/interface/parallax.sass +66 -0
  29. data/lib/generators/euphoria/templates/stylesheets/load.sass +14 -0
  30. metadata +33 -20
  31. data/lib/generators/install_generator.rb +0 -6
@@ -0,0 +1,172 @@
1
+ /*=============================================================================
2
+ ** Variables
3
+ **==============================================================================
4
+ //menu li border color
5
+ $li_border_color: #dfdfdf
6
+ //links hover color
7
+ $link_hover_color: #2ECC71
8
+ $link_hover_bg_color: rgba(46, 204, 113, 1)
9
+ /*======================================
10
+ ** Menu values
11
+ **=====================================
12
+ // menu's font
13
+ $nav_font: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif
14
+ //link font size
15
+ $nav_font_size: 1rem
16
+ //link padding
17
+ $nav_link_padding: 1rem 1.5rem
18
+
19
+ $nav_bg_color: #fff
20
+
21
+ .current
22
+ border-bottom: 2px solid darken(rgba(45,204,165,1), 10%)
23
+ background-color: white
24
+ &:hover
25
+ border-bottom: none
26
+ -webkit-transition: none
27
+ -moz-transition: none
28
+ transition: none
29
+ a
30
+ color: darken(rgba(45,204,165,1), 5%)
31
+
32
+ nav
33
+ background-color: $nav_bg_color
34
+ border: 1px solid #dedede
35
+ border-radius: 4px
36
+ box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055)
37
+ color: #2a2a2a
38
+ display: block
39
+ overflow: hidden
40
+ width: 100%
41
+ font-size: 1rem
42
+ .mobile
43
+ display: none
44
+ &.fixed
45
+ position: fixed
46
+ top: 0
47
+ z-index: 2
48
+ ul
49
+ margin: 0
50
+ padding: 0
51
+ li
52
+ display: inline-block
53
+ list-style-type: none
54
+ +transition-fix(all 0.2s)
55
+ > ul > li
56
+ >
57
+ a > .caret
58
+ border-top: 4px solid #aaa
59
+ border-right: 4px solid transparent
60
+ border-left: 4px solid transparent
61
+ content: ""
62
+ display: inline-block
63
+ height: 0
64
+ width: 0
65
+ vertical-align: middle
66
+ +transition-fix(color 0.1s linear)
67
+ div ul > li > a > .caret
68
+ border-top: 4px solid #aaa
69
+ border-right: 4px solid transparent
70
+ border-left: 4px solid transparent
71
+ content: ""
72
+ display: inline-block
73
+ height: 0
74
+ width: 0
75
+ vertical-align: middle
76
+ +transition-fix(color 0.1s linear)
77
+ border-bottom: 4px solid transparent
78
+ border-top: 4px solid transparent
79
+ border-right: 4px solid transparent
80
+ border-left: 4px solid #f2f2f2
81
+ margin: 0 0 0 8px
82
+ a
83
+ color: #2a2a2a
84
+ display: block
85
+ line-height: 3.5rem
86
+ padding: 0 1.6rem
87
+ text-decoration: none
88
+ font-size: inherit
89
+ &:hover
90
+ background-color: $link_hover_bg_color
91
+ > a
92
+ color: rgb(255, 255, 255)
93
+ > .caret
94
+ border-top-color: rgb(255, 255, 255)
95
+ > div
96
+ display: block
97
+ opacity: 1
98
+ visibility: visible
99
+ > div
100
+ ul > li
101
+ &:hover > a > .caret
102
+ border-left-color: rgb(255, 255, 255)
103
+ > div
104
+ background-color: rgb(40, 44, 47)
105
+ border-top: 0
106
+ border-radius: 0 0 4px 4px
107
+ box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055)
108
+ display: none
109
+ margin: 0
110
+ opacity: 0
111
+ position: absolute
112
+ width: 165px
113
+ visibility: hidden
114
+ +transition-fix(opacity 0.2s)
115
+
116
+ background-color: rgb(40, 44, 47)
117
+ border-radius: 0 4px 4px 4px
118
+ box-shadow: inset 2px 0 5px rgba(0, 0, 0, 0.15)
119
+ margin-top: -42px
120
+ right: -165px
121
+ background-color: rgb(40, 44, 47)
122
+ border-top: 0
123
+ border-radius: 0 0 4px 4px
124
+ box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055)
125
+ display: none
126
+ margin: 0
127
+ opacity: 0
128
+ position: absolute
129
+ width: 165px
130
+ visibility: hidden
131
+ +transition-fix(opacity 0.2s)
132
+ > div ul > li
133
+ &:hover
134
+ > div
135
+ display: block
136
+ opacity: 1
137
+ visibility: visible
138
+ > a
139
+ background-color: $link_hover_bg_color
140
+ display: block
141
+ position: relative
142
+ >
143
+ div ul > li
144
+ display: block
145
+ position: relative
146
+ a, div ul > li > a
147
+ color: #fff
148
+ display: block
149
+ padding: .8rem 1.6rem
150
+ text-decoration: none
151
+ +tablet
152
+ nav
153
+ font-size: 1.2rem
154
+ .menu
155
+ display: none
156
+ .mobile
157
+ display: block
158
+ padding: .5% 0 .5% .5%
159
+ .menu-toggle
160
+ background-color: white
161
+ border: none
162
+ +border-radius(.4)
163
+ &:hover
164
+ background-color: none
165
+
166
+
167
+
168
+ +small-tablet
169
+ .menu-toggle
170
+ margin-bottom: 1%
171
+ li
172
+ width: 47%
@@ -0,0 +1,89 @@
1
+ /*=============================================================================
2
+ ** Reusable colors
3
+ **============================================================================
4
+ $green: rgba(46,204,113,0.22)
5
+ $yellow: #FFFF66
6
+ $red: #FF6666
7
+ $orange: #f39c12
8
+ $purple: #9966FF
9
+ $gray: #ecf0f1
10
+
11
+ /*=============================================================================
12
+ ** Variables
13
+ **============================================================================
14
+
15
+ $th_font_color: #222222 //table font color
16
+ $th_backg_color: $gray
17
+ $tbl_font: 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif
18
+
19
+
20
+ table
21
+ font: $tbl_font
22
+ border: 1px solid #ccc
23
+ width: 100%
24
+ margin: 0
25
+ padding: 0
26
+ border-collapse: collapse
27
+ border-spacing: 0
28
+ tr
29
+ border: 1px solid #ddd
30
+ padding: 5px
31
+ th, td
32
+ padding: 10px
33
+ text-align: center
34
+ th
35
+ text-transform: uppercase
36
+ letter-spacing: 1px
37
+ color: $th_font_color
38
+ background: $th_backg_color
39
+ font-size: 0.77778rem
40
+ font-weight: bold
41
+ padding: 0.44444rem 0.55556rem 0.55556rem
42
+ &.bordered
43
+ border-collapse: separate
44
+ border-spacing: 2px
45
+ &.alternate
46
+ tr:nth-child(even)
47
+ background: $gray
48
+ &.green
49
+ tr:nth-child(even)
50
+ background-color: $green
51
+ &.purple
52
+ tr:nth-child(even)
53
+ background: $purple
54
+ &.red
55
+ tr:nth-child(even)
56
+ background: $red
57
+ &.yellow
58
+ tr:nth-child(even)
59
+ background: $yellow
60
+ &.orange
61
+ tr:nth-child(even)
62
+ background: $orange
63
+
64
+
65
+ /*=============================================================================
66
+ ** Responsive Grids
67
+ **============================================================================
68
+
69
+ +small-tablet
70
+ table
71
+ border: 0
72
+ thead
73
+ display: none
74
+ tr
75
+ margin-bottom: 10px
76
+ display: block
77
+ border-bottom: 2px solid #ddd
78
+ td
79
+ display: block
80
+ text-align: right
81
+ font-size: 13px
82
+ border-bottom: 1px dotted #ccc
83
+ &:last-child
84
+ border-bottom: 0
85
+ &:before
86
+ content: attr(data-name)
87
+ float: left
88
+ text-transform: uppercase
89
+ font-weight: bold
@@ -0,0 +1,42 @@
1
+ /*=============================================================================
2
+ ** Main container
3
+ **============================================================================
4
+ .site-container
5
+ max-width: 90rem
6
+ @extend %default_prop
7
+
8
+ //mostly used if you have a fixed navbar
9
+ .start-content
10
+ @extend %default_prop
11
+ overflow: hidden
12
+
13
+ /*=============================================================================
14
+ ** Rows
15
+ **============================================================================
16
+ .row
17
+ margin: 0 auto
18
+ max-width: 55.55556rem
19
+ width: 100%
20
+ &:before
21
+ content: " "
22
+ display: table
23
+ &:after
24
+ content: " "
25
+ display: table
26
+ clear: both
27
+
28
+
29
+ /*=============================================================================
30
+ ** text box holder
31
+ **============================================================================
32
+ .content-box
33
+ padding: 1.5%
34
+
35
+ /*=============================================================================
36
+ ** DRY
37
+ **============================================================================
38
+
39
+ %default_prop
40
+ width: auto
41
+ margin: auto
42
+
@@ -0,0 +1,75 @@
1
+ /*=============================================================================
2
+ ** Grids (keep columns seperated to add width at will)
3
+ **============================================================================
4
+
5
+ .col
6
+ float: left
7
+ position: relative
8
+ .center
9
+ margin: 0 auto
10
+
11
+ @for $i from 1 through 18
12
+ .w-#{$i}
13
+ width: $i / 18 * 100%
14
+ .gap-l-#{$i}
15
+ margin-left: $i / 18 * 100%
16
+ .gap-r-#{$i}
17
+ margin-right: $i / 18 * 100%
18
+
19
+ .hide
20
+ display: none
21
+ .gap-none
22
+ margin-left: 0
23
+ margin-right: 0
24
+
25
+
26
+ /*=============================================================================
27
+ ** Responsive Grids
28
+ **============================================================================
29
+ +tablet
30
+ @for $i from 1 through 11
31
+ .w-#{$i}
32
+ width: 50%
33
+ @for $i from 12 through 18
34
+ .w-#{$i}
35
+ width: 100%
36
+
37
+ @for $i from 1 through 18
38
+ .tablet-#{$i}
39
+ width: $i / 18 * 100%
40
+ .gap-t-none
41
+ margin-left: 0
42
+ margin-right: 0
43
+ .tablet-hide
44
+ display: none
45
+
46
+ +small-tablet
47
+ @for $i from 1 through 4
48
+ .w-#{$i}
49
+ width: $i / 4 * 100%
50
+ @for $i from 5 through 9
51
+ .w-#{$i}
52
+ width: 100%
53
+
54
+ @for $i from 1 through 18
55
+ .sm-tablet-#{$i}
56
+ width: $i / 18 * 100%
57
+ .gap-sm-none
58
+ margin-left: 0
59
+ margin-right: 0
60
+ .sm-tablet-hide
61
+ display: none
62
+
63
+ +mobile
64
+ @for $i from 1 through 18
65
+ .w-#{$i}
66
+ width: 100%
67
+
68
+ @for $i from 1 through 18
69
+ .mobile-#{$i}
70
+ width: $i / 18 * 100%
71
+ .gap-m-none
72
+ margin-left: 0
73
+ margin-right: 0
74
+ .mobile-hide
75
+ display: none
@@ -0,0 +1,20 @@
1
+ $mobile-width: 30rem //480px
2
+ $tablet-width: 50rem //800px
3
+ $desktop-width: 64rem //1024px
4
+ $lg-desktop-width: 75rem //1200px
5
+
6
+ =lg-desktop
7
+ @media all and (min-width: #{$lg-desktop-width})
8
+ @content
9
+
10
+ =tablet
11
+ @media all and (max-width: #{$desktop-width - .063rem})
12
+ @content
13
+
14
+ =small-tablet
15
+ @media all and (max-width: #{$tablet-width - .063rem})
16
+ @content
17
+
18
+ =mobile
19
+ @media all and (max-width: #{$mobile-width - .063rem})
20
+ @content
@@ -0,0 +1,21 @@
1
+ html
2
+ font-size: 16px
3
+
4
+ h1
5
+ font-size: 3rem
6
+
7
+ h2
8
+ font-size: 2.5rem
9
+
10
+ h3
11
+ font-size: 2rem
12
+
13
+ h4
14
+ font-size: 1.5rem
15
+
16
+ p
17
+ font-size: 1rem
18
+
19
+ +lg-desktop
20
+ html
21
+ font-size: 17px
@@ -0,0 +1,97 @@
1
+ $i_color: #ecf0f1 // icon color
2
+ $s_color: #12664b // shadow color
3
+ $b_color: #27ae60 // background color
4
+ $b_radius: .5 // bg border radius
5
+
6
+ /*=============================================================================
7
+ ** Transform/transform
8
+ **============================================================================
9
+
10
+ =transform-style-fix($value)
11
+ -webkit-transform-style: $value
12
+ -moz-transform-style: $value
13
+ -ms-transform-style: $value
14
+ -o-transform-style: $value
15
+ transform-style: $value
16
+
17
+ =transform-fix($value)
18
+ -moz-transform: $value
19
+ -o-transform: $value
20
+ -webkit-transform: $value
21
+ -ms-transform: $value
22
+ transform: $value
23
+
24
+ =transition-fix($value)
25
+ -moz-transition: $value
26
+ -o-transition: $value
27
+ -webkit-transition: $value
28
+ -ms-transition: $value
29
+ transition: $value
30
+
31
+ /*=============================================================================
32
+ ** Flex box
33
+ **============================================================================
34
+
35
+ // =flex
36
+ // display: -webkit-box
37
+ // display: -moz-box
38
+ // display: -ms-flexbox
39
+ // display: -webkit-flex
40
+ // display: flex
41
+ // flex-flow: row wrap
42
+
43
+ // =flex-horizontal ($row: true)
44
+ // @if $row
45
+ // -webkit-flex-direction: row
46
+ // flex-direction: row
47
+ // @else
48
+ // -webkit-flex-direction: column
49
+ // flex-direction: column
50
+ /*=============================================================================
51
+ ** Rounded corners
52
+ **============================================================================
53
+
54
+ =border-radius ($bradius)
55
+ -webkit-border-radius: $bradius+rem
56
+ -moz-border-radius: $bradius+rem
57
+ -ms-border-radius: $bradius+rem
58
+ border-radius: $bradius+rem
59
+
60
+ /*=============================================================================
61
+ ** Box Shawdow
62
+ **============================================================================
63
+ =box-shadow($top, $left, $blur, $size, $color, $inset: false)
64
+ @if $inset
65
+ -webkit-box-shadow: inset $top $left $blur $size $color
66
+ -moz-box-shadow: inset $top $left $blur $size $color
67
+ box-shadow: inset $top $left $blur $size $color
68
+ -o-box-shadow: inset $top $left $blur $size $color
69
+ @else
70
+ -webkit-box-shadow: $top $left $blur $size $color
71
+ -moz-box-shadow: $top $left $blur $size $color
72
+ box-shadow: $top $left $blur $size $color
73
+ -o-box-shadow: inset $top $left $blur $size $color
74
+
75
+ /*=============================================================================
76
+ ** Long Shadow Flat Design + Icon size
77
+ **============================================================================
78
+ =long-shadow($scolor, $length)
79
+ $list: ()
80
+ @for $i from 1 through $length
81
+ $list: append($list, $scolor $i + px $i + px, comma)
82
+ text-shadow: $list
83
+
84
+ =icon-size($length)
85
+ text-align: center
86
+ overflow: hidden
87
+ width: $length + px
88
+ height: $length + px
89
+ font-size: $length / 2 + px
90
+ line-height: $length + px
91
+ background-color: $b_color
92
+ display: inline-block
93
+ color: $i_color
94
+ +long-shadow($s_color, $length)
95
+ +border-radius($b_radius)
96
+ @if $length <= 30
97
+ +border-radius(.4)