glimmer-dsl-css 1.5.0 → 1.5.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +5 -0
- data/README.md +54 -9
- data/VERSION +1 -1
- data/glimmer-dsl-css.gemspec +7 -3
- data/lib/glimmer-dsl-css/ext/css_percentable.rb +13 -0
- data/lib/glimmer-dsl-css/ext/float.rb +5 -0
- data/lib/glimmer-dsl-css/ext/integer.rb +6 -0
- data/lib/glimmer-dsl-css/ext/numeric.rb +15 -0
- data/lib/glimmer-dsl-css.rb +3 -0
- metadata +6 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: e7e949aec92ed02ea78029ede9817280b0ab9bb542382f7cb08223f9f9ee7870
|
4
|
+
data.tar.gz: e21dfaa4ff4538d1e432c2c3804076db7cfb7dd785aa4db4df7991415c319e84
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 37041f729a6aebec6fc12084ee7bd419a0f8d540b3ccb01ea96b8640d3f24d87b9b7f60133fe6791c4e8add93ad9b832e21cbb911bff61c20c55aabc06a8f20a
|
7
|
+
data.tar.gz: 13c3c85185fb5e81bc6279e2e4a8cf331c6cde51e8d2db6828ca9e9a7e839707ff6700fb7f6fcce7d0534f40e96783a606e8983c87dc948155e3beb6be6ad3d7
|
data/CHANGELOG.md
CHANGED
@@ -1,5 +1,10 @@
|
|
1
1
|
# Change Log
|
2
2
|
|
3
|
+
# 1.5.1
|
4
|
+
|
5
|
+
- Support px in pt cm mm em methods on `Numeric` to allow producing px in pt cm mm em CSS values (e.g. `3.px` => "3px")
|
6
|
+
- Support % method on `Integer`/`Float` to allow producing % CSS values (e.g. `90.%` => "90%")
|
7
|
+
|
3
8
|
## 1.5.0
|
4
9
|
|
5
10
|
- Support `raw` keyword to allow adding raw CSS to a `css { }` block, which gets appended to other CSS generated by the DSL.
|
data/README.md
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for CSS 1.5.
|
1
|
+
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for CSS 1.5.1
|
2
2
|
## Ruby Programmable Cascading Style Sheets
|
3
3
|
[![Gem Version](https://badge.fury.io/rb/glimmer-dsl-css.svg)](http://badge.fury.io/rb/glimmer-dsl-css)
|
4
4
|
[![Travis CI](https://travis-ci.com/AndyObtiva/glimmer-dsl-css.svg?branch=master)](https://travis-ci.com/github/AndyObtiva/glimmer-dsl-css)
|
@@ -17,8 +17,10 @@ include Glimmer
|
|
17
17
|
|
18
18
|
@css = css {
|
19
19
|
body {
|
20
|
-
font_size
|
20
|
+
font_size 1.1.em
|
21
21
|
background 'white'
|
22
|
+
width 90.%
|
23
|
+
height 100.%
|
22
24
|
}
|
23
25
|
|
24
26
|
rule('body > h1') {
|
@@ -40,7 +42,7 @@ puts @css
|
|
40
42
|
Output (minified CSS):
|
41
43
|
|
42
44
|
```css
|
43
|
-
body{font-size:1.1em;background:white}body > h1{background-color:red;font-size:24px}@media screen and (min-width: 30em) and (orientation: landscape){body#app h1#title{font-size:16px;font-family:"Times New Roman", Times, serif}}
|
45
|
+
body{font-size:1.1em;background:white;width:90%;height:100%}body > h1{background-color:red;font-size:24px}@media screen and (min-width: 30em) and (orientation: landscape){body#app h1#title{font-size:16px;font-family:"Times New Roman", Times, serif}}
|
44
46
|
```
|
45
47
|
|
46
48
|
The key reason for using the CSS DSL instead of actual CSS is Ruby programmability without getting lost in string concatenations. The CSS DSL helps in including conditional CSS with `if` or ternery expressions as well as looping from lists while building CSS.
|
@@ -64,7 +66,7 @@ Please follow these instructions to make the `glimmer` command available on your
|
|
64
66
|
|
65
67
|
Run this command to install directly:
|
66
68
|
```
|
67
|
-
gem install glimmer-dsl-css -v 1.5.
|
69
|
+
gem install glimmer-dsl-css -v 1.5.1
|
68
70
|
```
|
69
71
|
|
70
72
|
Note: In case you are using JRuby, `jgem` is JRuby's version of the `gem` command. RVM allows running `gem` as an alias in JRuby. Otherwise, you may also run `jruby -S gem install ...`
|
@@ -79,7 +81,7 @@ That's it! Requiring the gem activates the Glimmer CSS DSL automatically.
|
|
79
81
|
|
80
82
|
Add the following to `Gemfile` (after `glimmer-dsl-swt` and/or `glimmer-dsl-opal` if included too):
|
81
83
|
```
|
82
|
-
gem 'glimmer-dsl-css', '~> 1.5.
|
84
|
+
gem 'glimmer-dsl-css', '~> 1.5.1'
|
83
85
|
```
|
84
86
|
|
85
87
|
And, then run:
|
@@ -172,9 +174,18 @@ The `body > h1` rule could have been written in any other alternative way:
|
|
172
174
|
end
|
173
175
|
```
|
174
176
|
|
175
|
-
### Numeric Values
|
177
|
+
### Numeric Values and Unit Types
|
178
|
+
|
179
|
+
All CSS unit types are supported by invoking methods matching them on Numeric objects (e.g. `3.em` produces `'3em'`):
|
180
|
+
- `px` (default if not specified)
|
181
|
+
- `in`
|
182
|
+
- `pt`
|
183
|
+
- `cm`
|
184
|
+
- `mm`
|
185
|
+
- `em`
|
186
|
+
- `%`
|
176
187
|
|
177
|
-
|
188
|
+
For example:
|
178
189
|
|
179
190
|
```ruby
|
180
191
|
require 'glimmer-dsl-css'
|
@@ -183,7 +194,37 @@ include Glimmer
|
|
183
194
|
|
184
195
|
@css = css {
|
185
196
|
body {
|
186
|
-
font_size
|
197
|
+
font_size 1.1.em
|
198
|
+
width 80.%
|
199
|
+
height 100.%
|
200
|
+
background 'white'
|
201
|
+
}
|
202
|
+
|
203
|
+
r('body > h1') {
|
204
|
+
font_size 24.px
|
205
|
+
background_color :red
|
206
|
+
}
|
207
|
+
}
|
208
|
+
|
209
|
+
puts @css
|
210
|
+
```
|
211
|
+
|
212
|
+
Output (minified CSS):
|
213
|
+
|
214
|
+
```css
|
215
|
+
body{font-size:1.1em;width:80%;height:100%;background:white}body > h1{font-size:24px;background-color:red}
|
216
|
+
```
|
217
|
+
|
218
|
+
Also, as you saw above, numeric values (e.g. `24` in `font_size 24`) automatically get suffixed with `px` by convention (e.g. `24px`).
|
219
|
+
|
220
|
+
```ruby
|
221
|
+
require 'glimmer-dsl-css'
|
222
|
+
|
223
|
+
include Glimmer
|
224
|
+
|
225
|
+
@css = css {
|
226
|
+
body {
|
227
|
+
font_size 14
|
187
228
|
background 'white'
|
188
229
|
}
|
189
230
|
_ 'body > h1' do
|
@@ -198,7 +239,7 @@ puts @css
|
|
198
239
|
Output (minified CSS):
|
199
240
|
|
200
241
|
```css
|
201
|
-
body{font-size:
|
242
|
+
body{font-size:14px;background:white}body > h1{background-color:red;font-size:24px}
|
202
243
|
```
|
203
244
|
|
204
245
|
### Raw CSS
|
@@ -358,6 +399,10 @@ Learn more about how to use this DSL alongside other Glimmer DSLs:
|
|
358
399
|
|
359
400
|
[Glimmer Multi-DSL Support](https://github.com/AndyObtiva/glimmer/tree/master#multi-dsl-support)
|
360
401
|
|
402
|
+
## Influences
|
403
|
+
|
404
|
+
- https://github.com/opal/paggio
|
405
|
+
|
361
406
|
## Help
|
362
407
|
|
363
408
|
### Issues
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
1.5.
|
1
|
+
1.5.1
|
data/glimmer-dsl-css.gemspec
CHANGED
@@ -2,16 +2,16 @@
|
|
2
2
|
# DO NOT EDIT THIS FILE DIRECTLY
|
3
3
|
# Instead, edit Jeweler::Tasks in Rakefile, and run 'rake gemspec'
|
4
4
|
# -*- encoding: utf-8 -*-
|
5
|
-
# stub: glimmer-dsl-css 1.5.
|
5
|
+
# stub: glimmer-dsl-css 1.5.1 ruby lib
|
6
6
|
|
7
7
|
Gem::Specification.new do |s|
|
8
8
|
s.name = "glimmer-dsl-css".freeze
|
9
|
-
s.version = "1.5.
|
9
|
+
s.version = "1.5.1"
|
10
10
|
|
11
11
|
s.required_rubygems_version = Gem::Requirement.new(">= 0".freeze) if s.respond_to? :required_rubygems_version=
|
12
12
|
s.require_paths = ["lib".freeze]
|
13
13
|
s.authors = ["AndyMaleh".freeze]
|
14
|
-
s.date = "2024-07-
|
14
|
+
s.date = "2024-07-28"
|
15
15
|
s.description = "Glimmer DSL for CSS (Ruby Programmable Cascading Style Sheets)".freeze
|
16
16
|
s.email = "andy.am@gmail.com".freeze
|
17
17
|
s.executables = ["css_to_glimmer".freeze, "minify_css".freeze]
|
@@ -30,6 +30,10 @@ Gem::Specification.new do |s|
|
|
30
30
|
"bin/minify_css",
|
31
31
|
"glimmer-dsl-css.gemspec",
|
32
32
|
"lib/glimmer-dsl-css.rb",
|
33
|
+
"lib/glimmer-dsl-css/ext/css_percentable.rb",
|
34
|
+
"lib/glimmer-dsl-css/ext/float.rb",
|
35
|
+
"lib/glimmer-dsl-css/ext/integer.rb",
|
36
|
+
"lib/glimmer-dsl-css/ext/numeric.rb",
|
33
37
|
"lib/glimmer/css/css_fragment.rb",
|
34
38
|
"lib/glimmer/css/css_fragment_composite.rb",
|
35
39
|
"lib/glimmer/css/css_minifier.rb",
|
@@ -0,0 +1,15 @@
|
|
1
|
+
class Numeric
|
2
|
+
%w[px in pt cm mm em].each do |unit_type|
|
3
|
+
if 1.respond_to?(unit_type)
|
4
|
+
puts "Unable to define Numeric##{unit_type} method because it is already defined. Please avoid using the Glimmer Numeric##{unit_type} method or remove the other implementation of it!"
|
5
|
+
else
|
6
|
+
define_method(unit_type) do
|
7
|
+
if zero?
|
8
|
+
to_s
|
9
|
+
else
|
10
|
+
"#{self}#{unit_type}"
|
11
|
+
end
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
data/lib/glimmer-dsl-css.rb
CHANGED
@@ -26,6 +26,9 @@ require 'facets/string/camelcase'
|
|
26
26
|
require 'glimmer'
|
27
27
|
|
28
28
|
require 'glimmer/dsl/css/dsl'
|
29
|
+
require 'glimmer-dsl-css/ext/numeric'
|
30
|
+
require 'glimmer-dsl-css/ext/integer'
|
31
|
+
require 'glimmer-dsl-css/ext/float'
|
29
32
|
|
30
33
|
module Glimmer
|
31
34
|
def _(selector, &rule_block)
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: glimmer-dsl-css
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.5.
|
4
|
+
version: 1.5.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- AndyMaleh
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2024-07-
|
11
|
+
date: 2024-07-28 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: glimmer
|
@@ -228,6 +228,10 @@ files:
|
|
228
228
|
- bin/minify_css
|
229
229
|
- glimmer-dsl-css.gemspec
|
230
230
|
- lib/glimmer-dsl-css.rb
|
231
|
+
- lib/glimmer-dsl-css/ext/css_percentable.rb
|
232
|
+
- lib/glimmer-dsl-css/ext/float.rb
|
233
|
+
- lib/glimmer-dsl-css/ext/integer.rb
|
234
|
+
- lib/glimmer-dsl-css/ext/numeric.rb
|
231
235
|
- lib/glimmer/css/css_fragment.rb
|
232
236
|
- lib/glimmer/css/css_fragment_composite.rb
|
233
237
|
- lib/glimmer/css/css_minifier.rb
|