euphoria 0.1.0

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.
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 2d2378b520628a0e963c2edded23f7d6807f1fb4
4
+ data.tar.gz: 3745cb85baf85915356b13b0ee4fd06c9b5ff0b6
5
+ SHA512:
6
+ metadata.gz: c94219d759ff307d0001b42a53c0c589c5d63cf0ed066bd5d525f0ae66927b0c21dd67b2a312af264c425ec8553e87bf6a9fa046b9aece5a432113e8af171b34
7
+ data.tar.gz: a81c6e95b0b447cc0af59cb010c4029f2e6a8f603036192971a4a14b09e5f0b071ce08accbb754162bcdefd002a84e99d58ce4cb9f0d0353d042437eacf898c4
@@ -0,0 +1,9 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /Gemfile.lock
4
+ /_yardoc/
5
+ /coverage/
6
+ /doc/
7
+ /pkg/
8
+ /spec/reports/
9
+ /tmp/
data/.rspec ADDED
@@ -0,0 +1,2 @@
1
+ --format documentation
2
+ --color
@@ -0,0 +1,3 @@
1
+ language: ruby
2
+ rvm:
3
+ - 2.2.2
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in euphoria.gemspec
4
+ gemspec
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2015 paul brunache
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
@@ -0,0 +1,40 @@
1
+ # Euphoria
2
+
3
+ A lightweight css flex-grid framework to ease workflow. We hate IE
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ ```ruby
10
+ gem 'euphoria'
11
+ ```
12
+
13
+ And then execute:
14
+
15
+ $ bundle
16
+
17
+ Or install it yourself as:
18
+
19
+ $ gem install euphoria
20
+
21
+ ## Usage
22
+
23
+ TODO:
24
+
25
+ In the application.js add //= require UI-modules
26
+ In the application.js add *= require load
27
+
28
+ ## Development
29
+
30
+ After checking out the repo, run `bin/setup` to install dependencies. Then, run `bin/console` for an interactive prompt that will allow you to experiment.
31
+
32
+ To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release` to create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
33
+
34
+ ## Contributing
35
+
36
+ 1. Fork it ( https://github.com/[my-github-username]/euphoria/fork )
37
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
38
+ 3. Commit your changes (`git commit -am 'Add some feature'`)
39
+ 4. Push to the branch (`git push origin my-new-feature`)
40
+ 5. Create a new Pull Request
@@ -0,0 +1 @@
1
+ require "bundler/gem_tasks"
@@ -0,0 +1,26 @@
1
+ $(document).on 'page:change', ->
2
+ #######################################################################################
3
+ #set marging for fixed nav so content is visible
4
+ #######################################################################################
5
+ $(".menu-toggle").on "click", ->
6
+
7
+ if $(".tablet-menu .menu-toggle").hasClass("fa-bars")
8
+ $(".tablet-menu .menu-toggle").removeClass("fa-bars").addClass("fa-times")
9
+ else
10
+ $(".tablet-menu .menu-toggle").addClass("fa-bars").fadeIn().removeClass("fa-times")
11
+ $(".menu").slideToggle()
12
+
13
+ #on resize
14
+ #account for margin with fixed nav class
15
+ $(window).resize ->
16
+ if $('div').hasClass('menu-container fixed')
17
+ $('.start-content').css 'margin-top', $('.menu-container').height() + 10
18
+ if $(window).width() > 1023
19
+ $('.menu').removeAttr('style');
20
+
21
+ $(window).trigger 'resize'
22
+
23
+
24
+ #set marging for fixed nav so content is visible
25
+ $('[data-img-src]').css 'background-image', ->
26
+ bg = 'url(' + $(this).data('img-src')+')'
@@ -0,0 +1 @@
1
+ //= require ./UI-modules
@@ -0,0 +1,63 @@
1
+ /*=============================================================================
2
+ ** Variables
3
+ **==============================================================================
4
+ //Button Colors
5
+ $blue: #3498db
6
+ $green: #2ecc71
7
+ $red: #e74c3c
8
+ $grey: #bdc3c7
9
+ $white: #fff
10
+
11
+
12
+ /*=============================================================================
13
+ ** Button
14
+ **==============================================================================
15
+ .btn
16
+ text-align: center
17
+ border: 1px solid #e5e6e7
18
+ font-size: 1rem
19
+ padding: .5em
20
+ line-height: 1.375rem
21
+ letter-spacing: .1rem
22
+ text-transform: uppercase
23
+ text-decoration: none
24
+ white-space: nowrap
25
+ +border-radius (.5)
26
+ &.sm //Button size
27
+ font-size: 0.625rem
28
+ line-height: 1.675rem
29
+ &.lg
30
+ font-size: 1.625rem
31
+ line-height: 1.675rem
32
+ &.xl
33
+ font-size: 1.875rem
34
+ line-height: 1.875rem
35
+ &.blue //button color
36
+ background-color: $blue
37
+ border: 1px solid #3085d6
38
+ &:hover
39
+ background: #5b9ede
40
+ &.green
41
+ background-color: $green
42
+ border: 1px solid #5bde9b
43
+ &:hover
44
+ background: #46da8e
45
+ &.red
46
+ background-color: $red
47
+ border: 1px solid #c6282a
48
+ &:hover
49
+ background: #da4648
50
+ &.grey
51
+ background-color: $grey
52
+ border: 1px solid #a5a5a5
53
+ &:hover
54
+ background: #5b9ede
55
+ &.white
56
+ background-color: $white
57
+ border: 1px solid #cbcbcb
58
+ &:hover
59
+ background: #5b9ede
60
+
61
+ /*=============================================================================
62
+ **
63
+ **==============================================================================
@@ -0,0 +1,36 @@
1
+ $login_background: white
2
+ $form_border_color: #ddd
3
+ $sticky_label_color: black
4
+ $sticky_label_background: #ccc
5
+ $sticky_label_border: #ccc
6
+ .form
7
+ border: 1px solid $form_border_color
8
+ .form-row
9
+ width: 100%
10
+ margin: 1% 0
11
+ margin:auto
12
+ input[type="radio"]
13
+ display: inline
14
+ input[type="email"], input[type="password"]
15
+ +border-radius(.3)
16
+ margin: 0 1%
17
+ width: 98%
18
+ border: 1px solid #ddd
19
+
20
+ .login-form
21
+ background: $login_background
22
+ border: 1px solid $form_border_color
23
+ margin: 1%
24
+
25
+ input[type="checkbox"]
26
+ display: none
27
+ + label span
28
+ display: inline-block
29
+ width: 19px
30
+ height: 19px
31
+ margin: -1px 4px 0 0
32
+ vertical-align: middle
33
+ background: url(check_radio_sheet.png) left top no-repeat
34
+ cursor: pointer
35
+ &:checked + label span
36
+ background: url(check_radio_sheet.png) -19px top no-repeat
@@ -0,0 +1,106 @@
1
+ /*=============================================================================
2
+ ** Variables
3
+ **==============================================================================
4
+ //menu li border color
5
+ $li_border_color: #dfdfdf
6
+ //links hover color
7
+ $link_hover_color: rgba(0, 0, 0, 0.5)
8
+ /*======================================
9
+ ** Menu values
10
+ **=====================================
11
+ // menu's font
12
+ $menu_font: 'Lora', serif, Times
13
+ //link font size
14
+ $menu_font_size: 1rem
15
+ //link padding
16
+ $menu_link_padding: 1rem 1.5rem
17
+
18
+ /*=============================================================================
19
+ ** DRY
20
+ **==============================================================================
21
+
22
+ %menu_default
23
+ background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.95)
24
+ text-align: center
25
+ text-transform: uppercase
26
+ letter-spacing: 1px
27
+ list-style-type: none
28
+ +flex
29
+ +flex-horizontal
30
+ align-items: center
31
+ justify-content: center
32
+ li
33
+ +flex
34
+ align-items: center
35
+ justify-content: center
36
+ a
37
+ padding: $menu_link_padding
38
+ font-family: $menu_font
39
+ &:hover
40
+ color: $link_hover_color
41
+ &.bordered
42
+ li
43
+ border-right: 1px solid $li_border_color
44
+
45
+ &.active-bottom
46
+ border-bottom: 2px solid #98F5FF
47
+ &.vertical
48
+ +flex-horizontal(false)
49
+ &.left
50
+ justify-content: flex-start
51
+ &.right
52
+ justify-content: flex-end
53
+ /*=============================================================================
54
+ ** Mobile Menu
55
+ **==============================================================================
56
+
57
+ .tablet-menu
58
+ @extend %menu_default
59
+ display: none
60
+ a
61
+ font-size: $menu_font_size
62
+ /*=============================================================================
63
+ ** Regular Menu
64
+ **==============================================================================
65
+
66
+ .menu
67
+ @extend %menu_default
68
+
69
+ /*=============================================================================
70
+ ** Responsive
71
+ **==============================================================================
72
+
73
+ +tablet
74
+ .tablet-menu
75
+ width: 95%
76
+ margin: auto
77
+ +flex
78
+ +flex-horizontal
79
+ align-items: center
80
+ justify-content: flex-start
81
+ li
82
+ &.menu-toggle
83
+ z-index
84
+ width: 100%
85
+ border-bottom: 1px solid $li_border_color
86
+ justify-content: flex-start
87
+ padding: .3rem 0
88
+
89
+ margin-right: 2%
90
+ a
91
+ padding: 1rem
92
+ .menu
93
+ display: none
94
+ li
95
+ +flex-horizontal(false)
96
+ width: 100%
97
+ &.bordered
98
+ li
99
+ border-bottom: 1px solid $li_border_color
100
+
101
+ +small-tablet
102
+ .menu-toggle
103
+ margin-bottom: 1%
104
+ li
105
+ width: 47%
106
+
@@ -0,0 +1,89 @@
1
+ /*=============================================================================
2
+ ** Reusable colors
3
+ **============================================================================
4
+ $green: #33FF99
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,53 @@
1
+ //Menu container variable
2
+ $menu_bg: #fff
3
+
4
+ /*=============================================================================
5
+ ** Main container
6
+ **============================================================================
7
+ .site-container
8
+ max-width: 75rem
9
+ @extend %default_prop
10
+
11
+ //mostly used if you have a fixed navbar
12
+ .start-content
13
+ @extend %default_prop
14
+ z-index: -1
15
+ overflow: hidden
16
+
17
+ /*=============================================================================
18
+ ** Rows
19
+ **============================================================================
20
+ .row
21
+ @extend %default_prop
22
+ margin-bottom: 1%
23
+ +flex
24
+ +flex-horizontal
25
+
26
+ /*=============================================================================
27
+ ** Menu
28
+ **============================================================================
29
+ .menu-container
30
+ @extend %default_prop
31
+ background-color: $menu_bg
32
+ min-height: 50px
33
+ box-shadow: 0 2px 10px 0 rgba(0,0,0,0.16)
34
+ margin-bottom: 5%
35
+ &.fixed
36
+ position: fixed
37
+ top: 0
38
+ left: 0
39
+
40
+ /*=============================================================================
41
+ ** text box holder
42
+ **============================================================================
43
+ .content-box
44
+ padding: 1.5%
45
+
46
+ /*=============================================================================
47
+ ** DRY
48
+ **============================================================================
49
+
50
+ %default_prop
51
+ width: 100%
52
+ margin: auto
53
+
@@ -0,0 +1,54 @@
1
+ /*=============================================================================
2
+ ** Grids
3
+ **============================================================================
4
+
5
+ @for $i from 1 through 18
6
+ .c-#{$i}
7
+ width: $i / 18 * 100%
8
+
9
+ /*=============================================================================
10
+ ** spaces or gaps
11
+ **============================================================================
12
+ @for $i from 1 through 18
13
+ .space-l-#{$i}
14
+ width: $i / 18 * 100%
15
+ .space-r-#{$i}
16
+ width: $i / 18 * 100%
17
+
18
+
19
+ /*=============================================================================
20
+ ** Responsive Grids
21
+ **============================================================================
22
+ +tablet
23
+ @for $i from 1 through 11
24
+ .c-#{$i}
25
+ width: 50%
26
+ @for $i from 12 through 18
27
+ .c-#{$i}
28
+ width: 100%
29
+
30
+ @for $i from 1 through 18
31
+ .tablet-#{$i}
32
+ width: $i / 18 * 100%
33
+
34
+ +small-tablet
35
+ @for $i from 1 through 4
36
+ .c-#{$i}
37
+ width: $i / 4 * 100%
38
+ @for $i from 5 through 9
39
+ .c-#{$i}
40
+ width: 100%
41
+
42
+ @for $i from 1 through 18
43
+ .sm-tablet-#{$i}
44
+ width: $i / 18 * 100%
45
+
46
+ +mobile
47
+ @for $i from 1 through 18
48
+ .c-#{$i}
49
+ width: 100%
50
+
51
+ @for $i from 1 through 18
52
+ .mobile-#{$i}
53
+ width: $i / 18 * 100%
54
+
@@ -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,31 @@
1
+ html
2
+ font-size: 17px
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: 18px
22
+
23
+
24
+ +tablet
25
+ html
26
+ font-size: 16px
27
+
28
+
29
+ +mobile
30
+ html
31
+ font-size: 15px
@@ -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)
@@ -0,0 +1,64 @@
1
+ body, html
2
+ overflow: hidden
3
+
4
+ html
5
+ -webkit-font-smoothing: antialiased
6
+ -moz-osx-font-smoothing: grayscale
7
+ height: 100%
8
+ body
9
+ margin: 0
10
+ padding: 0
11
+
12
+
13
+ h1,
14
+ h2,
15
+ h3,
16
+ h4,
17
+ p,
18
+ blockquote,
19
+ figure,
20
+ ol,
21
+ ul
22
+ margin: 0
23
+ padding: 0
24
+
25
+ li
26
+ display: block
27
+
28
+ h1,
29
+ h2,
30
+ h3,
31
+ h4
32
+ font-size: inherit
33
+
34
+ a
35
+ text-decoration: none
36
+ color: inherit
37
+ -webkit-transition: .3s
38
+ -moz-transition: .3s
39
+ transition: .3s
40
+
41
+ img
42
+ max-width: 100%
43
+ height: auto
44
+ border: 0
45
+
46
+ input[type="text"],
47
+ input[type="url"],
48
+ input[type="tel"],
49
+ input[type="email"],
50
+ input[type="password"]
51
+ -webkit-box-sizing: border-box
52
+ -moz-box-sizing: border-box
53
+ box-sizing: border-box
54
+ margin: 0
55
+ max-width: 100%
56
+ line-height: 1
57
+ padding: 1%
58
+
59
+
60
+ button,input,optgroup,select,textarea
61
+ color: inherit
62
+ font: inherit
63
+ margin: 0
64
+
@@ -0,0 +1,3 @@
1
+ /*
2
+ *= require load
3
+ */
@@ -0,0 +1,95 @@
1
+ .parallax
2
+ -webkit-perspective: 300px
3
+ perspective: 300px
4
+ height: 100vh
5
+ overflow-x: hidden
6
+ overflow-y: auto
7
+ font-size: 200%
8
+ .parallax-group--header
9
+ height: 100vh
10
+ -webkit-transform: translateZ(-300px) scale(2)
11
+ transform: translateZ(-300px) scale(2)
12
+ background-size: 100% 100% / cover
13
+
14
+ .parallax-group
15
+ min-height: 90vh
16
+ position: relative
17
+ -webkit-transform-style: preserve-3d
18
+ transform-style: preserve-3d
19
+ -webkit-transition: -webkit-transform 0.5s ease 0s
20
+ transition: transform 0.5s ease 0s
21
+ &:nth-child(odd)
22
+ z-index: 2
23
+ &:nth-child(even)
24
+ z-index: 0
25
+
26
+
27
+ .parallax-layer
28
+ position: absolute
29
+ top: 0
30
+ left: 0
31
+ right: 0
32
+ bottom: 0
33
+ text-align: center
34
+
35
+ &.parallax-back
36
+ -webkit-transform: translateZ(-300px) scale(2)
37
+ transform: translateZ(-300px) scale(2)
38
+ background-size: 100% 100% / cover
39
+ height: 100vh
40
+
41
+ &.fix
42
+ background-image: url("http://3.bp.blogspot.com/-ck7oCUJbjL8/U3gfVP5GHiI/AAAAAAAAGvc/aB1Gu04uTVs/s1600/watchmen+01.jpg")
43
+ z-index: 2
44
+ -webkit-transform: translateZ(0)
45
+ transform: translateZ(0)
46
+
47
+ &.parallax-face
48
+ -webkit-transform: translateZ(0)
49
+ transform: translateZ(0)
50
+
51
+ h1
52
+ position: absolute
53
+ top: 50%
54
+ left: 50%
55
+ -webkit-transform: translateX(-50%) translateY(-50%)
56
+ -ms-transform: translateX(-50%) translateY(-50%)
57
+ transform: translateX(-50%) translateY(-50%)
58
+ &.light
59
+ line-height: 100vh
60
+ background-color: rgba(255, 255, 255, 0.5)
61
+ width: 100%
62
+ &.dark
63
+ opacity: 0.5
64
+
65
+ /*=============================================================================
66
+ ** Template must proceed as face and back
67
+ **============================================================================
68
+ .parallax
69
+ .parallax-group
70
+ .parallax-layer.parallax-face data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
71
+ h1.light First layer front
72
+ .parallax-group
73
+ .parallax-layer.parallax-back data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
74
+ h1.dark Second layer back
75
+ .parallax-layer.parallax-face
76
+ .parallax-group
77
+ .parallax-layer.parallax-back.fix data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
78
+ h1.dark Thrird layer back
79
+ .parallax-layer.parallax-face.fix
80
+ .parallax-group
81
+ .parallax-layer.parallax-back data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
82
+ h1.dark Second layer back
83
+ .parallax-layer.parallax-face
84
+ .parallax-group
85
+ .parallax-layer.parallax-back.fix data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
86
+ h1.dark Thrird layer back
87
+ .parallax-layer.parallax-face.fix
88
+ .parallax-group
89
+ .parallax-layer.parallax-back data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
90
+ h1.dark Second layer back
91
+ .parallax-layer.parallax-face
92
+ .parallax-group
93
+ .parallax-layer.parallax-back.fix data-img-src="http://data.techtimes.com/data/images/full/14563/batman-arkham-knight-gamescom-5-jpg.jpg"
94
+ h1.dark Thrird layer back
95
+ .parallax-layer.parallax-face.fix
@@ -0,0 +1,14 @@
1
+ @import "helpers/reset.sass"
2
+ @import "helpers/mixins.sass"
3
+
4
+ @import "core/responsive.sass"
5
+ @import "core/containers.sass"
6
+ @import "core/grids.sass"
7
+ @import "core/type.sass"
8
+
9
+ @import "components/buttons.sass"
10
+ @import "components/forms.sass"
11
+ @import "components/menus.sass"
12
+ @import "components/tables.sass"
13
+
14
+ @import "interface/parallax.sass"
@@ -0,0 +1,14 @@
1
+ #!/usr/bin/env ruby
2
+
3
+ require "bundler/setup"
4
+ require "euphoria"
5
+
6
+ # You can add fixtures and/or initialization code here to make experimenting
7
+ # with your gem easier. You can also use a different console, if you like.
8
+
9
+ # (If you use this, don't forget to add pry to your Gemfile!)
10
+ # require "pry"
11
+ # Pry.start
12
+
13
+ require "irb"
14
+ IRB.start
@@ -0,0 +1,7 @@
1
+ #!/bin/bash
2
+ set -euo pipefail
3
+ IFS=$'\n\t'
4
+
5
+ bundle install
6
+
7
+ # Do any other automated setup that you need to do here
@@ -0,0 +1,27 @@
1
+ # coding: utf-8
2
+ lib = File.expand_path('../lib', __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require 'euphoria/version'
5
+
6
+ Gem::Specification.new do |spec|
7
+ spec.name = "euphoria"
8
+ spec.version = Euphoria::VERSION
9
+ spec.authors = ["paul brunache"]
10
+ spec.email = ["paulbrunache@gmail.com"]
11
+
12
+ spec.summary = %q{Yet another grid framework for the web built with components from flexbox}
13
+
14
+ spec.homepage = "https://github.com/PaulBrunache/Euphoria"
15
+ spec.license = "MIT"
16
+
17
+ spec.files = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
18
+ spec.bindir = "exe"
19
+ spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
20
+ spec.require_paths = ["lib"]
21
+
22
+ spec.add_development_dependency "bundler", "~> 1.9"
23
+ spec.add_development_dependency "rake", "~> 10.0"
24
+ spec.add_development_dependency "sass-rails", "~> 5.0.1"
25
+ spec.add_development_dependency "coffee-rails", "~> 4.1.0"
26
+ spec.add_development_dependency "font-awesome-rails", "~> 4.3.0.0"
27
+ end
@@ -0,0 +1,8 @@
1
+ require "euphoria/version"
2
+
3
+ module Euphoria
4
+ module Rails
5
+ class Engine < ::Rails::Engine
6
+ end
7
+ end
8
+ end
@@ -0,0 +1,3 @@
1
+ module Euphoria
2
+ VERSION = "0.1.0"
3
+ end
metadata ADDED
@@ -0,0 +1,141 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: euphoria
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.1.0
5
+ platform: ruby
6
+ authors:
7
+ - paul brunache
8
+ autorequire:
9
+ bindir: exe
10
+ cert_chain: []
11
+ date: 2015-05-17 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: bundler
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '1.9'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '1.9'
27
+ - !ruby/object:Gem::Dependency
28
+ name: rake
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '10.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '10.0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: sass-rails
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: 5.0.1
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: 5.0.1
55
+ - !ruby/object:Gem::Dependency
56
+ name: coffee-rails
57
+ requirement: !ruby/object:Gem::Requirement
58
+ requirements:
59
+ - - "~>"
60
+ - !ruby/object:Gem::Version
61
+ version: 4.1.0
62
+ type: :development
63
+ prerelease: false
64
+ version_requirements: !ruby/object:Gem::Requirement
65
+ requirements:
66
+ - - "~>"
67
+ - !ruby/object:Gem::Version
68
+ version: 4.1.0
69
+ - !ruby/object:Gem::Dependency
70
+ name: font-awesome-rails
71
+ requirement: !ruby/object:Gem::Requirement
72
+ requirements:
73
+ - - "~>"
74
+ - !ruby/object:Gem::Version
75
+ version: 4.3.0.0
76
+ type: :development
77
+ prerelease: false
78
+ version_requirements: !ruby/object:Gem::Requirement
79
+ requirements:
80
+ - - "~>"
81
+ - !ruby/object:Gem::Version
82
+ version: 4.3.0.0
83
+ description:
84
+ email:
85
+ - paulbrunache@gmail.com
86
+ executables: []
87
+ extensions: []
88
+ extra_rdoc_files: []
89
+ files:
90
+ - ".gitignore"
91
+ - ".rspec"
92
+ - ".travis.yml"
93
+ - Gemfile
94
+ - LICENSE.txt
95
+ - README.md
96
+ - Rakefile
97
+ - assets/javascripts/interface/UI-modules.coffee
98
+ - assets/javascripts/interface/index.js
99
+ - assets/stylesheets/euphoria css/components/_buttons.sass
100
+ - assets/stylesheets/euphoria css/components/_forms.sass
101
+ - assets/stylesheets/euphoria css/components/_menus.sass
102
+ - assets/stylesheets/euphoria css/components/_tables.sass
103
+ - assets/stylesheets/euphoria css/core/_containers.sass
104
+ - assets/stylesheets/euphoria css/core/_grids.sass
105
+ - assets/stylesheets/euphoria css/core/_responsive.sass
106
+ - assets/stylesheets/euphoria css/core/_type.sass
107
+ - assets/stylesheets/euphoria css/helpers/_mixins.sass
108
+ - assets/stylesheets/euphoria css/helpers/_reset.sass
109
+ - assets/stylesheets/euphoria css/index.css
110
+ - assets/stylesheets/euphoria css/interface/parallax.sass
111
+ - assets/stylesheets/euphoria css/load.sass
112
+ - bin/console
113
+ - bin/setup
114
+ - euphoria.gemspec
115
+ - lib/euphoria.rb
116
+ - lib/euphoria/version.rb
117
+ homepage: https://github.com/PaulBrunache/Euphoria
118
+ licenses:
119
+ - MIT
120
+ metadata: {}
121
+ post_install_message:
122
+ rdoc_options: []
123
+ require_paths:
124
+ - lib
125
+ required_ruby_version: !ruby/object:Gem::Requirement
126
+ requirements:
127
+ - - ">="
128
+ - !ruby/object:Gem::Version
129
+ version: '0'
130
+ required_rubygems_version: !ruby/object:Gem::Requirement
131
+ requirements:
132
+ - - ">="
133
+ - !ruby/object:Gem::Version
134
+ version: '0'
135
+ requirements: []
136
+ rubyforge_project:
137
+ rubygems_version: 2.4.5
138
+ signing_key:
139
+ specification_version: 4
140
+ summary: Yet another grid framework for the web built with components from flexbox
141
+ test_files: []