mice 0.0.12 → 0.1

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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 3c137a9797635bd9d1ceaa7ee1fba371293bc692
4
- data.tar.gz: 072a1aeb8dff35ff1f689bb0fc2a940158a9b532
3
+ metadata.gz: 9fd60c88855e5733e25075672001064f290579c5
4
+ data.tar.gz: c13893b7b2f68fa7514e4cacd98b3250a663ae38
5
5
  SHA512:
6
- metadata.gz: f641c5b830796b21a610bba89a1a500c431ad64af13bfeeb075ee82b40131567d0b39493c0d81ef5a97edbb7f149deb19c14522da7e5e07820f6c603ffc892fa
7
- data.tar.gz: 6130746c921791b9ce1e438e951318b7a675370e0ab486601f863ca9fac1f862223c62beee446853faba33004744499288ede2bfc9ad94afde6461f404d6e0cf
6
+ metadata.gz: cebb702b71acbd6ce8b77d6163ab6cda50c73a28eefb3b2def7f20d2d903d40c54e631f437c7defd92aca1ec4ea6db2713d8708165d125f4c0c786b14eee92bd
7
+ data.tar.gz: 7449810d54c678bede6f5bed9a29f65843edf8c5a00f0dc3df2c2c5e9247da3c59427274590c14c15e6e8c4ffa76e555532e2ead4d6431cab097c34048b8aff6
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- mice (0.0.12)
4
+ mice (0.1)
5
5
 
6
6
  GEM
7
7
  remote: https://rubygems.org/
data/README.md CHANGED
@@ -10,7 +10,7 @@ Add this line to your application's Gemfile:
10
10
  gem 'mice'
11
11
  ```
12
12
  or
13
-
13
+
14
14
  ```ruby
15
15
  gem 'mice', :git => 'git@github.com:miclle/mice.git'
16
16
  ```
@@ -43,11 +43,6 @@ or
43
43
  ```
44
44
 
45
45
 
46
- ## HTML/CSS Style Guide
47
-
48
- http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml
49
-
50
-
51
46
  ## Contributing
52
47
 
53
48
  1. Fork it ( http://github.com/miclle/mice/fork )
@@ -1,3 +1,3 @@
1
1
  module Mice
2
- VERSION = "0.0.12"
2
+ VERSION = "0.1"
3
3
  end
@@ -10,6 +10,7 @@
10
10
  @import "mice/typography";
11
11
  @import "mice/code";
12
12
  @import "mice/grid";
13
+ @import "mice/callouts";
13
14
 
14
15
  @import "mice/buttons";
15
16
  @import "mice/images";
@@ -17,7 +18,7 @@
17
18
 
18
19
  @import "mice/menu";
19
20
  @import "mice/sidebar";
20
-
21
+ @import "mice/lists";
21
22
  @import "mice/tables";
22
23
 
23
24
  // Components
@@ -25,4 +26,7 @@
25
26
  @import "mice/media";
26
27
 
27
28
  // Form
28
- @import "mice/forms";
29
+ @import "mice/forms";
30
+
31
+ // Utility classes
32
+ @import "mice/utilities";
@@ -0,0 +1,67 @@
1
+ //
2
+ // Blockquote & Callout
3
+ // --------------------------------------------------
4
+
5
+ blockquote, .callout {
6
+ padding: ($line-height-computed / 2) $line-height-computed;
7
+ margin: 0 0 $line-height-computed;
8
+ font-size: $blockquote-font-size;
9
+ border-left: 5px solid $blockquote-border-color;
10
+
11
+ p, ul, ol {
12
+ &:last-child { margin-bottom: 0; }
13
+ }
14
+
15
+ footer, small, .small {
16
+ display: block;
17
+ font-size: 80%; // back to default font-size
18
+ line-height: $line-height-base;
19
+ color: $blockquote-small-color;
20
+
21
+ &:before { content: '\2014 \00A0';} // em dash, nbsp
22
+ }
23
+
24
+ footer{ margin-top: 0;}
25
+ }
26
+
27
+ // Opposite alignment
28
+ blockquote, .callout{
29
+ &.reverse,
30
+ &.righted {
31
+ padding-right: 15px;
32
+ padding-left: 0;
33
+ border-right: 5px solid $blockquote-border-color;
34
+ border-left: 0;
35
+ text-align: right;
36
+
37
+ // Account for citation
38
+ footer, small, .small {
39
+ &:before { content: ''; }
40
+ &:after { content: '\00A0 \2014'; } // nbsp, em dash
41
+ }
42
+ }
43
+ }
44
+
45
+ // Quotes
46
+ blockquote:before, .callout:before,
47
+ blockquote:after, .callout:after {
48
+ content: "";
49
+ }
50
+
51
+ blockquote, .callout{
52
+ &.primary { border-color: $border-color-primary; background-color: $state-primary-background; }
53
+ &.success { border-color: $border-color-success; background-color: $state-success-background; }
54
+ &.info { border-color: $border-color-info; background-color: $state-info-background; }
55
+ &.warning { border-color: $border-color-warning; background-color: $state-warning-background; }
56
+ &.danger { border-color: $border-color-danger; background-color: $state-danger-background; }
57
+ }
58
+
59
+ .callout{
60
+ border-width: 3px;
61
+
62
+ &.primary { h1, h2, h3, h4, h5, h6{color: $border-color-primary; }}
63
+ &.success { h1, h2, h3, h4, h5, h6{color: $border-color-success; }}
64
+ &.info { h1, h2, h3, h4, h5, h6{color: $border-color-info; }}
65
+ &.warning { h1, h2, h3, h4, h5, h6{color: $border-color-warning; }}
66
+ &.danger { h1, h2, h3, h4, h5, h6{color: $border-color-danger; }}
67
+ }
@@ -0,0 +1,66 @@
1
+ //
2
+ // Lists
3
+ // --------------------------------------------------
4
+
5
+ // Unordered and Ordered lists
6
+ ul,
7
+ ol {
8
+ margin-top: 0;
9
+ margin-bottom: ($line-height-computed / 2);
10
+ ul,
11
+ ol {
12
+ margin-bottom: 0;
13
+ }
14
+ }
15
+
16
+ // List options
17
+ .unstyled {
18
+ padding-left: 0;
19
+ list-style: none;
20
+ }
21
+
22
+ // Inline
23
+ .inline {
24
+ @extend .unstyled;
25
+ margin-left: -5px;
26
+
27
+ > li {
28
+ display: inline-block;
29
+ padding-left: 5px;
30
+ padding-right: 5px;
31
+ }
32
+ }
33
+
34
+ // Description Lists
35
+ dl {
36
+ margin-top: 0;
37
+ margin-bottom: $line-height-computed;
38
+ }
39
+ dt,
40
+ dd {
41
+ line-height: $line-height-base;
42
+ }
43
+ dt {
44
+ font-weight: bold;
45
+ }
46
+ dd {
47
+ margin-left: 0;
48
+ }
49
+
50
+ // Horizontal description lists
51
+
52
+ .horizontal {
53
+ dt{
54
+ float: left;
55
+ width: 160px;
56
+ clear: left;
57
+ text-align: right;
58
+ overflow: hidden;
59
+ text-overflow: ellipsis;
60
+ white-space: nowrap;
61
+ }
62
+ dd {
63
+ @include clearfix();
64
+ margin-left: 180px;
65
+ }
66
+ }
@@ -146,3 +146,29 @@
146
146
  }
147
147
  background-repeat: no-repeat;
148
148
  }
149
+
150
+
151
+ // Typography
152
+ // --------------------------------------------------
153
+ // [converter] $parent hack
154
+ @mixin text-emphasis-variant($parent, $color) {
155
+ #{$parent} {
156
+ color: $color;
157
+ }
158
+ a#{$parent}:hover {
159
+ color: darken($color, 10%);
160
+ }
161
+ }
162
+
163
+
164
+ // Contextual backgrounds
165
+ // --------------------------------------------------
166
+ // [converter] $parent hack
167
+ @mixin background-variant($parent, $color) {
168
+ #{$parent} {
169
+ background-color: $color;
170
+ }
171
+ a#{$parent}:hover {
172
+ background-color: darken($color, 10%);
173
+ }
174
+ }
@@ -16,11 +16,11 @@ table > tbody,
16
16
  table > tfoot{
17
17
  > tr {
18
18
  &.active > th, th.active , &.active > td, td.active { background-color: $table-background-active; }
19
- &.primary > th, th.primary, &.primary > td, td.primary { background-color: lighten($brand-primary, 32%) }
20
- &.success > th, th.success, &.success > td, td.success { background-color: lighten($brand-success, 32%) }
21
- &.info > th, th.info , &.info > td, td.info { background-color: lighten($brand-info, 32%) }
22
- &.warning > th, th.warning, &.warning > td, td.warning { background-color: lighten($brand-warning, 32%) }
23
- &.danger > th, th.danger , &.danger > td, td.danger { background-color: lighten($brand-danger, 32%) }
19
+ &.primary > th, th.primary, &.primary > td, td.primary { background-color: lighten($brand-primary, 32%); }
20
+ &.success > th, th.success, &.success > td, td.success { background-color: lighten($brand-success, 32%); }
21
+ &.info > th, th.info , &.info > td, td.info { background-color: lighten($brand-info, 32%); }
22
+ &.warning > th, th.warning, &.warning > td, td.warning { background-color: lighten($brand-warning, 32%); }
23
+ &.danger > th, th.danger , &.danger > td, td.danger { background-color: lighten($brand-danger, 32%); }
24
24
  }
25
25
  }
26
26
 
@@ -5,7 +5,6 @@
5
5
 
6
6
  // Headings
7
7
  // -------------------------
8
-
9
8
  h1, h2, h3, h4, h5, h6{
10
9
  font-family: $heading-font-family;
11
10
  font-weight: $heading-font-weight;
@@ -22,21 +21,14 @@ h1, h2, h3, h4, h5, h6{
22
21
  }
23
22
 
24
23
  &.title{
25
- padding: 10px 0;
26
- border-bottom: 1px solid #EEE;
24
+ padding-bottom: $line-height-computed / 2;
25
+ border-bottom: 1px solid $page-header-border-color;
26
+ margin: ($line-height-computed * 2) 0 $line-height-computed;
27
27
  }
28
28
  }
29
29
 
30
- h1, h2, h3 {
31
- small{
32
- font-size: 65%;
33
- }
34
- }
35
- h4, h5, h6 {
36
- small{
37
- font-size: 75%;
38
- }
39
- }
30
+ h1, h2, h3 { small{ font-size: 65%; }}
31
+ h4, h5, h6 { small{ font-size: 75%; }}
40
32
 
41
33
  h1 { font-size: $font-size-h1; }
42
34
  h2 { font-size: $font-size-h2; }
@@ -45,21 +37,77 @@ h4 { font-size: $font-size-h4; }
45
37
  h5 { font-size: $font-size-h5; }
46
38
  h6 { font-size: $font-size-h6; }
47
39
 
40
+ // Body text
41
+ // -------------------------
42
+
43
+ p { margin: 0 0 ($line-height-computed / 2); }
44
+
45
+ .lead {
46
+ margin-bottom: $line-height-computed;
47
+ font-size: floor(($font-size-base * 1.15));
48
+ font-weight: 200;
49
+ line-height: 1.4;
50
+ }
51
+
48
52
 
49
- // Text style
53
+ // Emphasis & misc
50
54
  // -------------------------
51
55
 
52
- p{ margin: 0 0 ($line-height-computed / 2);}
56
+ // Ex: 14px base font * 85% = about 12px
57
+ small,
58
+ .small { font-size: 85%; }
53
59
 
54
- small{ font-size: 85%; }
60
+ // Undo browser default styling
61
+ cite { font-style: normal; }
55
62
 
56
- mark{
63
+ mark,
64
+ .mark {
65
+ background-color: $state-warning-background;
57
66
  padding: .2em;
58
67
  }
59
68
 
60
- // Text align
61
- // -------------------------
69
+ // Alignment
62
70
  .text.left { text-align: left; }
63
71
  .text.right { text-align: right; }
64
72
  .text.center { text-align: center; }
65
73
  .text.justify { text-align: justify; }
74
+
75
+
76
+ // Contextual colors
77
+ .text-muted { color: $text-muted; }
78
+ @include text-emphasis-variant('.text-primary', $state-primary-text);
79
+ @include text-emphasis-variant('.text-success', $state-success-text);
80
+ @include text-emphasis-variant('.text-info', $state-info-text);
81
+ @include text-emphasis-variant('.text-warning', $state-warning-text);
82
+ @include text-emphasis-variant('.text-danger', $state-danger-text);
83
+
84
+ // Contextual backgrounds
85
+ .bg-primary { color: #fff; }
86
+ @include background-variant('.bg-primary', $state-primary-background);
87
+ @include background-variant('.bg-success', $state-success-background);
88
+ @include background-variant('.bg-info', $state-info-background);
89
+ @include background-variant('.bg-warning', $state-warning-background);
90
+ @include background-variant('.bg-danger', $state-danger-background);
91
+
92
+
93
+ // Misc
94
+ // -------------------------
95
+
96
+ // Abbreviations and acronyms
97
+ abbr[title],
98
+ abbr[data-original-title] {
99
+ cursor: help;
100
+ border-bottom: 1px dotted $abbr-border-color;
101
+ }
102
+
103
+ .initialism {
104
+ font-size: 90%;
105
+ text-transform: uppercase;
106
+ }
107
+
108
+ // Addresses
109
+ address {
110
+ margin-bottom: $line-height-computed;
111
+ font-style: normal;
112
+ line-height: $line-height-base;
113
+ }
@@ -0,0 +1,48 @@
1
+ //
2
+ // Utility classes
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Floats
7
+ // -------------------------
8
+
9
+ // Floated
10
+ .clearfix { @include clearfix(); }
11
+
12
+ .centered {
13
+ display: block;
14
+ float: none;
15
+ margin-left: auto;
16
+ margin-right: auto;
17
+ }
18
+
19
+ .lefted { float: left !important; }
20
+ .righted { float: right !important; }
21
+
22
+
23
+ // Toggling content
24
+ // -------------------------
25
+
26
+ .hide {
27
+ display: none !important;
28
+ }
29
+ .show {
30
+ display: block !important;
31
+ }
32
+ .invisible {
33
+ visibility: hidden;
34
+ }
35
+ .hidden {
36
+ display: none !important;
37
+ visibility: hidden !important;
38
+ }
39
+
40
+ .text-hide {}
41
+
42
+
43
+ // For Affix plugin
44
+ // -------------------------
45
+
46
+ .affix {
47
+ position: fixed;
48
+ }
@@ -114,9 +114,32 @@ $abbr-border-color: $gray-light !default;
114
114
  $heading-small-color: $gray-light !default;
115
115
  $blockquote-small-color: $gray-light !default;
116
116
  $blockquote-font-size: ($font-size-base * 1.25) !default;
117
- $blockquote-border-color: $gray-lighter !default;
117
+
118
118
  $page-header-border-color: $gray-lighter !default;
119
119
 
120
+ $blockquote-border-color: $gray-lighter !default;
121
+
122
+ $state-primary-text: $brand-primary !default;
123
+ $state-primary-background: lighten($brand-primary, 32%) !default;
124
+ $state-primary-border: darken(adjust-hue($state-primary-background, -10), 5%) !default;
125
+
126
+ $state-success-text: #3c763d !default;
127
+ $state-success-background: #dff0d8 !default;
128
+ $state-success-border: darken(adjust-hue($state-success-background, -10), 5%) !default;
129
+
130
+ $state-info-text: #31708f !default;
131
+ $state-info-background: #d9edf7 !default;
132
+ $state-info-border: darken(adjust-hue($state-info-background, -10), 7%) !default;
133
+
134
+ $state-warning-text: #8a6d3b !default;
135
+ $state-warning-background: #fcf8e3 !default;
136
+ $state-warning-border: darken(adjust-hue($state-warning-background, -10), 5%) !default;
137
+
138
+ $state-danger-text: #a94442 !default;
139
+ $state-danger-background: #f2dede !default;
140
+ $state-danger-border: darken(adjust-hue($state-danger-background, -10), 5%) !default;
141
+
142
+
120
143
 
121
144
  //== Code
122
145
  //
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: mice
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.12
4
+ version: '0.1'
5
5
  platform: ruby
6
6
  authors:
7
7
  - miclle
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-05-11 00:00:00.000000000 Z
11
+ date: 2014-05-12 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -54,12 +54,14 @@ files:
54
54
  - vendor/assets/javascripts/mice/jquery.min.map
55
55
  - vendor/assets/stylesheets/mice.scss
56
56
  - vendor/assets/stylesheets/mice/_buttons.scss
57
+ - vendor/assets/stylesheets/mice/_callouts.scss
57
58
  - vendor/assets/stylesheets/mice/_code.scss
58
59
  - vendor/assets/stylesheets/mice/_components.scss
59
60
  - vendor/assets/stylesheets/mice/_forms.scss
60
61
  - vendor/assets/stylesheets/mice/_grid.scss
61
62
  - vendor/assets/stylesheets/mice/_icons.scss
62
63
  - vendor/assets/stylesheets/mice/_images.scss
64
+ - vendor/assets/stylesheets/mice/_lists.scss
63
65
  - vendor/assets/stylesheets/mice/_media.scss
64
66
  - vendor/assets/stylesheets/mice/_menu.scss
65
67
  - vendor/assets/stylesheets/mice/_mixins.scss
@@ -68,6 +70,7 @@ files:
68
70
  - vendor/assets/stylesheets/mice/_sidebar.scss
69
71
  - vendor/assets/stylesheets/mice/_tables.scss
70
72
  - vendor/assets/stylesheets/mice/_typography.scss
73
+ - vendor/assets/stylesheets/mice/_utilities.scss
71
74
  - vendor/assets/stylesheets/mice/_variables.scss
72
75
  homepage: https://github.com/miclle/mice
73
76
  licenses: