bootstrap_builders 0.0.30 → 0.0.31
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.
- checksums.yaml +4 -4
- data/README.md +25 -0
- data/app/assets/stylesheets/bootstrap_builders.scss +2 -0
- data/app/assets/stylesheets/bootstrap_builders/responsive-classes.scss +33 -0
- data/app/assets/stylesheets/bootstrap_builders/responsive-mixins.scss +31 -0
- data/lib/bootstrap_builders/version.rb +1 -1
- metadata +4 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: c73b088ae63b76eb9d62f67d98c2a18469416ff1
|
|
4
|
+
data.tar.gz: 9975a59c34e40fb79fe4d4af30ceeac8240c0c03
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6259b2239a6376c22ef972dce0cdea3d079799590753d6c268d7459c6b932704ce1e0e84c444a7d53d1fa6a456602c2777feb6e4147f3163c1d70344e5a8610f
|
|
7
|
+
data.tar.gz: dfdce2da009cae24e1e959c11f03b72f8cf79715e4f536419f3668e98d32b71623c59b416c86792eb5c24e0b3a0655b5c87125f8885382a1877098e8d2d99b14
|
data/README.md
CHANGED
|
@@ -106,6 +106,31 @@ The classes "bb-table" and "table" are always added.
|
|
|
106
106
|
= bb_btn "/url", "My label", :block, :lg, :confirm, :disabled
|
|
107
107
|
```
|
|
108
108
|
|
|
109
|
+
### Responsive mixins
|
|
110
|
+
|
|
111
|
+
Use responsive mixins to only apply certain CSS rules on specific sizes, below or above.
|
|
112
|
+
|
|
113
|
+
```scss
|
|
114
|
+
.some-class {
|
|
115
|
+
@include when-sm-down() {
|
|
116
|
+
width: 100px;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
@include when-md-up() {
|
|
120
|
+
width: 200px;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
@include bb-when-xs() { ... }
|
|
125
|
+
@include bb-when-sm() { ... }
|
|
126
|
+
@include bb-when-sm-up() { ... }
|
|
127
|
+
@include bb-when-sm-down() { ... }
|
|
128
|
+
@include bb-when-md() { ... }
|
|
129
|
+
@include bb-when-md-up() { ... }
|
|
130
|
+
@include bb-when-md-down() { ... }
|
|
131
|
+
@include bb-when-lg() { ... }
|
|
132
|
+
```
|
|
133
|
+
|
|
109
134
|
### Tabs
|
|
110
135
|
|
|
111
136
|
```haml
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
// scss-lint:disable PlaceholderInExtend
|
|
2
|
+
.hidden-lg-down {
|
|
3
|
+
@extend .hidden-lg, .hidden-md, .hidden-sm, .hidden-xs;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.hidden-md-down {
|
|
7
|
+
@extend .hidden-md, .hidden-sm, .hidden-xs;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.hidden-sm-down {
|
|
11
|
+
@extend .hidden-sm, .hidden-xs;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.hidden-xs-down {
|
|
15
|
+
@extend .hidden-xs;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.hidden-lg-up {
|
|
19
|
+
@extend .hidden-lg;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.hidden-md-up {
|
|
23
|
+
@extend .hidden-lg, .hidden-md;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.hidden-sm-up {
|
|
27
|
+
@extend .hidden-lg, .hidden-md, .hidden-sm;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.hidden-xs-up {
|
|
31
|
+
@extend .hidden-lg, .hidden-md, .hidden-sm, .hidden-xs;
|
|
32
|
+
}
|
|
33
|
+
// scss-lint:enable PlaceholderInExtend
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
@mixin bb-when-xs() {
|
|
2
|
+
@media (max-width: $screen-xs-max) { @content; }
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
@mixin bb-when-sm() {
|
|
6
|
+
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) { @content; }
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
@mixin bb-when-sm-up() {
|
|
10
|
+
@media (min-width: $screen-sm-min) { @content; }
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@mixin bb-when-sm-down() {
|
|
14
|
+
@media (max-width: $screen-sm-max) { @content; }
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
@mixin bb-when-md() {
|
|
18
|
+
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) { @content; }
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@mixin bb-when-md-up() {
|
|
22
|
+
@media (min-width: $screen-md-min) { @content; }
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
@mixin bb-when-md-down() {
|
|
26
|
+
@media (max-width: $screen-md-max) { @content; }
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
@mixin bb-when-lg() {
|
|
30
|
+
@media (min-width: $screen-lg-min) { @content; }
|
|
31
|
+
}
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: bootstrap_builders
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.31
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- kaspernj
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2017-01-
|
|
11
|
+
date: 2017-01-24 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|
|
@@ -58,6 +58,8 @@ files:
|
|
|
58
58
|
- app/assets/stylesheets/bootstrap_builders.scss
|
|
59
59
|
- app/assets/stylesheets/bootstrap_builders/bb-btn-responsive.scss
|
|
60
60
|
- app/assets/stylesheets/bootstrap_builders/bb-progress-bar.scss
|
|
61
|
+
- app/assets/stylesheets/bootstrap_builders/responsive-classes.scss
|
|
62
|
+
- app/assets/stylesheets/bootstrap_builders/responsive-mixins.scss
|
|
61
63
|
- app/controllers/bootstrap_builders/application_controller.rb
|
|
62
64
|
- app/helpers/bootstrap_builders/application_helper.rb
|
|
63
65
|
- app/views/layouts/bootstrap_builders/application.html.erb
|