slick-buttons 0.0.3 → 0.0.4
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.
data/lib/slick-buttons.rb
CHANGED
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
// Use $app-color as a configurable var in your host project :-)
|
|
2
|
+
// will be working on a contrasting color scheme for bg and color settings within buttons to detect color conflicts
|
|
3
|
+
|
|
4
|
+
$btn-color: $app-color
|
|
5
|
+
|
|
6
|
+
// this will default to the applications base color
|
|
7
|
+
|
|
8
|
+
// Slick Button Style - creates a base button style for all buttons
|
|
9
|
+
=slick-buttons($btn-color, $hover: true)
|
|
10
|
+
background-color: darken($btn-color, 30%)
|
|
11
|
+
border: 1px solid darken($btn-color, 40%)
|
|
12
|
+
color: darken($btn-color, 5%)
|
|
13
|
+
display: block
|
|
14
|
+
font-size: 1.38em
|
|
15
|
+
// margin:0 .5em;
|
|
16
|
+
margin: 0
|
|
17
|
+
padding: .25em .5em
|
|
18
|
+
text-decoration: none
|
|
19
|
+
+border-radius(0.2em)
|
|
20
|
+
+box-shadow(darken($btn-color, 60%) 0px 1px 2px, darken($app-grey, 10%) 0px 1px 0px inset)
|
|
21
|
+
+background-image(linear-gradient(darken($btn-color, 20%), darken($btn-color, 40%)))
|
|
22
|
+
+text-shadow(darken($btn-color, 50%) 0px -1px 0px)
|
|
23
|
+
+transition(all 0.25s ease)
|
|
24
|
+
// hover state
|
|
25
|
+
@if $hover
|
|
26
|
+
&:hover
|
|
27
|
+
background-color: darken($btn-color, 50%)
|
|
28
|
+
border: 1px solid darken($btn-color, 60%)
|
|
29
|
+
color: lighten($btn-color, 100%)
|
|
30
|
+
+box-shadow(darken($btn-color, 40%) 0px 1px 2px, lighten($btn-color, 10%) 0px 1px 0px inset)
|
|
31
|
+
+background-image(linear-gradient($btn-color, darken($btn-color, 15%)))
|
|
32
|
+
&:active
|
|
33
|
+
background-color: darken($btn-color, 60%)
|
|
34
|
+
+box-shadow(darken($btn-color, 30%) 0px 1px 5px inset, $btn-color 0px -1px 0px inset)
|
|
35
|
+
+background-image(linear-gradient(darken($btn-color, 15%), $btn-color))
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// This is where you put the contents of the main stylesheet for the user's project.
|
|
2
|
+
// It should import your sass stylesheets and demonstrate how to use them.
|
|
3
|
+
|
|
4
|
+
@import slick-buttons
|
|
5
|
+
|
|
6
|
+
// Configurable Variables
|
|
7
|
+
$app-color: #444444 !default
|
|
8
|
+
|
|
9
|
+
// this will default to the applications base color if you declare it...
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: slick-buttons
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.4
|
|
5
5
|
prerelease:
|
|
6
6
|
platform: ruby
|
|
7
7
|
authors:
|
|
@@ -13,7 +13,7 @@ date: 2011-12-07 00:00:00.000000000Z
|
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: compass
|
|
16
|
-
requirement: &
|
|
16
|
+
requirement: &2168768000 !ruby/object:Gem::Requirement
|
|
17
17
|
none: false
|
|
18
18
|
requirements:
|
|
19
19
|
- - ! '>='
|
|
@@ -21,7 +21,7 @@ dependencies:
|
|
|
21
21
|
version: '0.11'
|
|
22
22
|
type: :runtime
|
|
23
23
|
prerelease: false
|
|
24
|
-
version_requirements: *
|
|
24
|
+
version_requirements: *2168768000
|
|
25
25
|
description: Slick css3 buttons using compass and sass
|
|
26
26
|
email: mike@mikefarnham.info
|
|
27
27
|
executables: []
|
|
@@ -30,8 +30,11 @@ extra_rdoc_files: []
|
|
|
30
30
|
files:
|
|
31
31
|
- README.mkdn
|
|
32
32
|
- lib/slick-buttons.rb
|
|
33
|
+
- stylesheets/_slick-buttons.sass
|
|
33
34
|
- stylesheets/_slick-buttons.scss
|
|
35
|
+
- stylesheets/slick-buttons/_slick-buttons.sass
|
|
34
36
|
- stylesheets/slick-buttons/_slick-buttons.scss
|
|
37
|
+
- templates/project/_slickbuttons.sass
|
|
35
38
|
- templates/project/_slickbuttons.scss
|
|
36
39
|
- templates/project/manifest.rb
|
|
37
40
|
homepage: http://www.mikefarnham.info
|