handy-css-rails 0.0.6 → 0.0.7
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/Rakefile +6 -6
- data/handy-css-rails.gemspec +1 -1
- data/lib/handy-css-rails/version.rb +1 -1
- data/vendor/assets/stylesheets/{handyCSS.backdrops.css → handycss.backdrops.css} +73 -73
- data/vendor/assets/stylesheets/{handyCSS.box.css → handycss.box.css} +22 -6
- data/vendor/assets/stylesheets/{handyCSS.css → handycss.css} +0 -0
- metadata +6 -8
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 49dfe3ea78b7ca7b4597120925137ac28fdf382f
|
4
|
+
data.tar.gz: da33edca3651a576162ada5bd8a3442feaec58b7
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: e3087e2600c8c3245815426e0e56a879a0783cfd69621d017bc9a8168dc4ae87655705bfe7d5527c33cba64d0cd5e2f4575749817376b5094a5781e41026434b
|
7
|
+
data.tar.gz: c18e1d8f25a3bc7b57774288d4fafe70fe052a50c1712f37a20c5ea22636705d85490abc450dcba709abe911af55be6740e1bb485283a0f058df15c6a95e2686
|
data/Rakefile
CHANGED
@@ -4,26 +4,26 @@ require "bundler/gem_tasks"
|
|
4
4
|
|
5
5
|
desc "Download the latest handyCSS.css"
|
6
6
|
task :update do
|
7
|
-
|
7
|
+
|
8
8
|
# Updating handyCSS
|
9
9
|
url = "https://raw.github.com/kpvarma/handyCSS/master/css/handyCSS.css"
|
10
|
-
outputfile = "vendor/assets/stylesheets/
|
10
|
+
outputfile = "vendor/assets/stylesheets/handycss.css"
|
11
11
|
|
12
12
|
open(outputfile, 'wb') do |file|
|
13
13
|
file << open(url).read
|
14
14
|
end
|
15
|
-
|
15
|
+
|
16
16
|
# Updating box styles
|
17
17
|
url = "https://raw.github.com/kpvarma/handyCSS/master/css/handyCSS.box.css"
|
18
|
-
outputfile = "vendor/assets/stylesheets/
|
18
|
+
outputfile = "vendor/assets/stylesheets/handycss.box.css"
|
19
19
|
|
20
20
|
open(outputfile, 'wb') do |file|
|
21
21
|
file << open(url).read
|
22
22
|
end
|
23
|
-
|
23
|
+
|
24
24
|
# Updating backdrops styles
|
25
25
|
url = "https://raw.github.com/kpvarma/handyCSS/master/css/handyCSS.backdrops.css"
|
26
|
-
outputfile = "vendor/assets/stylesheets/
|
26
|
+
outputfile = "vendor/assets/stylesheets/handycss.backdrops.css"
|
27
27
|
|
28
28
|
open(outputfile, 'wb') do |file|
|
29
29
|
file << open(url).read
|
data/handy-css-rails.gemspec
CHANGED
@@ -5,7 +5,7 @@ Gem::Specification.new do |gem|
|
|
5
5
|
gem.authors = ["Krishnaprasad Varma"]
|
6
6
|
gem.email = ["krshnaprsad@gmail.com"]
|
7
7
|
gem.description = %q{A rails gem to integrate handyCSS styles to your rails project.}
|
8
|
-
gem.summary = %q{HandyCSS is a bunch of helpful styles, developed with SCSS
|
8
|
+
gem.summary = %q{HandyCSS is a bunch of helpful styles, developed with SCSS which makes it easier to kick start any project. }
|
9
9
|
gem.homepage = "https://github.com/kpvarma/handy-css-rails"
|
10
10
|
|
11
11
|
gem.files = `git ls-files`.split($\)
|
@@ -20,7 +20,7 @@
|
|
20
20
|
#backdrop-holder {
|
21
21
|
background-size: cover;
|
22
22
|
background-repeat: no-repeat;
|
23
|
-
/*
|
23
|
+
/* color: inherit;*/
|
24
24
|
min-height: 800px;
|
25
25
|
position: fixed;
|
26
26
|
width: 100%;
|
@@ -165,17 +165,17 @@
|
|
165
165
|
}
|
166
166
|
|
167
167
|
/* Add a new image based theme here.
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
168
|
+
.backdrop-picture-name {
|
169
|
+
@include linear-gradient(#topColor, #botomColor);
|
170
|
+
background-image: url(../images/backdrops/pictures/image-name.jpg);
|
171
|
+
}
|
172
172
|
Don't forget to add the image to the above mentioned folder.
|
173
173
|
Now you can use
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
174
|
+
<body class="backdrop-picture theme-default">
|
175
|
+
<div id="backdrop-holder" class="backdrop-picture-image-name">
|
176
|
+
Content Goes here.
|
177
|
+
</div>
|
178
|
+
</body>
|
179
179
|
*/
|
180
180
|
/* Pattern based backdrops */
|
181
181
|
.backdrop-pattern #backdrop-holder::after {
|
@@ -272,18 +272,18 @@
|
|
272
272
|
|
273
273
|
/* Add a new dark colored gradient themes here.
|
274
274
|
.backdrop-pattern .backdrop-pattern-xxxx::after, .backdrop-pattern-preview-xxxx::after {
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
Now you can use
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
|
286
|
-
|
275
|
+
content: '';
|
276
|
+
background: url(../images/backdrops/patterns/xxxx.png) repeat center center;
|
277
|
+
display: block;
|
278
|
+
opacity: 0.1;
|
279
|
+
height: 100%;
|
280
|
+
}
|
281
|
+
Now you can use
|
282
|
+
<body class="backdrop-pattern theme-default">
|
283
|
+
<div id="backdrop-holder" class="backdrop-pattern-xxxx backdrop-pattern-some-shade">
|
284
|
+
Content Goes here.
|
285
|
+
</div>
|
286
|
+
</body>
|
287
287
|
*/
|
288
288
|
.backdrop-shade-bootstrap-violet, .backdrop-shade-preview-bootstrap-violet {
|
289
289
|
background-color: #6d3353;
|
@@ -527,27 +527,27 @@
|
|
527
527
|
|
528
528
|
/* Add a new dark colored gradient themes here.
|
529
529
|
.backdrop-shade-some-shade { background-color:some-shade;}
|
530
|
-
|
531
|
-
|
532
|
-
|
533
|
-
|
534
|
-
|
535
|
-
|
536
|
-
|
537
|
-
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
|
548
|
-
|
549
|
-
|
550
|
-
|
530
|
+
|
531
|
+
1.Now you can use without pattern or picture
|
532
|
+
<body class="theme-default">
|
533
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green">
|
534
|
+
Content Goes here.
|
535
|
+
</div>
|
536
|
+
</body>
|
537
|
+
|
538
|
+
2.Now you can use with pattern
|
539
|
+
<body class="backgrop-pattern backdrop-pattern-01 theme-default">
|
540
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green">
|
541
|
+
Content Goes here.
|
542
|
+
</div>
|
543
|
+
</body>
|
544
|
+
|
545
|
+
3.Now you can use with picture as a fallback background color
|
546
|
+
<body class="backdrop-picture theme-default">
|
547
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green backdrop-picture-mountains">
|
548
|
+
Content Goes here.
|
549
|
+
</div>
|
550
|
+
</body>
|
551
551
|
*/
|
552
552
|
.theme-default .palette.shadowed:hover {
|
553
553
|
-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
@@ -628,36 +628,36 @@
|
|
628
628
|
box-shadow: inset 0 1px 0 #ffffff;
|
629
629
|
}
|
630
630
|
|
631
|
-
/*
|
632
|
-
|
633
|
-
|
634
|
-
|
635
|
-
|
636
|
-
|
637
|
-
|
638
|
-
|
639
|
-
|
640
|
-
|
641
|
-
|
642
|
-
|
643
|
-
|
644
|
-
|
645
|
-
|
646
|
-
|
647
|
-
|
648
|
-
|
649
|
-
|
650
|
-
|
651
|
-
|
652
|
-
|
653
|
-
|
654
|
-
|
655
|
-
|
656
|
-
|
657
|
-
|
631
|
+
/* .palette-content {
|
632
|
+
background-color: white;color:#4b4b4b;
|
633
|
+
:hover, .selected { background-color: #fff; }
|
634
|
+
}
|
635
|
+
.palette-outer {
|
636
|
+
background-color: white;color:#4b4b4b;
|
637
|
+
:hover, .selected { background-color: #fff; }
|
638
|
+
}
|
639
|
+
.palette-inner {
|
640
|
+
background-color: white;color:#4b4b4b;
|
641
|
+
:hover, .selected { background-color: #fff; }
|
642
|
+
}
|
643
|
+
.palette-token {
|
644
|
+
background-color: white;color:#4b4b4b;
|
645
|
+
a { color:#4b4b4b !important}
|
646
|
+
:hover, .selected { background-color: #fff; }
|
647
|
+
}
|
648
|
+
.palette-shadow {
|
649
|
+
-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
650
|
+
-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
651
|
+
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
652
|
+
-webkit-transition: all 0.5s ease;
|
653
|
+
-moz-transition: all 0.5s ease;
|
654
|
+
-o-transition: all 0.5s ease;
|
655
|
+
transition: all 0.5s ease;
|
656
|
+
}
|
657
|
+
.palette-rounded { -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
|
658
658
|
}*/
|
659
659
|
/*
|
660
|
-
.theme-default
|
660
|
+
.theme-default
|
661
661
|
.theme-default .palette-bordered { border: 1px solid #c1c1c1; }
|
662
662
|
|
663
663
|
.theme-default .palette > h1, .theme-default .palette > h2, .theme-default .palette > h3, .theme-default .palette > h4, .theme-default .palette > h5, .theme-default .palette > h6 { margin: 10px 0; font-family: inherit; font-weight: bold; line-height: 20px; color: #4b4b4b; text-rendering: optimizelegibility; text-align:left; border-bottom:1px solid #c1c1c1; padding-bottom:20px; }
|
@@ -889,7 +889,7 @@
|
|
889
889
|
|
890
890
|
h1 > a.right-heading-link, h2 > a.right-heading-link, h3 > a.right-heading-link, h4 > a.right-heading-link, h5 > a.right-heading-link, h6 > a.right-heading-link {float:right;color:#898989;font-style:underline; font-size:11px;}
|
891
891
|
|
892
|
-
.theme-default .palette a:not(.close):not(.escape-color)
|
892
|
+
.theme-default .palette a:not(.close):not(.escape-color) {color:#4b4b4b;font-weight:bold;}
|
893
893
|
.theme-default .palette a:not(.close):not(.escape-color):hover {color:#005580;}
|
894
894
|
|
895
895
|
.lnk { color: #fff; }
|
@@ -899,7 +899,7 @@ h1 > a.right-heading-link, h2 > a.right-heading-link, h3 > a.right-heading-link,
|
|
899
899
|
.theme-default .palette .palette-inner a.title {color:#fff;}
|
900
900
|
.theme-default .palette .palette-inner a.title:hover {color:orange;}
|
901
901
|
|
902
|
-
.theme-default .palette a.sub-title {font-size:16px;}
|
902
|
+
.theme-default .palette a.sub-title {font-size:16px;}
|
903
903
|
.theme-default .palette .palette-inner a.sub-title {color:#fff;}
|
904
904
|
.theme-default .palette .palette-inner a.sub-title:hover {color:orange;}
|
905
905
|
|
@@ -36,14 +36,30 @@
|
|
36
36
|
-moz-box-shadow: 2px 2px 5px #c1c1c1;
|
37
37
|
box-shadow: 2px 2px 5px #c1c1c1;
|
38
38
|
}
|
39
|
-
.box
|
40
|
-
font-size:
|
41
|
-
color: #
|
42
|
-
margin: 4px
|
39
|
+
.box .heading1 {
|
40
|
+
font-size: 24px;
|
41
|
+
color: #428bca;
|
42
|
+
margin: 4px 0px;
|
43
43
|
}
|
44
|
-
.box
|
44
|
+
.box .heading2 {
|
45
45
|
font-size: 16px;
|
46
|
-
color: #
|
46
|
+
color: #960D2E;
|
47
|
+
margin: 4px 0px;
|
48
|
+
}
|
49
|
+
.box .heading3 {
|
50
|
+
font-size: 14px;
|
51
|
+
color: #428bca;
|
52
|
+
margin: 4px 0px;
|
53
|
+
}
|
54
|
+
.box .heading4 {
|
55
|
+
font-size: 12px;
|
56
|
+
color: #960D2E;
|
57
|
+
margin: 4px 0px;
|
58
|
+
font-weight: bold;
|
59
|
+
}
|
60
|
+
.box .content {
|
61
|
+
font-size: 12px;
|
62
|
+
color: #960D2E;
|
47
63
|
}
|
48
64
|
|
49
65
|
.box.active {
|
File without changes
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: handy-css-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.7
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Krishnaprasad Varma
|
@@ -40,9 +40,9 @@ files:
|
|
40
40
|
- lib/handy-css-rails.rb
|
41
41
|
- lib/handy-css-rails/engine.rb
|
42
42
|
- lib/handy-css-rails/version.rb
|
43
|
-
- vendor/assets/stylesheets/
|
44
|
-
- vendor/assets/stylesheets/
|
45
|
-
- vendor/assets/stylesheets/
|
43
|
+
- vendor/assets/stylesheets/handycss.backdrops.css
|
44
|
+
- vendor/assets/stylesheets/handycss.box.css
|
45
|
+
- vendor/assets/stylesheets/handycss.css
|
46
46
|
homepage: https://github.com/kpvarma/handy-css-rails
|
47
47
|
licenses: []
|
48
48
|
metadata: {}
|
@@ -65,9 +65,7 @@ rubyforge_project:
|
|
65
65
|
rubygems_version: 2.2.2
|
66
66
|
signing_key:
|
67
67
|
specification_version: 4
|
68
|
-
summary: HandyCSS is a bunch of helpful styles, developed with SCSS
|
69
|
-
|
70
|
-
is a customisable CSS file that makes browsers render all elements more consistently
|
71
|
-
and in line with modern standards.
|
68
|
+
summary: HandyCSS is a bunch of helpful styles, developed with SCSS which makes it
|
69
|
+
easier to kick start any project.
|
72
70
|
test_files: []
|
73
71
|
has_rdoc:
|