magic_stylez 0.0.0.87 → 0.0.0.88

Sign up to get free protection for your applications and to get access to all the features.
Files changed (32) hide show
  1. checksums.yaml +4 -4
  2. data/lib/magic_stylez/version.rb +1 -1
  3. data/test/dummy/app/assets/javascripts/views/app/changelog.jst.eco +104 -0
  4. data/test/dummy/app/assets/javascripts/views/app/start.jst.eco +2 -47
  5. data/test/dummy/app/assets/stylesheets/corporate/_fonts.scss +15 -0
  6. data/test/dummy/app/assets/stylesheets/corporate/_variables.scss +21 -0
  7. data/test/dummy/app/views/front/_aside.html.erb +1 -0
  8. data/test/dummy/app/views/front/start.html.erb +4 -48
  9. data/test/dummy/public/html/aside-nav.html +2 -2
  10. data/test/dummy/public/html/fixed-header.html +2 -2
  11. data/test/dummy/public/html/fixed-subnav.html +2 -2
  12. data/test/dummy/public/html/index.html +8 -51
  13. data/test/dummy/public/html/slidebar-header.html +2 -2
  14. data/test/dummy/public/html/slidebar-subnav.html +2 -2
  15. data/vendor/assets/stylesheets/corporate/_fonts.scss +0 -3
  16. data/vendor/assets/stylesheets/corporate/_variables.scss +8 -1
  17. data/vendor/assets/stylesheets/magic/content/_box.scss +21 -21
  18. data/vendor/assets/stylesheets/magic/content/_buttons.scss +1 -1
  19. data/vendor/assets/stylesheets/magic/content/_forms.scss +7 -7
  20. data/vendor/assets/stylesheets/magic/content/_helper.scss +11 -11
  21. data/vendor/assets/stylesheets/magic/content/_icons.scss +4 -4
  22. data/vendor/assets/stylesheets/magic/content/_panel.scss +2 -2
  23. data/vendor/assets/stylesheets/magic/content/_pix.scss +7 -6
  24. data/vendor/assets/stylesheets/magic/helper/_divider.scss +1 -1
  25. data/vendor/assets/stylesheets/magic/helper/_dots.scss +1 -1
  26. data/vendor/assets/stylesheets/magic/helper/_text.scss +2 -2
  27. data/vendor/assets/stylesheets/magic/layout/_tables_v1.scss +2 -5
  28. data/vendor/assets/stylesheets/magic/layout/_tables_v2.scss +4 -4
  29. data/vendor/assets/stylesheets/magic/layout/_tables_v3.scss +3 -3
  30. data/vendor/assets/stylesheets/magic/lib/_text.scss +2 -2
  31. data/vendor/assets/stylesheets/magic/lists/_nav.scss +12 -13
  32. metadata +5 -3
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 2a1ad19d11e530e3d5de8987d7b3c7d42b2a84c1
4
- data.tar.gz: cbeb866bde1dbfcc1a3013fcedc3bc614a8edc0b
3
+ metadata.gz: 0a9ef18bcad96ab7a2d1d3a839f32919601264c5
4
+ data.tar.gz: 938a29665e56b3fc9be46f5034f68e06c20d8404
5
5
  SHA512:
6
- metadata.gz: 37a0365ebcfbc7c7e1a077f17ec801fbf7f53939c7d9494dd558cabe4da0473d77061efedc6839e17c93ddfc636a527f4cfbe0a32d86036bec2c767fde333d2a
7
- data.tar.gz: f61f9aa9105d7c956d5e54ed629c9fa6598a91b3424a3e7547c343e78b23939bcb721b9c1fc5686189040a7268afa6222dc110f52ccc320818d0222dd351184d
6
+ metadata.gz: 9dfca73d9878824456a911b6ec901d4b2da22e3628fbe336b35ff8ef475101f2a801a949252f54c46f9953a2e8159db0f4d260aec738b0dcad77eadd6b3d984c
7
+ data.tar.gz: 9718f988b1533810bfd9429a4c1a03c0d934865cbe9e6c01d3a7390fff0f5db4648d6c0c2ffaa569c396cd514cc694ef88f8eb4755c124b134abb58d6cf88ff6
@@ -1,3 +1,3 @@
1
1
  module MagicStylez
2
- VERSION = "0.0.0.87"
2
+ VERSION = "0.0.0.88"
3
3
  end
@@ -0,0 +1,104 @@
1
+ <div class="section head">
2
+ <div class="corset tight">
3
+ <h2 class="loud">ChangeLog</h2>
4
+
5
+ </div>
6
+ </div>
7
+
8
+ <div class="section sctn-sm hard-bottom">
9
+ <div class="corset tight">
10
+ <p class="loud">I try to this allways up to date .. but sometimes important changes may not be in here so allways do <code>$ rails g magic_stylez:update</code> when update.</p>
11
+
12
+ </div>
13
+ </div>
14
+
15
+ <br/>
16
+
17
+ <div class="section sctn-sm">
18
+ <div class="corset tight">
19
+ <h4><small>Version</small> 0.0.0.88</h4>
20
+ <p>Changed lots of font-sizes and line-heights to use variables instead of fixed values.</p>
21
+ <p>
22
+ - removed configurations: <code>$magicDefaultLineHight</code> and <code>$magicDefaultFontSize</code>!!!
23
+ </p>
24
+ <p>
25
+ + added configurations: <code>$general-vertical-spacing</code> and <code>$general-vertical-spacing-half</code> for genrell bottom margin and <code>.press</code> class.
26
+ </p>
27
+ </div>
28
+ </div>
29
+
30
+ <div class="section sctn-sm">
31
+ <div class="corset tight">
32
+ <h4><small>Version</small> 0.0.0.83</h4>
33
+ <p>
34
+ Text-Colors now only usable as:
35
+ <br/>
36
+ <code>.color-name-clr</code> /<small>or</small>/ <code>.color-name-color</code> /<small>or</small>/ <code>.color-name-txt</code> /<small>or</small>/ <code>.color-name-text</code> /<small>or</small>/ <br/>
37
+ <code>.clr-color-name</code> /<small>or</small>/ <code>.color-color-name</code> /<small>or</small>/ <code>.txt-color-name</code> /<small>or</small>/ <code>.text-color-name</code>
38
+ </p>
39
+ <p>
40
+ Old style: <code>.color-name</code> is removed !!!
41
+ </p>
42
+ </div>
43
+ </div>
44
+
45
+ <div class="section sctn-sm">
46
+ <div class="corset tight">
47
+ <h4><small>Version</small> 0.0.0.78</h4>
48
+ <ul>
49
+ <li>add divider variables in <em>corporate/varriables</em>!</li>
50
+ </ul>
51
+ <p>
52
+ Dividers are completely rewritten and now have transparent backgrounds, so you can place them on any element.
53
+ <br/>
54
+ Also some variables added:
55
+ </p>
56
+ <ul>
57
+ <li><code>$divider-horizontal-spacing</code>, <code>$divider-vertical-spacing</code> => spacing</li>
58
+ <li><code>$divider-top-color</code>, <code>$divider-bottom-color</code> => line-colors for <em>.divider</em> and <em>hr</em></li>
59
+ </ul>
60
+ <p>
61
+ If you update to <strong>>= 0.0.0.78</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
62
+ </p>
63
+ </div>
64
+ </div>
65
+
66
+ <div class="section sctn-sm">
67
+ <div class="corset tight">
68
+ <h4><small>Version</small> 0.0.0.67</h4>
69
+ <ul>
70
+ <li>changed some names in <em>corporate/varriables</em>!</li>
71
+ </ul>
72
+ <p>
73
+ With Version <strong>0.0.0.67</strong> Sections have more bootstrap like name, like <code>.section.section-xs</code> instead of <code>.section.compact</code>.
74
+ <br/>
75
+ Also some variables changed, so <code>$section-flatted-padding</code> becomes <code>$section-sm-padding</code>.
76
+ <br/>
77
+ <br/>
78
+ If you update to <strong>>= 0.0.0.67</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
79
+ </p>
80
+ </div>
81
+ </div>
82
+
83
+ <div class="section sctn-sm">
84
+ <div class="corset tight">
85
+ <h4><small>Version</small> 0.0.0.55</h4>
86
+ <ul>
87
+ <li><em>corporate/typo</em> is removed!</li>
88
+ <li><em>corporate/fonts</em> doesn't contain css, just variables</li>
89
+ </ul>
90
+ <p>With Version <strong>0.0.0.55</strong> I merged <em>corporate/typo</em> into <em>corporate/fonts</em> (they where so similar). I also removed all css from <em>corporate/fonts</em>, because it causes trouble with update generator (and also is not a variable).</p>
91
+ </div>
92
+ </div>
93
+
94
+ <br/>
95
+
96
+ <div class="section hard-top">
97
+ <div class="corset tight">
98
+ <p class="highlight"><i class="olicons-hide-filter"></i> magic-styles update generator</p>
99
+ <p class="loud"><i class="olicons-hide-filter"></i> in the process I often add new variables to the corporate files</p>
100
+ <p class="loud"><i class="olicons-hide-filter"></i> what causes "Missing variable!" when you update to new version</p>
101
+ <p class="loud"><i class="olicons-hide-filter"></i> this generator adds all new variables without touching your settings</p>
102
+ <pre><code>$ rails g magic_stylez:update</code></pre>
103
+ </div>
104
+ </div>
@@ -78,56 +78,11 @@ CSS:
78
78
  <p class="loud"><i class="olicons-hide-filter"></i> this generator adds all new variables without touching your settings</p>
79
79
  <pre><code>$ rails g magic_stylez:update</code></pre>
80
80
  <br/>
81
+ <hr class="half" />
81
82
  <br/>
83
+ <p class="louder">Please allways look in the new <a href="#app/changelog" data-target="app/changelog">Changelog</a> for recent chnages.</p>
82
84
 
83
- <h4>Changes when update to <small>0.0.0.83</small>:</h4>
84
- <p>
85
- Text-Colors now only usable as:
86
- <br/>
87
- <code>.color-name-clr</code> /<small>or</small>/ <code>.color-name-color</code> /<small>or</small>/ <code>.color-name-txt</code> /<small>or</small>/ <code>.color-name-text</code> /<small>or</small>/ <br/>
88
- <code>.clr-color-name</code> /<small>or</small>/ <code>.color-color-name</code> /<small>or</small>/ <code>.txt-color-name</code> /<small>or</small>/ <code>.text-color-name</code>
89
- </p>
90
- <p>
91
- Old style: <code>.color-name</code> is removed !!!
92
- </p>
93
- <hr/>
94
85
 
95
- <h4>Changes when update to <small>0.0.0.78</small>:</h4>
96
- <ul>
97
- <li>add divider variables in <em>corporate/varriables</em>!</li>
98
- </ul>
99
- <p>
100
- Dividers are completely rewritten and now have transparent backgrounds, so you can place them on any element.
101
- <br/>
102
- Also some variables added:
103
- </p>
104
- <ul>
105
- <li><code>$divider-horizontal-spacing</code>, <code>$divider-vertical-spacing</code> => spacing</li>
106
- <li><code>$divider-top-color</code>, <code>$divider-bottom-color</code> => line-colors for <em>.divider</em> and <em>hr</em></li>
107
- </ul>
108
- <p>
109
- If you update to <strong>>= 0.0.0.78</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
110
- </p>
111
- <hr/>
112
- <h4>Changes when update to <small>0.0.0.67</small>:</h4>
113
- <ul>
114
- <li>changed some names in <em>corporate/varriables</em>!</li>
115
- </ul>
116
- <p>
117
- With Version <strong>0.0.0.67</strong> Sections have more bootstrap like name, like <code>.section.section-xs</code> instead of <code>.section.compact</code>.
118
- <br/>
119
- Also some variables changed, so <code>$section-flatted-padding</code> becomes <code>$section-sm-padding</code>.
120
- <br/>
121
- <br/>
122
- If you update to <strong>>= 0.0.0.67</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
123
- </p>
124
- <hr/>
125
- <h4>Changes when update to <small>0.0.0.55</small>:</h4>
126
- <ul>
127
- <li><em>corporate/typo</em> is removed!</li>
128
- <li><em>corporate/fonts</em> doesn't contain css, just variables</li>
129
- </ul>
130
- <p>With Version <strong>0.0.0.55</strong> I merged <em>corporate/typo</em> into <em>corporate/fonts</em> (they where so similar). I also removed all css from <em>corporate/fonts</em>, because it causes trouble with update generator (and also is not a variable).</p>
131
86
  </div>
132
87
  </div>
133
88
 
@@ -118,3 +118,18 @@ $magicHandwritten-font-weight: 400 !default;
118
118
 
119
119
 
120
120
 
121
+
122
+
123
+
124
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
125
+ // magic_styles v-0.0.0.87 additional variables (2015-10-19 09:27)
126
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
127
+ // line | style
128
+ /* 58 */ $font-size-xl: ceil(($font-size-base * 1.5)) !default; // ~22px
129
+ /* 61 */ $font-size-xs: ceil(($font-size-base * 0.75)) !default; // ~10px
130
+ /* 80 */ $line-height-xl: 1.2 !default;
131
+ /* 83 */ $line-height-xs: 1.5 !default;
132
+ /* 87 */ $line-height-computed-xl: floor(($font-size-xl * $line-height-xl)) !default; // ~20px
133
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
134
+
135
+
@@ -799,3 +799,24 @@ $component-offset-horizontal: 180px !default;
799
799
  // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
800
800
 
801
801
 
802
+
803
+
804
+
805
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
806
+ // magic_styles v-0.0.0.87 additional variables (2015-10-19 09:27)
807
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
808
+ // line | style
809
+ /* 36 */ $padding-xl-vertical: 15px !default;
810
+ /* 37 */ $padding-xl-horizontal: 22px !default;
811
+ /* 49 */ $border-radius-xl: 8px !default;
812
+ /* 52 */ $border-radius-xs: 3px !default;
813
+ /* 56 */ // press
814
+ /* 57 */ $general-vertical-spacing: $line-height-computed !default; // .press .. and so on
815
+ /* 58 */ $general-vertical-spacing-half: ceil($line-height-computed / 2) !default; // .press .. and so on
816
+ /* 149 */ $input-height-xl: (ceil($font-size-xl * $line-height-xl) + ($padding-xl-vertical * 2) + 2) !default;
817
+ /* 250 */ //== Divider
818
+ /* 252 */ // -----|< - >|your text|< - >|------
819
+ /* 254 */ // for .divider and hr elements
820
+ // # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
821
+
822
+
@@ -25,6 +25,7 @@
25
25
  </li>
26
26
  <% end %>
27
27
  <% end %>
28
+ <li><%= link_to "Changelog", "#", class: "app_lnk lst_lnk", data: {target: "app/changelog"} %></li>
28
29
  </ul>
29
30
  <br/>
30
31
 
@@ -78,57 +78,13 @@ CSS:
78
78
  <p class="loud"><i class="olicons-hide-filter"></i> what causes "Missing variable!" when you update to new version</p>
79
79
  <p class="loud"><i class="olicons-hide-filter"></i> this generator adds all new variables without touching your settings</p>
80
80
  <pre><code>$ rails g magic_stylez:update</code></pre>
81
+
81
82
  <br/>
83
+ <hr class="half" />
84
+ <br/>
85
+ <p class="louder">Please allways look in the new <a href="#app/changelog" data-target="app/changelog">Changelog</a> for recent chnages.</p>
82
86
  <br/>
83
87
 
84
- <h4>Changes when update to <small>0.0.0.83</small>:</h4>
85
- <p>
86
- Text-Colors now only usable as:
87
- <br/>
88
- <code>.color-name-clr</code> /<small>or</small>/ <code>.color-name-color</code> /<small>or</small>/ <code>.color-name-txt</code> /<small>or</small>/ <code>.color-name-text</code> /<small>or</small>/ <br/>
89
- <code>.clr-color-name</code> /<small>or</small>/ <code>.color-color-name</code> /<small>or</small>/ <code>.txt-color-name</code> /<small>or</small>/ <code>.text-color-name</code>
90
- </p>
91
- <p>
92
- Old style: <code>.color-name</code> is removed !!!
93
- </p>
94
- <hr/>
95
-
96
- <h4>Changes when update to <small>0.0.0.78</small>:</h4>
97
- <ul>
98
- <li>add divider variables in <em>corporate/varriables</em>!</li>
99
- </ul>
100
- <p>
101
- Dividers are completely rewritten and now have transparent backgrounds, so you can place them on any element.
102
- <br/>
103
- Also some variables added:
104
- </p>
105
- <ul>
106
- <li><code>$divider-horizontal-spacing</code>, <code>$divider-vertical-spacing</code> => spacing</li>
107
- <li><code>$divider-top-color</code>, <code>$divider-bottom-color</code> => line-colors for <em>.divider</em> and <em>hr</em></li>
108
- </ul>
109
- <p>
110
- If you update to <strong>>= 0.0.0.78</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
111
- </p>
112
- <hr/>
113
- <h4>Changes when update to <small>0.0.0.67</small>:</h4>
114
- <ul>
115
- <li>changed some names in <em>corporate/varriables</em>!</li>
116
- </ul>
117
- <p>
118
- With Version <strong>0.0.0.67</strong> Sections have more bootstrap like name, like <code>.section.section-xs</code> instead of <code>.section.compact</code>.
119
- <br/>
120
- Also some variables changed, so <code>$section-flatted-padding</code> becomes <code>$section-sm-padding</code>.
121
- <br/>
122
- <br/>
123
- If you update to <strong>>= 0.0.0.67</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
124
- </p>
125
- <hr/>
126
- <h4>Changes when update to <small>0.0.0.55</small>:</h4>
127
- <ul>
128
- <li><em>corporate/typo</em> is removed!</li>
129
- <li><em>corporate/fonts</em> doesn't contain css, just variables</li>
130
- </ul>
131
- <p>With Version <strong>0.0.0.55</strong> I merged <em>corporate/typo</em> into <em>corporate/fonts</em> (they where so similar). I also removed all css from <em>corporate/fonts</em>, because it causes trouble with update generator (and also is not a variable).</p>
132
88
  </div>
133
89
  </div>
134
90
 
@@ -3,10 +3,10 @@
3
3
  <head>
4
4
  <title>Magic-Stylez</title>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
6
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
7
7
  <script src="//berlinmagic.github.io/magic_stylez/assets/blank-f61f67c5c51c1b2adbcfdfc46056dabb.js"></script>
8
8
  <meta content="authenticity_token" name="csrf-param" />
9
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
9
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
10
10
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
11
11
  <script type="text/javascript" charset="utf-8">
12
12
  App = {};
@@ -3,10 +3,10 @@
3
3
  <head>
4
4
  <title>Magic-Stylez</title>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
6
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
7
7
  <script src="//berlinmagic.github.io/magic_stylez/assets/blank-f61f67c5c51c1b2adbcfdfc46056dabb.js"></script>
8
8
  <meta content="authenticity_token" name="csrf-param" />
9
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
9
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
10
10
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
11
11
  <script type="text/javascript" charset="utf-8">
12
12
  App = {};
@@ -3,10 +3,10 @@
3
3
  <head>
4
4
  <title>Magic-Stylez</title>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
6
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
7
7
  <script src="//berlinmagic.github.io/magic_stylez/assets/blank-f61f67c5c51c1b2adbcfdfc46056dabb.js"></script>
8
8
  <meta content="authenticity_token" name="csrf-param" />
9
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
9
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
10
10
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
11
11
  <script type="text/javascript" charset="utf-8">
12
12
  App = {};
@@ -6,10 +6,10 @@
6
6
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
7
7
  <meta name="apple-mobile-web-app-capable" content="yes" />
8
8
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
9
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
10
- <script src="//berlinmagic.github.io/magic_stylez/assets/application-e9a65b23c1261383ff6d1e31cccefef4.js"></script>
9
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
10
+ <script src="//berlinmagic.github.io/magic_stylez/assets/application-2ad3e55818eb95bc65f807b960fa193c.js"></script>
11
11
  <meta content="authenticity_token" name="csrf-param" />
12
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
12
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
13
13
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
14
14
  <link href="//berlinmagic.github.io/magic_stylez/assets/ico/favicon-f1706407301f788c54691b6995f60a8f.ico" rel="shortcut icon" type="image/vnd.microsoft.icon" />
15
15
  <link href="//berlinmagic.github.io/magic_stylez/assets/ico/favicon-f34b54df445838a4f6bdac98bd904570.png" rel="shortcut icon" type="image/png" />
@@ -97,6 +97,7 @@
97
97
  <li><a class="app_lnk lst_lnk" data-target="templates/slidebar_subnav" href="#">Slidebar Subnav</a></li>
98
98
  </ul>
99
99
  </li>
100
+ <li><a class="app_lnk lst_lnk" data-target="app/changelog" href="#">Changelog</a></li>
100
101
  </ul>
101
102
  <br/>
102
103
 
@@ -190,57 +191,13 @@ CSS:
190
191
  <p class="loud"><i class="olicons-hide-filter"></i> what causes "Missing variable!" when you update to new version</p>
191
192
  <p class="loud"><i class="olicons-hide-filter"></i> this generator adds all new variables without touching your settings</p>
192
193
  <pre><code>$ rails g magic_stylez:update</code></pre>
194
+
193
195
  <br/>
196
+ <hr class="half" />
197
+ <br/>
198
+ <p class="louder">Please allways look in the new <a href="#app/changelog" data-target="app/changelog">Changelog</a> for recent chnages.</p>
194
199
  <br/>
195
200
 
196
- <h4>Changes when update to <small>0.0.0.83</small>:</h4>
197
- <p>
198
- Text-Colors now only usable as:
199
- <br/>
200
- <code>.color-name-clr</code> /<small>or</small>/ <code>.color-name-color</code> /<small>or</small>/ <code>.color-name-txt</code> /<small>or</small>/ <code>.color-name-text</code> /<small>or</small>/ <br/>
201
- <code>.clr-color-name</code> /<small>or</small>/ <code>.color-color-name</code> /<small>or</small>/ <code>.txt-color-name</code> /<small>or</small>/ <code>.text-color-name</code>
202
- </p>
203
- <p>
204
- Old style: <code>.color-name</code> is removed !!!
205
- </p>
206
- <hr/>
207
-
208
- <h4>Changes when update to <small>0.0.0.78</small>:</h4>
209
- <ul>
210
- <li>add divider variables in <em>corporate/varriables</em>!</li>
211
- </ul>
212
- <p>
213
- Dividers are completely rewritten and now have transparent backgrounds, so you can place them on any element.
214
- <br/>
215
- Also some variables added:
216
- </p>
217
- <ul>
218
- <li><code>$divider-horizontal-spacing</code>, <code>$divider-vertical-spacing</code> => spacing</li>
219
- <li><code>$divider-top-color</code>, <code>$divider-bottom-color</code> => line-colors for <em>.divider</em> and <em>hr</em></li>
220
- </ul>
221
- <p>
222
- If you update to <strong>>= 0.0.0.78</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
223
- </p>
224
- <hr/>
225
- <h4>Changes when update to <small>0.0.0.67</small>:</h4>
226
- <ul>
227
- <li>changed some names in <em>corporate/varriables</em>!</li>
228
- </ul>
229
- <p>
230
- With Version <strong>0.0.0.67</strong> Sections have more bootstrap like name, like <code>.section.section-xs</code> instead of <code>.section.compact</code>.
231
- <br/>
232
- Also some variables changed, so <code>$section-flatted-padding</code> becomes <code>$section-sm-padding</code>.
233
- <br/>
234
- <br/>
235
- If you update to <strong>>= 0.0.0.67</strong> be sure to run: $ <code>rails g magic_stylez:update</code> !!!
236
- </p>
237
- <hr/>
238
- <h4>Changes when update to <small>0.0.0.55</small>:</h4>
239
- <ul>
240
- <li><em>corporate/typo</em> is removed!</li>
241
- <li><em>corporate/fonts</em> doesn't contain css, just variables</li>
242
- </ul>
243
- <p>With Version <strong>0.0.0.55</strong> I merged <em>corporate/typo</em> into <em>corporate/fonts</em> (they where so similar). I also removed all css from <em>corporate/fonts</em>, because it causes trouble with update generator (and also is not a variable).</p>
244
201
  </div>
245
202
  </div>
246
203
 
@@ -3,10 +3,10 @@
3
3
  <head>
4
4
  <title>Magic-Stylez</title>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
6
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
7
7
  <script src="//berlinmagic.github.io/magic_stylez/assets/blank-f61f67c5c51c1b2adbcfdfc46056dabb.js"></script>
8
8
  <meta content="authenticity_token" name="csrf-param" />
9
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
9
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
10
10
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
11
11
  <script type="text/javascript" charset="utf-8">
12
12
  App = {};
@@ -3,10 +3,10 @@
3
3
  <head>
4
4
  <title>Magic-Stylez</title>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <link href="//berlinmagic.github.io/magic_stylez/assets/application-d73868b4205dedb8c8da140ca10787a7.css" media="all" rel="stylesheet" />
6
+ <link href="//berlinmagic.github.io/magic_stylez/assets/application-9194bbf9b185448d794e018e63dd2dee.css" media="all" rel="stylesheet" />
7
7
  <script src="//berlinmagic.github.io/magic_stylez/assets/blank-f61f67c5c51c1b2adbcfdfc46056dabb.js"></script>
8
8
  <meta content="authenticity_token" name="csrf-param" />
9
- <meta content="Wx1Tcl6G535cP5YaEFEI0Cera40IbgFR+xIQpoD6XKE=" name="csrf-token" />
9
+ <meta content="k6tYwi2KG7zh2v2m9HBxWdCbUjAIemB7MHawR1w6IaU=" name="csrf-token" />
10
10
  <link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
11
11
  <script type="text/javascript" charset="utf-8">
12
12
  App = {};
@@ -67,9 +67,6 @@ $font-size-h4: ceil(($font-size-base * 1.25)) !default; // ~18px
67
67
  $font-size-h5: $font-size-base !default;
68
68
  $font-size-h6: ceil(($font-size-base * 0.85)) !default; // ~12px
69
69
 
70
- $magicDefaultFontSize: 13px !default;
71
- $magicDefaultLineHight: 18px !default;
72
-
73
70
  $loud-factor: 1.25 !default;
74
71
  $louder-factor: 1.75 !default;
75
72
 
@@ -52,6 +52,13 @@ $border-radius-small: 3px !default;
52
52
  $border-radius-xs: 3px !default;
53
53
 
54
54
 
55
+
56
+ // press
57
+ $general-vertical-spacing: $line-height-computed !default; // .press .. and so on
58
+ $general-vertical-spacing-half: ceil($line-height-computed / 2) !default; // .press .. and so on
59
+
60
+
61
+
55
62
  // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // //
56
63
  // Sections
57
64
  //
@@ -245,7 +252,7 @@ $container-lg: $container-large-desktop !default;
245
252
  // -----|< - >|your text|< - >|------
246
253
  $divider-horizontal-spacing: 20px !default;
247
254
  // for .divider and hr elements
248
- $divider-vertical-spacing: $line-height-computed !default;
255
+ $divider-vertical-spacing: $general-vertical-spacing !default;
249
256
  $divider-top-color: rgba(0,0,0,.23) !default;
250
257
  $divider-bottom-color: rgba(255,255,255,.65) !default;
251
258
 
@@ -4,7 +4,7 @@
4
4
  }
5
5
 
6
6
  .box {
7
- margin: 0 0 20px; padding: 10px;
7
+ margin: 0 0 $general-vertical-spacing; padding: 10px;
8
8
  border: solid 1px $main-border-color;
9
9
  @include border-radius(3px);
10
10
  text-align: left;
@@ -30,8 +30,8 @@
30
30
  &, h1, h2, h3, h4, h5, h6, p, span, .h1, .h2, .h3, .h4, .h5, .h6 {
31
31
  margin: 0; padding: 0 5px 2px;
32
32
  color: $brand-color;
33
- line-height: 27px;
34
- font-size: 18px;
33
+ line-height: $line-height-large;
34
+ font-size: $font-size-large;
35
35
  }
36
36
 
37
37
  &.blank { border-bottom: solid 1px transparent; }
@@ -57,9 +57,9 @@
57
57
  h2 { font-weight: normal; }
58
58
  p, address {
59
59
  display: block; position: relative;
60
- margin-bottom: 20px;
60
+ margin-bottom: $line-height-computed;
61
61
  font-style: normal;
62
- line-height: 20px;
62
+ line-height: $line-height-base;
63
63
  color: #aaa;
64
64
  }
65
65
  .screw {
@@ -88,7 +88,7 @@
88
88
  padding: 70px 60px 80px 80px;
89
89
  min-height: 650px;
90
90
  h1 {
91
- font-size: 24px;
91
+ font-size: $font-size-xl;
92
92
  font-weight: 600;
93
93
  text-align: center;
94
94
  margin: 0 0 50px;
@@ -98,11 +98,11 @@
98
98
  }
99
99
  h2 {
100
100
  margin: 50px 0 10px;
101
- font-size: 18px;
101
+ font-size: $font-size-large;
102
102
  font-weight: 600;
103
103
  }
104
- h3 { font-size: 20px; }
105
- h4 { font-size: 18px; }
104
+ h3 { font-size: $font-size-xl; }
105
+ h4 { font-size: $font-size-large; }
106
106
  & > *:first-child { margin-top: 0; }
107
107
  }
108
108
 
@@ -184,13 +184,13 @@
184
184
  &.product {
185
185
  text-align: center;
186
186
  .product-name {
187
- font-size: 20px;
187
+ font-size: $font-size-large;
188
188
  font-weight: bold;
189
189
  line-height: 26px;
190
190
  color: #222;
191
191
  }
192
192
  .product-facts {
193
- font-size: 14px;
193
+ font-size: $font-size-small;
194
194
  font-weight: normal;
195
195
  line-height: 18px;
196
196
  color: #777;
@@ -205,18 +205,18 @@
205
205
  .header {
206
206
  padding: 5px 10px;
207
207
  margin: 0;
208
- line-height: 30px;
209
- font-size: 16px;
208
+ line-height: $line-height-computed-lg;
209
+ font-size: $font-size-large;
210
210
  font-weight: 400;
211
211
  background: #e5e5e5;
212
212
  color: #333;
213
- i, i:before { color: transparentize($blue, 0.5); font-size: 16px; }
213
+ i, i:before { color: transparentize($blue, 0.5); font-size: $font-size-large; }
214
214
  h1, h2, h3 {
215
215
  color: #333;
216
- font-size: 22px;
216
+ font-size: $font-size-xl;
217
217
  }
218
218
  p {
219
- font-size: 13px;
219
+ font-size: $font-size-base;
220
220
  color: #777;
221
221
  }
222
222
  }
@@ -253,7 +253,7 @@
253
253
  }
254
254
 
255
255
  &.press {
256
- margin-bottom: 20px !important;
256
+ margin-bottom: $line-height-computed !important;
257
257
  }
258
258
 
259
259
  }
@@ -264,7 +264,7 @@
264
264
 
265
265
  .list-box {
266
266
  display: table; position: relative;
267
- margin: 0 0 10px; padding: 5px 0;
267
+ margin: 0 0 $general-vertical-spacing-half; padding: 5px 0;
268
268
  background-color: #fff;
269
269
  width: 100%;
270
270
  border-spacing: 10px 0;
@@ -322,20 +322,20 @@
322
322
  .feature-heading {
323
323
  font-size: 35px;
324
324
  line-height: 40px;
325
- margin: 0 0 20px;
325
+ margin: 0 0 $general-vertical-spacing;
326
326
  text-shadow: 0 1px 0 #fff;
327
327
  }
328
328
  p.loud, p.highlight { font-size: 24px; }
329
329
  p.highlight { font-style: italic; color: #555; }
330
330
  &.ready {
331
331
  .feature-icon {
332
- margin: 0 auto 20px;
332
+ margin: 0 auto $general-vertical-spacing;
333
333
  border: solid 5px transparentize($brand-color, 0.5);
334
334
  i { background: $brand-color; }
335
335
  }
336
336
  }
337
337
  &.pending {
338
- .feature-heading { font-size: 25px; margin: 0 0 10px; }
338
+ .feature-heading { font-size: 25px; margin: 0 0 $general-vertical-spacing-half; }
339
339
  p.loud, p.highlight { font-size: 15px; }
340
340
  }
341
341
  }
@@ -272,7 +272,7 @@
272
272
  @include box-sizing(border-box);
273
273
  display: table;
274
274
  width: 100%;
275
- margin: 0 0 10px;
275
+ margin: 0 0 $general-vertical-spacing-half;
276
276
  text-decoration: none;
277
277
  .btn {
278
278
  display: table-cell;
@@ -17,7 +17,7 @@
17
17
 
18
18
  .inpt-group {
19
19
  display: block; position: relative;
20
- margin: 0 0 20px; padding: 0;
20
+ margin: 0 0 $general-vertical-spacing; padding: 0;
21
21
  .form-control {
22
22
  position: relative;
23
23
  margin: 0 0 -1px !important;
@@ -97,7 +97,7 @@ form.corset, .form {
97
97
  color: #aaa;
98
98
  text-shadow: 0 1px 1px #fff;
99
99
  font-family: 'Glyphicons Halflings'; font-weight: normal; font-style: normal;
100
- font-size: 14px;
100
+ font-size: $font-size-base;
101
101
  }
102
102
  // input {
103
103
  // display: block; position: relative;
@@ -116,7 +116,7 @@ form.corset, .form {
116
116
  height: 42px;
117
117
  font-size: 18px;
118
118
  @include placeholder {
119
- font-size: 18px;
119
+ font-size: $font-size-large;
120
120
  color: rgba(0,0,0,.20);
121
121
  }
122
122
  @include border-radius(0);
@@ -127,7 +127,7 @@ form.corset, .form {
127
127
  width: 30px; line-height: 44px;
128
128
  content: "\f021";
129
129
  text-shadow: 0 1px 0 rgba(0,0,0,.01);
130
- font-size: 18px;
130
+ font-size: $font-size-large;
131
131
  }
132
132
  }
133
133
  // glyphicons
@@ -195,12 +195,12 @@ form.corset, .form {
195
195
  form, .form {
196
196
 
197
197
  @include all_form_elements {
198
- &.form-control { margin-bottom: 10px; }
198
+ &.form-control { margin-bottom: $general-vertical-spacing-half; }
199
199
  }
200
- .btn-divided, .btn-splited, .btn-block { margin-bottom: 10px; }
200
+ .btn-divided, .btn-splited, .btn-block { margin-bottom: $general-vertical-spacing-half; }
201
201
 
202
202
  .row > * {
203
- margin-bottom: 10px;
203
+ margin-bottom: $general-vertical-spacing-half;
204
204
  @include all_form_elements { &.form-control { margin-bottom: 0; } }
205
205
  .btn-divided, .btn-splited, .btn-block { margin-bottom: 0; }
206
206
  }
@@ -1,30 +1,30 @@
1
1
  // media max-width: 767px
2
2
  @include responsiveStep-xs-only {
3
- .press-xs { margin-bottom:20px; }
3
+ .press-xs { margin-bottom: $general-vertical-spacing; }
4
4
  .hide-xs { display: none !important; }
5
5
  }
6
6
 
7
7
  // media min-width: 768px and max-width: 991px
8
8
  @include responsiveStep-sm-only {
9
- .press-sm { margin-bottom:20px; }
9
+ .press-sm { margin-bottom: $general-vertical-spacing; }
10
10
  .hide-sm { display: none !important; }
11
11
  }
12
12
 
13
13
  // media min-width: 992px and max-width: 1199px
14
14
  @include responsiveStep-md-only {
15
- .press-md { margin-bottom:20px; }
15
+ .press-md { margin-bottom:$general-vertical-spacing; }
16
16
  .hide-md { display: none !important; }
17
17
  }
18
18
 
19
19
  // media min-width: 1200px and max-width: 1599px
20
20
  @include responsiveStep-lg-only {
21
- .press-lg { margin-bottom:20px; }
21
+ .press-lg { margin-bottom:$general-vertical-spacing; }
22
22
  .hide-lg { display: none !important; }
23
23
  }
24
24
 
25
25
  // media min-width: 1600px
26
26
  @include responsiveStep-xl {
27
- .press-xl { margin-bottom:20px; }
27
+ .press-xl { margin-bottom:$general-vertical-spacing; }
28
28
  .hide-xl { display: none !important; }
29
29
  }
30
30
 
@@ -35,14 +35,14 @@
35
35
  }
36
36
 
37
37
 
38
- .press { margin-bottom: 20px !important; }
39
- .half-press, .press-half { margin-bottom: 10px !important; }
38
+ .press { margin-bottom: $general-vertical-spacing !important; }
39
+ .half-press, .press-half { margin-bottom: $general-vertical-spacing-half !important; }
40
40
  .no-press { margin-bottom: 0 !important; }
41
- .col-press { margin-bottom: 30px !important; }
41
+ .col-press { margin-bottom: $grid-gutter-width !important; }
42
42
 
43
- .press-top { margin-top: 20px !important; }
44
- .press-left { margin-left: 20px !important; }
45
- .press-right { margin-right: 20px !important; }
43
+ .press-top { margin-top: $general-vertical-spacing !important; }
44
+ .press-left { margin-left: $general-vertical-spacing !important; }
45
+ .press-right { margin-right: $general-vertical-spacing !important; }
46
46
 
47
47
 
48
48
  .no-press-top { margin-top: 0 !important; }
@@ -10,9 +10,9 @@
10
10
  top: -1px; right: -4px;
11
11
  background: $orange;
12
12
  color: #fff;
13
- @include border-radius(20px);
14
- width: 24px; height: 24px;
15
- line-height: 24px;
16
- font-size: 18px;
13
+ @include border-radius($line-height-computed-lg);
14
+ width: $line-height-computed-lg; height: $line-height-computed-lg;
15
+ line-height: $line-height-computed-lg;
16
+ font-size: $font-size-large;
17
17
  }
18
18
  }
@@ -8,7 +8,7 @@
8
8
  display: block; position: relative;
9
9
  overflow: hidden;
10
10
  line-height: 50px;
11
- font-size: 18px;
11
+ font-size: $font-size-large;
12
12
  color: #656565;
13
13
  @include border-radius(0);
14
14
  .cell.number, .cell.state-icon {
@@ -19,7 +19,7 @@
19
19
  background: $brand-color;
20
20
  font-weight: bold;
21
21
  color: #fff;
22
- font-size: 24px;
22
+ font-size: $font-size-xl;
23
23
  }
24
24
  .cell.text {
25
25
  padding: 0 20px;
@@ -28,9 +28,10 @@
28
28
  &:last-child { border-bottom: none; }
29
29
  & > * {
30
30
  padding: 5px 0;
31
+ $pic_size: $line-height-computed * 2 + 10;
31
32
  @include clearfix;
32
33
  .pic {
33
- width: 50px;
34
+ width: $pic_size;
34
35
  border: solid 1px $main-border-color;
35
36
  float: left;
36
37
  img {
@@ -40,15 +41,15 @@
40
41
  }
41
42
  .facts {
42
43
  padding: 5px 0;
43
- margin-left: 60px;
44
+ margin-left: $pic_size + 10;
44
45
  .head {
45
- line-height: 20px;
46
- font-size: 13px;
46
+ line-height: $line-height-computed;
47
+ font-size: $font-size-small;
47
48
  font-weight: bold;
48
49
  }
49
50
  .body {
50
- line-height: 20px;
51
- // font-size: 15px;
51
+ line-height: $line-height-computed;
52
+ font-size: $font-size-base;
52
53
  font-weight: normal;
53
54
  }
54
55
  }
@@ -51,7 +51,7 @@ hr, .divider {
51
51
 
52
52
  &.no-press { margin: 0; }
53
53
  &.no-press-top, &.no-top-press { margin-top: 0; }
54
- &.no-press-top, &.no-top-press { margin-bottom: 0; }
54
+ &.no-press-bottom, &.no-bottom-press { margin-bottom: 0; }
55
55
 
56
56
  &.half-press, &.press-half { @include vertical-margin( $divider-vertical-spacing / 2 ); }
57
57
 
@@ -22,5 +22,5 @@
22
22
  background-color: $pink;
23
23
  font-size: 40px;
24
24
  font-weight: 800;
25
- margin: 0 auto 10px;
25
+ margin: 0 auto $general-vertical-spacing-half;
26
26
  }
@@ -70,8 +70,8 @@ ul, ol, li, p, span, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
70
70
 
71
71
 
72
72
  h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p {
73
- &.press { margin-bottom: 20px; }
74
- &.press-half, &.half-press { margin-bottom: 10px; }
73
+ &.press { margin-bottom: $general-vertical-spacing; }
74
+ &.press-half, &.half-press { margin-bottom: $general-vertical-spacing-half; }
75
75
  &.no-press { margin: 0; }
76
76
  }
77
77
 
@@ -149,7 +149,7 @@ table.layout {
149
149
  .layout-table, .layout-slider {
150
150
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
151
151
  display: table; position: relative;
152
- margin: 0 0 10px; padding: 0;
152
+ margin: 0 0 $general-vertical-spacing-half; padding: 0;
153
153
  border: solid 1px #ccc;
154
154
  background: #fff;
155
155
  @include border-radius(5px);
@@ -229,9 +229,6 @@ table.layout {
229
229
  margin: 0;
230
230
  @include border-radius( 0 );
231
231
  @include box-sizing(border-box);
232
- height: 30px;
233
- line-height: 20px;
234
- padding: 4px 10px;
235
232
  width: 100%;
236
233
  border: solid 1px $gray-light;
237
234
  border-right: none;
@@ -251,7 +248,7 @@ table.layout {
251
248
  .layout-box {
252
249
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
253
250
  display: table; position: relative;
254
- margin: 0 0 10px; padding: 0;
251
+ margin: 0 0 $general-vertical-spacing-half; padding: 0;
255
252
  background: #fff;
256
253
  border: solid 1px #ccc;
257
254
  @include border-radius(5px);
@@ -41,7 +41,7 @@ $lyt_border_radius: 5px;
41
41
  .layout-table, .layout-slider {
42
42
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
43
43
  display: table;
44
- margin: 0 0 10px;
44
+ margin: 0 0 $general-vertical-spacing-half;
45
45
  border: solid 1px $main-border-color;
46
46
  background: #fff;
47
47
  @include border-radius(5px);
@@ -146,7 +146,7 @@ $lyt_border_radius: 5px;
146
146
  border: solid 1px $main-border-color;
147
147
  @include border-radius(3px);
148
148
  background: #fff;
149
- margin: 0 0 10px;
149
+ margin: 0 0 $general-vertical-spacing-half;
150
150
  padding: 5px;
151
151
  @include box-sizing(border-box);
152
152
  text-align: left;
@@ -196,7 +196,7 @@ $lyt_border_radius: 5px;
196
196
  .layout-box {
197
197
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
198
198
  display: table;
199
- margin: 0 0 10px;
199
+ margin: 0 0 $general-vertical-spacing-half;
200
200
  background: #fff;
201
201
  border: solid 1px $main-border-color;
202
202
  @include border-radius(5px);
@@ -317,7 +317,7 @@ $lyt_border_radius: 5px;
317
317
  @include border-radius(5px);
318
318
  border: solid 1px $main-border-color;
319
319
  width: auto;
320
- margin: 0 0 10px;
320
+ margin: 0 0 $general-vertical-spacing-half;
321
321
  &.aside, &.small, &.tiny { width: auto; }
322
322
  }
323
323
  & > .cell, & > .box, & > .cell + .cell, & > .box + .box {
@@ -20,7 +20,7 @@ $lyt_border_radius: 5px;
20
20
  background: #fff;
21
21
  @include border-radius($lyt_border_radius);
22
22
  border: solid 1px $lyt_border_color;
23
- margin: 0 0 10px;
23
+ margin: 0 0 $general-vertical-spacing-half;
24
24
  &.aside, &.small, &.tiny { width: auto; }
25
25
  &:first-child { @include border-radius($lyt_border_radius); }
26
26
  &:last-child { @include border-radius($lyt_border_radius); /*border: solid 1px $lyt_border_color;*/ }
@@ -136,7 +136,7 @@ $lyt_border_radius: 5px;
136
136
 
137
137
  .layout-table, .layout-slider {
138
138
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
139
- margin: 0 0 10px;
139
+ margin: 0 0 $general-vertical-spacing-half;
140
140
  border: solid 1px $lyt_border_color;
141
141
  background: $lyt_background_color;
142
142
  @include border-radius($lyt_border_radius);
@@ -181,7 +181,7 @@ $lyt_border_radius: 5px;
181
181
 
182
182
  .layout-box {
183
183
  @include raised_shadow( rgba(0, 0, 0, 0.5), 1 );
184
- margin: 0 0 10px;
184
+ margin: 0 0 $general-vertical-spacing-half;
185
185
  background: #fff;
186
186
  border: solid 1px $main-border-color;
187
187
  @include border-radius(5px);
@@ -6,8 +6,8 @@
6
6
  @mixin dekoFont { font-family: $dekoFont; }
7
7
  @mixin magicDefaultFont {
8
8
  @include readFont;
9
- font-size: $magicDefaultFontSize;
10
- line-height: $magicDefaultLineHight;
9
+ font-size: $font-size-base;
10
+ line-height: $line-height-base;
11
11
  }
12
12
  @mixin sansThin {
13
13
  // font-family: 'Open Sans', sans-serif;
@@ -17,8 +17,8 @@
17
17
  display: block; position: relative;
18
18
  margin: 0; padding: 5px 10px;
19
19
  @include sansCondensedBold;
20
- line-height: 30px;
21
- font-size: 14px;
20
+ line-height: $line-height-computed + 10;
21
+ font-size: $font-size-base;
22
22
  text-decoration: none;
23
23
  color: $gray;
24
24
  background: transparent;
@@ -27,7 +27,7 @@
27
27
  line-height: inherit;
28
28
  @include border-radius( 10px );
29
29
  padding: 0;
30
- width: 30px;
30
+ width: $line-height-computed + 10;
31
31
  margin-left: 10px;
32
32
  text-align: center;
33
33
  // background: $gray-light;
@@ -75,8 +75,7 @@
75
75
 
76
76
  a, span.lst_lnk {
77
77
  padding: 5px 10px;
78
- line-height: 20px;
79
- font-size: 14px;
78
+ line-height: $line-height-computed;
80
79
 
81
80
  background: $gray-softer;
82
81
 
@@ -92,8 +91,8 @@
92
91
  // &:first-child { border-top: solid 1px $gray-light; }
93
92
 
94
93
  a, span.lst_lnk {
95
- line-height: 16px;
96
- font-size: 11px;
94
+ line-height: $line-height-computed-sm;
95
+ font-size: $font-size-small;
97
96
  // color: $gray;
98
97
  @include sansSemi;
99
98
  }
@@ -142,7 +141,7 @@
142
141
 
143
142
  a, span {
144
143
  i {
145
- font-size: 18px;
144
+ font-size: $font-size-large;
146
145
  margin-right: 3px;
147
146
  }
148
147
  &:hover {
@@ -189,22 +188,22 @@
189
188
 
190
189
  &.arrow li {
191
190
  a {
192
- padding-right: 30px;
191
+ padding-right: $line-height-computed + 10;
193
192
  &:after {
194
193
  display: block;
195
194
  position: absolute;
196
195
  top: 12px; right: 5px;
197
- line-height: 30px;
196
+ line-height: $line-height-computed + 10;
198
197
  content: "\f23b";
199
198
  font-family: magiconsregular;
200
199
  font-weight: normal;
201
200
  font-style: normal;
202
- font-size: 18px;
201
+ font-size: $font-size-large;
203
202
  color: $gray-light;
204
203
  }
205
204
  }
206
205
  &.current > a { &:after { content: "\f23c"; } }
207
- .sub_nav li a:after { top: 7px; line-height: 20px; font-size: 16px; }
206
+ .sub_nav li a:after { top: 7px; line-height: $line-height-computed; font-size: $font-size-base; }
208
207
  }
209
208
 
210
209
  }
@@ -218,7 +217,7 @@
218
217
  a {
219
218
  background: transparent;
220
219
  padding: 11px 10px;
221
- line-height: 20px;
220
+ line-height: $line-height-computed;
222
221
  color: #333;
223
222
  font-weight: 300;
224
223
  }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: magic_stylez
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.0.87
4
+ version: 0.0.0.88
5
5
  platform: ruby
6
6
  authors:
7
7
  - Torsten Wetzel
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2015-10-01 00:00:00.000000000 Z
11
+ date: 2015-10-19 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -228,6 +228,7 @@ files:
228
228
  - test/dummy/app/assets/javascripts/application.js
229
229
  - test/dummy/app/assets/javascripts/assets.js.coffee.erb
230
230
  - test/dummy/app/assets/javascripts/blank.js.coffee
231
+ - test/dummy/app/assets/javascripts/views/app/changelog.jst.eco
231
232
  - test/dummy/app/assets/javascripts/views/app/start.jst.eco
232
233
  - test/dummy/app/assets/javascripts/views/content/banner.jst.eco
233
234
  - test/dummy/app/assets/javascripts/views/content/box.jst.eco
@@ -444,7 +445,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
444
445
  version: '0'
445
446
  requirements: []
446
447
  rubyforge_project:
447
- rubygems_version: 2.2.2
448
+ rubygems_version: 2.4.5
448
449
  signing_key:
449
450
  specification_version: 4
450
451
  summary: A set of sass helper depending on bourbon and bootstrap-sass.
@@ -466,6 +467,7 @@ test_files:
466
467
  - test/dummy/app/assets/javascripts/application.js
467
468
  - test/dummy/app/assets/javascripts/assets.js.coffee.erb
468
469
  - test/dummy/app/assets/javascripts/blank.js.coffee
470
+ - test/dummy/app/assets/javascripts/views/app/changelog.jst.eco
469
471
  - test/dummy/app/assets/javascripts/views/app/start.jst.eco
470
472
  - test/dummy/app/assets/javascripts/views/content/banner.jst.eco
471
473
  - test/dummy/app/assets/javascripts/views/content/box.jst.eco