flexy-gem 1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +15 -0
- data/CHANGELOG.md +0 -0
- data/README.md +4 -0
- data/lib/flexy-gem.rb +30 -0
- data/stylesheets/_flexy-gem.scss +40 -0
- data/templates/project/_flexy-demo.scss +59 -0
- data/templates/project/manifest.rb +22 -0
- metadata +77 -0
checksums.yaml
ADDED
@@ -0,0 +1,15 @@
|
|
1
|
+
---
|
2
|
+
!binary "U0hBMQ==":
|
3
|
+
metadata.gz: !binary |-
|
4
|
+
MjViYTFjOWExMGI1NmVjYTk4ZGJjNjI0MDFlYTY0MzQ5ZTM3NmVjMw==
|
5
|
+
data.tar.gz: !binary |-
|
6
|
+
Zjk2OGZkNjhmZGY3NzkwNzNlN2RkYzQyY2I3MjJlNmQwN2M0OWY5Mg==
|
7
|
+
SHA512:
|
8
|
+
metadata.gz: !binary |-
|
9
|
+
YTk1NWI2MGE0NTk1MmY2M2FjNDBhMjI2YTdjNjUzNGZhZTY3OTM1ZjlkYjI4
|
10
|
+
MDZkODkzMTZkMTg2ZmRmNTAzOTNlYmM0YzA1YWQ5ZGFmMjI3NzE5NTAzOTc1
|
11
|
+
MDYzMGIyYzdlODhkN2IxNzdlZjA1YTFjZDRkYWZhYjFlZDJiYWU=
|
12
|
+
data.tar.gz: !binary |-
|
13
|
+
YjU1YWM0MWNkMjg1ZTliOTM1YWQ0ZmZkNmZmZjRlMmY5NDk4OTlmYmJlMjk4
|
14
|
+
ZDE2MzRiMTg3NzAxZWQwN2EyNTIzNWU5MzdmZGNlNjgwZTNlM2I5MjRmMDhi
|
15
|
+
MjBjYzljMmU0NGVjM2EzZmE3MTk5ZDYwOWI4NTY0YWU3NTQ2MDk=
|
data/CHANGELOG.md
ADDED
File without changes
|
data/README.md
ADDED
data/lib/flexy-gem.rb
ADDED
@@ -0,0 +1,30 @@
|
|
1
|
+
# All gems that are required for this extension to work should go here.
|
2
|
+
# These are the requires you would normally put in your config.rb file
|
3
|
+
# By default, you should always included Compass. Do not include your
|
4
|
+
# extension.
|
5
|
+
require 'compass'
|
6
|
+
|
7
|
+
# This tells Compass what your Compass extension is called, and where to find
|
8
|
+
# its files
|
9
|
+
# Replace 'extension' with the name of your extension. Spaces allowed.
|
10
|
+
extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
|
11
|
+
Compass::Frameworks.register('flexy-gem', :path => extension_path)
|
12
|
+
|
13
|
+
# Version and date of version for your Compass extension.
|
14
|
+
# Replace Extension with the name of your extension
|
15
|
+
# Letters, numbers, and underscores only
|
16
|
+
# Version is a number. If a version contains alphas, it will be created as
|
17
|
+
# a prerelease version
|
18
|
+
# Date is in the form of YYYY-MM-DD
|
19
|
+
module Flexygem
|
20
|
+
VERSION = "1.0"
|
21
|
+
DATE = "2015-02-09"
|
22
|
+
end
|
23
|
+
|
24
|
+
# This is where any custom SassScript should be placed. The functions will be
|
25
|
+
# available on require of your extension without the need for users to import
|
26
|
+
# any partials. Uncomment below.
|
27
|
+
|
28
|
+
# module Sass::Script::Functions
|
29
|
+
#
|
30
|
+
# end
|
@@ -0,0 +1,40 @@
|
|
1
|
+
@import "compass/css3/shared";
|
2
|
+
|
3
|
+
$flexy-support: not -moz, -webkit, not -o, not -ms, official !default;
|
4
|
+
|
5
|
+
@mixin flexy(
|
6
|
+
$el: li,
|
7
|
+
$direction: null,
|
8
|
+
$align: null,
|
9
|
+
$justify: null,
|
10
|
+
$flex: null) {
|
11
|
+
|
12
|
+
// Establish the flex formatting context
|
13
|
+
@include experimental-value(display, flex, $flexy-support...);
|
14
|
+
|
15
|
+
// Set a flex-direction
|
16
|
+
@include experimental(flex-direction, $direction, $flexy-support...);
|
17
|
+
|
18
|
+
// Align flex items
|
19
|
+
@include experimental(align-items, $align, $flexy-support...);
|
20
|
+
|
21
|
+
// Define the flex container alignment and distribution of space
|
22
|
+
@include experimental(justify-content, $justify, $flexy-support...);
|
23
|
+
|
24
|
+
// Target flex items and define a flex value
|
25
|
+
& > #{$el} {
|
26
|
+
@include experimental(flex, $flex, $flexy-support...);
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
@mixin flexy-grow($item, $amt) {
|
31
|
+
// Define the flex grow factor of a flex item
|
32
|
+
& > :nth-child(#{$item}) {
|
33
|
+
@include experimental(flex-grow, $amt, $flexy-support...);
|
34
|
+
}
|
35
|
+
}
|
36
|
+
|
37
|
+
@mixin flexy-order($order) {
|
38
|
+
// Set the layout of a flex item
|
39
|
+
@include experimental(order, $order, $flexy-support...);
|
40
|
+
}
|
@@ -0,0 +1,59 @@
|
|
1
|
+
// Import Flexy and you're ready to go!
|
2
|
+
|
3
|
+
@import "flexy-gem";
|
4
|
+
|
5
|
+
///////////////////////////////
|
6
|
+
// Flexy Variables ///////////
|
7
|
+
/////////////////////////////
|
8
|
+
|
9
|
+
// Config variable for setting flexbox support
|
10
|
+
$flexy-support: not -moz, -webkit, not -o, not -ms, official;
|
11
|
+
|
12
|
+
//////////////////////////////
|
13
|
+
// Flexy Mixins /////////////
|
14
|
+
////////////////////////////
|
15
|
+
|
16
|
+
// Establish flexbox layout with default all values
|
17
|
+
@include flexy;
|
18
|
+
|
19
|
+
// Optional Arguments
|
20
|
+
@include flexy($el, $direction, $align, $justify, $flex);
|
21
|
+
|
22
|
+
// $el - Defines the element or class to target as flex items
|
23
|
+
// $direction - Set the flex-direction
|
24
|
+
// $align - Align flex items
|
25
|
+
// $justify - Set the flex container alignment
|
26
|
+
// $flex - Set the flex value for flex items
|
27
|
+
|
28
|
+
// Variable Defaults
|
29
|
+
|
30
|
+
// $el: li
|
31
|
+
// $direction: row
|
32
|
+
// $align: stretch
|
33
|
+
// $justify: flex-start
|
34
|
+
// $flex: 0 1 auto
|
35
|
+
|
36
|
+
// Target a specific flex item and apply a flex-grow
|
37
|
+
@include flexy-grow($item, $amt);
|
38
|
+
|
39
|
+
// Change the order of flex items
|
40
|
+
@include flexy-order($order);
|
41
|
+
|
42
|
+
//////////////////////////////
|
43
|
+
// Examples /////////////////
|
44
|
+
////////////////////////////
|
45
|
+
|
46
|
+
.main-nav {
|
47
|
+
@include flexy($align: center, $flex: 1);
|
48
|
+
@include flexy-grow(2, 3);
|
49
|
+
}
|
50
|
+
.content-row {
|
51
|
+
@include flexy(".col", $flex: 1);
|
52
|
+
@include flexy-grow(1, 2);
|
53
|
+
.secondary-content {
|
54
|
+
@include flexy-order(3);
|
55
|
+
}
|
56
|
+
.extra-content {
|
57
|
+
@include flexy-order(2);
|
58
|
+
}
|
59
|
+
}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
# Description
|
2
|
+
description "A simple Flexbox Compass extension";
|
3
|
+
|
4
|
+
# Stylesheet Import
|
5
|
+
file '_flexy-demo.scss', :like => :stylesheet, :media => 'screen, projection'
|
6
|
+
|
7
|
+
# Javascript Import
|
8
|
+
# file 'scripts.js', :like => :javascript, :to => 'scripts.js'
|
9
|
+
|
10
|
+
# General File Import
|
11
|
+
# file 'README.md', :to => "README.md"
|
12
|
+
|
13
|
+
# Compass Extension Help
|
14
|
+
help %Q{
|
15
|
+
Open flexy-demo.scss for help and examples.
|
16
|
+
}
|
17
|
+
|
18
|
+
# Compass Extension Welcome Message
|
19
|
+
# Users will see this when they create a new project using this template.
|
20
|
+
welcome_message %Q{
|
21
|
+
You have successfully installed the Flexy demo! Open _flexy-demo.scss for examples.
|
22
|
+
}
|
metadata
ADDED
@@ -0,0 +1,77 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: flexy-gem
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: '1.0'
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Richard Huf
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2015-02-09 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: sass
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - ! '>='
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: 3.2.0
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - ! '>='
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: 3.2.0
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: compass
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ! '>='
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: 0.12.1
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ! '>='
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: 0.12.1
|
41
|
+
description: A simple Flexbox Compass extension.
|
42
|
+
email:
|
43
|
+
- richardhuf84@gmail.com
|
44
|
+
executables: []
|
45
|
+
extensions: []
|
46
|
+
extra_rdoc_files: []
|
47
|
+
files:
|
48
|
+
- CHANGELOG.md
|
49
|
+
- README.md
|
50
|
+
- lib/flexy-gem.rb
|
51
|
+
- stylesheets/_flexy-gem.scss
|
52
|
+
- templates/project/_flexy-demo.scss
|
53
|
+
- templates/project/manifest.rb
|
54
|
+
homepage: https://github.com/richardhuf84/Flexy
|
55
|
+
licenses: []
|
56
|
+
metadata: {}
|
57
|
+
post_install_message:
|
58
|
+
rdoc_options: []
|
59
|
+
require_paths:
|
60
|
+
- lib
|
61
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
62
|
+
requirements:
|
63
|
+
- - ! '>='
|
64
|
+
- !ruby/object:Gem::Version
|
65
|
+
version: '0'
|
66
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
67
|
+
requirements:
|
68
|
+
- - ! '>='
|
69
|
+
- !ruby/object:Gem::Version
|
70
|
+
version: 1.3.6
|
71
|
+
requirements: []
|
72
|
+
rubyforge_project: flexy-gem
|
73
|
+
rubygems_version: 2.2.2
|
74
|
+
signing_key:
|
75
|
+
specification_version: 4
|
76
|
+
summary: Using Flexbox has never been easier!
|
77
|
+
test_files: []
|