GIPainter-helpers 0.2.3 → 0.2.5

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: ac2258976f6dcfd23654d8955e9f242450d71883
4
- data.tar.gz: 56a505219563c6d7392764b9d8b1bbe2247ede63
3
+ metadata.gz: e88d8f82165f0a4b2201e3290257a96d94a45b6c
4
+ data.tar.gz: 79aa0326e57588d607d9d1d81e730f2b4d29cbb8
5
5
  SHA512:
6
- metadata.gz: 1c07e9c3641b89d9dd8e00a4b71b7bdcdf2b0afb6fab777eda233d708583d80144feed82aa2b4fdc3f33543e56e2b84805edc4869b9cff705ecc00fecb4db1e7
7
- data.tar.gz: f14f0fce3c642d56e951b83338fea3f4a6e26a5778da4d9d05bfd865028ea78bc8b15cb58e6089ae5c68f9ee749b1b483d030ea9df4c24f93facdb34b974cbd3
6
+ metadata.gz: 94b130c488b5df65e1603908e725e43e59e53984d8548569c868b70c78674769b87eac57cb8d1d4e09c69c6e6624f06cdd3404b24b86b9ecc9ee816b08857822
7
+ data.tar.gz: e4b76cd24fca6ff2bddd304d7504ee68328bda6dcec9da1c83c78b7083d9055f623f714bb0efd7168b7ad14254f707a52351d4334f7a7389db3ce2d381857c70
data/README.md CHANGED
@@ -1,41 +1,41 @@
1
- # GIPainter::Helpers
2
-
3
- Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/GIPainter/helpers`. To experiment with that code, run `bin/console` for an interactive prompt.
4
-
5
- TODO: Delete this and the text above, and describe your gem
6
-
7
- ## Installation
8
-
9
- Add this line to your application's Gemfile:
10
-
11
- ```ruby
12
- gem 'GIPainter-helpers'
13
- ```
14
-
15
- And then execute:
16
-
17
- $ bundle
18
-
19
- Or install it yourself as:
20
-
21
- $ gem install GIPainter-helpers
22
-
23
- ## Usage
24
-
25
- TODO: Write usage instructions here
26
-
27
- ## Development
28
-
29
- After checking out the repo, run `bin/setup` to install dependencies. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
30
-
31
- 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`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
32
-
33
- ## Contributing
34
-
35
- Bug reports and pull requests are welcome on GitHub at https://github.com/aprioul/GIPainter-helpers.
36
-
37
-
38
- ## License
39
-
40
- The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
41
-
1
+ # GIPainter::Helpers
2
+
3
+ Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/GIPainter-helpers`. To experiment with that code, run `bin/console` for an interactive prompt.
4
+
5
+ TODO: Delete this and the text above, and describe your gem
6
+
7
+ ## Installation
8
+
9
+ Add this line to your application's Gemfile:
10
+
11
+ ```ruby
12
+ gem 'GIPainter-helpers'
13
+ ```
14
+
15
+ And then execute:
16
+
17
+ $ bundle
18
+
19
+ Or install it yourself as:
20
+
21
+ $ gem install GIPainter-helpers
22
+
23
+ ## Usage
24
+
25
+ TODO: Write usage instructions here
26
+
27
+ ## Development
28
+
29
+ After checking out the repo, run `bin/setup` to install dependencies. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
30
+
31
+ 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`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
32
+
33
+ ## Contributing
34
+
35
+ Bug reports and pull requests are welcome on GitHub at https://github.com/aprioul/GIPainter-helpers.
36
+
37
+
38
+ ## License
39
+
40
+ The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
41
+
@@ -1,102 +1,58 @@
1
- @import "compass/css3";
2
- @import "colors";
3
-
4
- //-----------------------------------
5
- // HELPER
6
- // BORDERS CLASSES GENERATION
7
- //-----------------------------------
8
-
9
- ////
10
- /// @access public
11
- /// @group Borders
12
- ////
13
-
14
- //** Default positions
15
- /// Generate all border positions
16
- /// @example css - class="border-(pos*)-(size)-(color)"
17
- /// .border-3-black {
18
- /// border: 3px solid #000;
19
- /// }
20
- /// // ! Max Border size Value : 5
21
- /// //* is optionnal
22
- $border_positionANDcolors: (
23
- border:"",
24
- border-top: "top",
25
- border-right: "right",
26
- border-bottom: "bottom",
27
- border-left: "left"
28
- );
29
-
30
- /*----------------
31
- Borders
32
- ----------------*/
33
- $max-border-size : 5;
34
-
35
- @for $i from 1 through $max-border-size{
36
- @each $nameC, $valueC in $merge_colors {
37
- @each $name, $value in $border_positionANDcolors {
38
- .#{"" + $name}-#{"" + $i}-#{"" + $nameC} {
39
- #{$name}: $i + px solid #{"" + $valueC};
40
- }
41
- }
42
- }
43
- }
44
- .border-none{
45
- border: none;
46
- }
47
-
48
-
49
- /// Generate all border radius
50
- /// @example css - class="border-(pos*)-radius-(size)"
51
- /// .border-top-left-radius-3 {
52
- /// border-top-left-radius: 3px;
53
- /// -webkit-border-top-left-radius: 3px;
54
- /// -moz-border-radius-topleft: 3px;
55
- /// }
56
- /// // ! Max Radius Value : 5
57
- /// //* is optionnal
58
-
59
- $border_radius: (
60
- border:"",
61
- border-top-left: "topleft",
62
- border-top-right: "topright",
63
- border-bottom-left: "bottomleft",
64
- border-bottom-right: "bottomright"
65
- );
66
-
67
- /*----------------
68
- Borders Radius
69
- ----------------*/
70
- $max-border-radius : 5;
71
-
72
- //@for $i from 1 through $max-border-radius{
73
- // @each $name, $value in $border_radius {
74
- // .#{"" + $name}-radius-#{"" + $i} {
75
- // #{"" + $name}-radius: $i + px;
76
- // -webkit-#{"" + $name}-radius: $i + px;
77
- // @if $value != ""{
78
- // -moz-border-radius-#{"" + $value}: $i + px;
79
- // }
80
- // @else{
81
- // -moz-border-radius: $i + px;
82
- // }
83
- // }
84
- // }
85
- //}
86
-
87
- $css3_radius: (
88
- border-radius:"",
89
- border-radius-top-left: "top-left",
90
- border-radius-top-right: "top-right",
91
- border-radius-bottom-left: "bottom-left",
92
- border-radius-bottom-right: "bottom-right"
93
- );
94
-
95
-
96
- @for $i from 1 through $max-border-radius{
97
- @each $name, $value in $css3_radius {
98
- .#{"" + $name}-#{"" + $i} {
99
- @include border-top-left-radius($max-border-radius + px);
100
- }
101
- }
102
- }
1
+ //-----------------------------------
2
+ // HELPER
3
+ // BORDERS CLASSES GENERATION
4
+ //-----------------------------------
5
+
6
+ ////
7
+ /// @access public
8
+ /// @group Borders
9
+ ////
10
+
11
+ //** Default positions
12
+ /// Generate all border positions
13
+ /// @example css - class="border-(pos*)-(size)-(color)"
14
+ /// .border-3-black {
15
+ /// border: 3px solid #000;
16
+ /// }
17
+ /// // ! Max Border size Value : 5
18
+ /// //* is optionnal
19
+
20
+ /*----------------
21
+ Borders
22
+ ----------------*/
23
+
24
+ @for $i from 1 through $max-border-size{
25
+ @each $nameC, $valueC in $merge_colors {
26
+ @each $name, $value in $border-position {
27
+ .#{"" + $name}-#{"" + $i}-#{"" + $nameC} {
28
+ #{$name}: $i + px solid #{"" + $valueC};
29
+ }
30
+ }
31
+ }
32
+ }
33
+ .border-none{
34
+ border: none;
35
+ }
36
+
37
+
38
+ /// Generate all border radius
39
+ /// @example css - class="border-(pos*)-radius-(size)"
40
+ /// .border-top-left-radius-3 {
41
+ /// border-top-left-radius: 3px;
42
+ /// -webkit-border-top-left-radius: 3px;
43
+ /// -moz-border-radius-topleft: 3px;
44
+ /// }
45
+ /// // ! Max Radius Value : 5
46
+ /// //* is optionnal
47
+
48
+ /*----------------
49
+ Borders Radius
50
+ ----------------*/
51
+
52
+ @for $i from 1 through $max-border-radius{
53
+ @each $name, $value in $css3_radius {
54
+ .#{"" + $name}-#{"" + $i} {
55
+ @include border-top-left-radius($max-border-radius + px);
56
+ }
57
+ }
58
+ }
@@ -1,90 +1,46 @@
1
- //-----------------------------------
2
- // HELPER
3
- // COLORS CLASSES GENERATION
4
- //-----------------------------------
5
-
6
- ////
7
- /// @access public
8
- /// @group Colors
9
- /// @type Map
10
- ////
11
-
12
- //** Default Colors
13
- /// @ignore Message
14
- /// @prop {Color} white [$white]
15
- /// @prop {Color} black [$black]
16
- /// @prop {Color} gray-darker [$gray-darker]
17
- /// @prop {Color} gray-dark [$gray-dark]
18
- /// @prop {Color} gray [$gray]
19
- /// @prop {Color} gray-light [$gray-light]
20
- /// @prop {Color} gray-lighter [$gray-lighter]
21
-
22
- $default_colors: (
23
- white: $white,
24
- black: $black,
25
- gray-darker: $gray-darker,
26
- gray-dark: $gray-dark,
27
- gray: $gray,
28
- gray-light: $gray-light,
29
- gray-lighter: $gray-lighter
30
- );
31
-
32
- //** Brand Colors
33
-
34
- /// @prop {Color} brand-primary [$brand-primary]
35
- /// @prop {Color} brand-secondary [$brand-secondary]
36
- /// @prop {Color} brand-success [$brand-success]
37
- /// @prop {Color} brand-warning [$brand-warning]
38
- /// @prop {Color} brand-danger [$brand-danger]
39
-
40
- $brand_colors: (
41
- brand-primary: $brand-primary,
42
- brand-secondary: $brand-secondary,
43
- brand-success: $brand-success,
44
- brand-info: $brand-info,
45
- brand-warning: $brand-warning,
46
- brand-danger: $brand-danger
47
- );
48
-
49
- //** Classes generation
50
- $merge_colors: map-merge($default_colors, $brand_colors);
51
-
52
- /*----------------
53
- Colors
54
- ----------------*/
55
-
56
- @each $name, $value in $merge_colors {
57
- .#{"" + $name} {
58
- color: $value;
59
- }
60
- }
61
-
62
- // Contextual colors
63
- .text-muted {
64
- color: $gray;
65
- }
66
- .text-primary {
67
- @include text-emphasis-variant($brand-primary);
68
- }
69
- .text-success {
70
- @include text-emphasis-variant($brand-success);
71
- }
72
- .text-info {
73
- @include text-emphasis-variant($brand-info);
74
- }
75
- .text-warning {
76
- @include text-emphasis-variant($brand-warning);
77
- }
78
- .text-error {
79
- @include text-emphasis-variant($brand-danger);
80
- }
81
-
82
- /*----------------
83
- Backgrounds
84
- ----------------*/
85
-
86
- @each $name, $value in $merge_colors {
87
- .bg-#{"" + $name} {
88
- background-color: $value;
89
- }
1
+ //-----------------------------------
2
+ // HELPER
3
+ // COLORS CLASSES GENERATION
4
+ //-----------------------------------
5
+
6
+ ////
7
+ /// @access public
8
+ /// @group Colors
9
+ /// @type Map
10
+ ////
11
+
12
+ @each $name, $value in $merge_colors {
13
+ .c-#{"" + $name} {
14
+ color: $value;
15
+ }
16
+ }
17
+
18
+ // Contextual colors
19
+ .text-muted {
20
+ color: $gray;
21
+ }
22
+ .text-primary {
23
+ @include text-emphasis-variant($brand-primary);
24
+ }
25
+ .text-success {
26
+ @include text-emphasis-variant($brand-success);
27
+ }
28
+ .text-info {
29
+ @include text-emphasis-variant($brand-info);
30
+ }
31
+ .text-warning {
32
+ @include text-emphasis-variant($brand-warning);
33
+ }
34
+ .text-error {
35
+ @include text-emphasis-variant($brand-error);
36
+ }
37
+
38
+ /*----------------
39
+ Backgrounds
40
+ ----------------*/
41
+
42
+ @each $name, $value in $merge_colors {
43
+ .bg-#{"" + $name} {
44
+ background-color: $value;
45
+ }
90
46
  }
@@ -1,4 +1,5 @@
1
- //-----------------------------------
2
- // CORE
3
- // Use to reorder imports
4
- //-----------------------------------
1
+ @import "borders";
2
+ @import "colors";
3
+ @import "positioning";
4
+ @import "spacing";
5
+ @import "typography";
@@ -1,103 +1,84 @@
1
- //-----------------------------------
2
- // HELPER
3
- // POSITIONING CLASSES GENERATION
4
- //-----------------------------------
5
-
6
- ////
7
- /// @access public
8
- /// @group Positioning
9
- /// @type Positioning
10
- ////
11
-
12
- /// Default padding in Wrappers
13
- /// @example class="wrapper"
14
- $wrapper: 10;
15
-
16
- /// Left Position
17
- /// @example class="pull-left"
18
- .pull-left{
19
- float:left !important;
20
- }
21
-
22
- /// Right Position
23
- /// @example class="pull-right"
24
- .pull-right{
25
- float:right !important;
26
- }
27
-
28
- /// Show Element
29
- .show {
30
- display: block !important;
31
- }
32
-
33
- /// Hide Element
34
- .invisible {
35
- visibility: hidden;
36
- }
37
-
38
- /// Hide from screenreaders and browsers
39
- .hidden {
40
- display: none !important;
41
- }
42
-
43
- /// Absolute
44
- .absolute{
45
- position:absolute;
46
- }
47
-
48
- /// Relative
49
- .relative{
50
- position:relative;
51
- }
52
-
53
- /// Center Block
54
- .centerer {
55
- @include centerer();
56
- }
57
-
58
- /// Vertical Align
59
- .vertical-align-inline{
60
- @include vertical-align-inline;
61
- }
62
-
63
- // Z-index master list
64
- //
65
- // Warning: Avoid customizing these values. They're used for a bird's eye view
66
- // of components dependent on the z-axis and are designed to all work together.
67
-
68
- $zindex-dropdown-backdrop: 990 !default;
69
- $zindex-navbar: 1000 !default;
70
- $zindex-dropdown: 1000 !default;
71
- $zindex-fixed: 1030 !default;
72
- $zindex-sticky: 1030 !default;
73
- $zindex-modal-backdrop: 1040 !default;
74
- $zindex-modal: 1050 !default;
75
- $zindex-popover: 1060 !default;
76
- $zindex-tooltip: 1070 !default;
77
-
78
- /// Fixed Top
79
- .fixed-top {
80
- position: fixed;
81
- top: 0;
82
- right: 0;
83
- left: 0;
84
- z-index: $zindex-fixed;
85
- }
86
-
87
- /// Fixed Bottom
88
- .fixed-bottom {
89
- position: fixed;
90
- right: 0;
91
- bottom: 0;
92
- left: 0;
93
- z-index: $zindex-fixed;
94
- }
95
-
96
- /// Sticky Top
97
- .sticky-top {
98
- position: sticky;
99
- top: 0;
100
- z-index: $zindex-sticky;
101
- }
102
-
103
-
1
+ //-----------------------------------
2
+ // HELPER
3
+ // POSITIONING CLASSES GENERATION
4
+ //-----------------------------------
5
+
6
+ ////
7
+ /// @access public
8
+ /// @group Positioning
9
+ /// @type Positioning
10
+ ////
11
+
12
+ /// Left Position
13
+ /// @example class="pull-left"
14
+ .pull-left{
15
+ float:left !important;
16
+ }
17
+
18
+ /// Right Position
19
+ /// @example class="pull-right"
20
+ .pull-right{
21
+ float:right !important;
22
+ }
23
+
24
+ /// Show Element
25
+ .show {
26
+ display: block !important;
27
+ }
28
+
29
+ /// Hide Element
30
+ .invisible {
31
+ visibility: hidden;
32
+ }
33
+
34
+ /// Hide from screenreaders and browsers
35
+ .hidden {
36
+ display: none !important;
37
+ }
38
+
39
+ /// Absolute
40
+ .absolute{
41
+ position:absolute;
42
+ }
43
+
44
+ /// Relative
45
+ .relative{
46
+ position:relative;
47
+ }
48
+
49
+ /// Center Block
50
+ .centerer {
51
+ @include centerer();
52
+ }
53
+
54
+ /// Vertical Align
55
+ .vertical-align-inline{
56
+ @include vertical-align-inline;
57
+ }
58
+
59
+ /// Fixed Top
60
+ .fixed-top {
61
+ position: fixed;
62
+ top: 0;
63
+ right: 0;
64
+ left: 0;
65
+ z-index: $zindex-fixed;
66
+ }
67
+
68
+ /// Fixed Bottom
69
+ .fixed-bottom {
70
+ position: fixed;
71
+ right: 0;
72
+ bottom: 0;
73
+ left: 0;
74
+ z-index: $zindex-fixed;
75
+ }
76
+
77
+ /// Sticky Top
78
+ .sticky-top {
79
+ position: sticky;
80
+ top: 0;
81
+ z-index: $zindex-sticky;
82
+ }
83
+
84
+