schnitzelstyle 0.0.8 → 0.0.9

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.
@@ -17,7 +17,7 @@
17
17
  * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
18
18
 
19
19
  body {
20
- background-color: $color-page-background;
20
+ background-color: $color-background;
21
21
  color: $color-text;
22
22
  font: $font-default;
23
23
  padding-bottom: 20px;
@@ -43,7 +43,7 @@
43
43
  .container>header {
44
44
  margin-top: 20px !important;
45
45
 
46
- color: $color-header;
46
+ color: $color-title;
47
47
  font: $font-header;
48
48
  font-size: 120%;
49
49
  line-height: 150%;
@@ -54,7 +54,7 @@
54
54
  font: $font-header;
55
55
  font-size: 200%;
56
56
  font-weight: bold;
57
- @include floaty-title($color-page-background, $color-header);
57
+ @include floaty-title($color-background, $color-title);
58
58
  }
59
59
  }
60
60
 
@@ -1,7 +1,7 @@
1
1
  $container-width: 600px;
2
2
 
3
- $font-1: 16px "Georgia" !default;
4
- $font-2: 14px "Lucida Grande" !default;
3
+ $font-1: 16px "Georgia",serif !default;
4
+ $font-2: 14px "Tahoma","Lucida Grande",sans-serif !default;
5
5
 
6
6
  $font-default: $font-1;
7
7
  $font-header: $font-2;
@@ -9,20 +9,25 @@ $font-footer: $font-header !default;
9
9
  $font-monospaced: 13px Menlo,Monaco,Courier !default;
10
10
 
11
11
  // define some colors
12
- $color-0: white !default;
13
- $color-1: #666 !default;
14
- $color-2: #999 !default;
15
- $color-3: #4ea4ec !default;
16
- $color-4: complement($color-3);
12
+ $color-background: white !default;
13
+ $color-text: #666 !default;
14
+ $color-extra: #4ea4ec !default;
15
+
16
+ // Or try a different color scheme...:
17
+ //
18
+ // $color-background: #333 !default;
19
+ // $color-text: #ccc !default;
20
+ // $color-extra: #f93 !default;
17
21
 
18
22
  // apply colors to basic page elements
19
- $color-page-background: $color-0 !default;
20
- $color-text: $color-1 !default;
21
- $color-footer: $color-2 !default;
22
- $color-header: $color-3 !default;
23
+ $color-footer: rgba($color-text, 0.5) !default;
24
+ $color-title: $color-extra !default;
25
+
26
+ $color-heading-background: rgba($color-text, 0.18);
27
+ $color-heading-text: $color-text !default;
23
28
 
24
29
  $color-link: $color-text !default;
25
- $color-link-underline: lighten($color-4, 10%) !default;
26
- $color-link-hover: darken($color-link, 20%) !default;
30
+ $color-link-underline: complement($color-extra) !default;
31
+ $color-link-hover: complement($color-extra) !default;
27
32
 
28
33
  $color-error: #d33 !default;
@@ -10,13 +10,12 @@
10
10
  // footer
11
11
  &>footer {
12
12
  @include small-type;
13
- color: lighten($color-text, 30%); // FIXME
13
+
14
+ &, & a, & a:hover { color: $color-footer };
14
15
  a {
15
- color: lighten($color-text, 30%); // FIXME
16
16
  text-decoration: none;
17
17
  border-bottom: none;
18
18
  &:hover {
19
- color: lighten($color-text, 30%); // FIXME
20
19
  text-decoration: underline;
21
20
  }
22
21
  }
@@ -34,7 +33,6 @@
34
33
 
35
34
  em {
36
35
  font-style: italic;
37
- color: #666;
38
36
  }
39
37
 
40
38
  // links
@@ -63,7 +61,7 @@
63
61
 
64
62
  // headings
65
63
  h1, h2, h3, h4, h5, h6 {
66
- @include floaty-title($color-text, darken($color-page-background, 5%));
64
+ @include floaty-title($color-heading-text, $color-heading-background);
67
65
  font: $font-header;
68
66
  margin-top: 1.5em;
69
67
  font-weight: bold;
@@ -73,14 +71,13 @@
73
71
  font-size: 150%;
74
72
  text-transform: uppercase;
75
73
  }
76
-
77
74
  // quotes
78
75
  blockquote {
79
76
  @include justified;
80
- color: #777; // FIXME
77
+ color: rgba($color-text, 0.8);
81
78
  padding: 0 20px;
82
79
  font-style: italic;
83
- border-left: 5px solid #eee;
80
+ border-left: 5px solid rgba($color-text, 0.2);
84
81
  }
85
82
 
86
83
  // images
@@ -93,8 +90,8 @@
93
90
  // code
94
91
  pre, code {
95
92
  font: $font-monospaced;
96
- background-color: #eee;
97
- color: #666;
93
+ background-color: rgba($color-text, 0.2);
94
+ color: rgba($color-text, 0.9);
98
95
  }
99
96
 
100
97
  code {
@@ -26,7 +26,7 @@
26
26
  box-shadow: $x $y $r $color;
27
27
  }
28
28
 
29
- @mixin button($color: #f93, $radius: 4px) {
29
+ @mixin button($color: complement($color-extra), $radius: 4px) {
30
30
  $text-color: lighten($color, 50%);
31
31
 
32
32
  padding: 2px 8px;
@@ -10,7 +10,7 @@
10
10
  @include small-type;
11
11
  font-weight: bold;
12
12
  padding-left: 5px;
13
- color: $color-header;
13
+ color: $color-title;
14
14
  }
15
15
 
16
16
  input, textarea {
@@ -19,11 +19,11 @@
19
19
  padding: 5px;
20
20
  border: none;
21
21
  font: $font-monospaced;
22
- background-color: #f4f4f4; // FIXME
23
- color: #999; // FIXME
22
+ background-color: rgba($color-text, 0.15);
23
+ color: rgba($color-text, 0.6);
24
24
 
25
25
  @include animated(100ms);
26
- &:hover, &:focus { color: #333; } // FIXME
26
+ &:hover, &:focus { color: $color-text }
27
27
  }
28
28
 
29
29
  select, option {
@@ -45,7 +45,7 @@
45
45
  .hint {
46
46
  padding: 0px 5px;
47
47
  display: block;
48
- color: $color-2;
48
+ color: $color-extra;
49
49
  @include small-type;
50
50
  }
51
51
  }
@@ -66,9 +66,8 @@
66
66
  }
67
67
 
68
68
  ::-webkit-input-placeholder {
69
- color: #ccc;
70
- font: $font-footer;
71
- font-size: 80%;
69
+ @include small-type;
70
+ color: rgba($color-text, 0.4);
72
71
  padding-top: 2px;
73
72
  }
74
73
  }
@@ -1,8 +1,5 @@
1
1
  @mixin schnitzel-responsive {
2
2
  @media only screen and (max-width: 640px) {
3
- // for debugging
4
- // body { background-color: #fee }
5
-
6
3
  body {
7
4
  padding-bottom: 10px;
8
5
  }
@@ -1,3 +1,3 @@
1
1
  module Schnitzelstyle
2
- VERSION = "0.0.8"
2
+ VERSION = "0.0.9"
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: schnitzelstyle
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.8
4
+ version: 0.0.9
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -13,7 +13,7 @@ date: 2012-02-23 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: sass
16
- requirement: &70103334050860 !ruby/object:Gem::Requirement
16
+ requirement: &70341453518800 !ruby/object:Gem::Requirement
17
17
  none: false
18
18
  requirements:
19
19
  - - ! '>='
@@ -21,7 +21,7 @@ dependencies:
21
21
  version: '0'
22
22
  type: :runtime
23
23
  prerelease: false
24
- version_requirements: *70103334050860
24
+ version_requirements: *70341453518800
25
25
  description: A simple, light-weight CSS framework to kickstart your web app.
26
26
  email:
27
27
  - hendrik@mans.de