magic_stylez 0.0.0.87 → 0.0.0.88
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 +4 -4
- data/lib/magic_stylez/version.rb +1 -1
- data/test/dummy/app/assets/javascripts/views/app/changelog.jst.eco +104 -0
- data/test/dummy/app/assets/javascripts/views/app/start.jst.eco +2 -47
- data/test/dummy/app/assets/stylesheets/corporate/_fonts.scss +15 -0
- data/test/dummy/app/assets/stylesheets/corporate/_variables.scss +21 -0
- data/test/dummy/app/views/front/_aside.html.erb +1 -0
- data/test/dummy/app/views/front/start.html.erb +4 -48
- data/test/dummy/public/html/aside-nav.html +2 -2
- data/test/dummy/public/html/fixed-header.html +2 -2
- data/test/dummy/public/html/fixed-subnav.html +2 -2
- data/test/dummy/public/html/index.html +8 -51
- data/test/dummy/public/html/slidebar-header.html +2 -2
- data/test/dummy/public/html/slidebar-subnav.html +2 -2
- data/vendor/assets/stylesheets/corporate/_fonts.scss +0 -3
- data/vendor/assets/stylesheets/corporate/_variables.scss +8 -1
- data/vendor/assets/stylesheets/magic/content/_box.scss +21 -21
- data/vendor/assets/stylesheets/magic/content/_buttons.scss +1 -1
- data/vendor/assets/stylesheets/magic/content/_forms.scss +7 -7
- data/vendor/assets/stylesheets/magic/content/_helper.scss +11 -11
- data/vendor/assets/stylesheets/magic/content/_icons.scss +4 -4
- data/vendor/assets/stylesheets/magic/content/_panel.scss +2 -2
- data/vendor/assets/stylesheets/magic/content/_pix.scss +7 -6
- data/vendor/assets/stylesheets/magic/helper/_divider.scss +1 -1
- data/vendor/assets/stylesheets/magic/helper/_dots.scss +1 -1
- data/vendor/assets/stylesheets/magic/helper/_text.scss +2 -2
- data/vendor/assets/stylesheets/magic/layout/_tables_v1.scss +2 -5
- data/vendor/assets/stylesheets/magic/layout/_tables_v2.scss +4 -4
- data/vendor/assets/stylesheets/magic/layout/_tables_v3.scss +3 -3
- data/vendor/assets/stylesheets/magic/lib/_text.scss +2 -2
- data/vendor/assets/stylesheets/magic/lists/_nav.scss +12 -13
- metadata +5 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 0a9ef18bcad96ab7a2d1d3a839f32919601264c5
|
|
4
|
+
data.tar.gz: 938a29665e56b3fc9be46f5034f68e06c20d8404
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 9dfca73d9878824456a911b6ec901d4b2da22e3628fbe336b35ff8ef475101f2a801a949252f54c46f9953a2e8159db0f4d260aec738b0dcad77eadd6b3d984c
|
|
7
|
+
data.tar.gz: 9718f988b1533810bfd9429a4c1a03c0d934865cbe9e6c01d3a7390fff0f5db4648d6c0c2ffaa569c396cd514cc694ef88f8eb4755c124b134abb58d6cf88ff6
|
data/lib/magic_stylez/version.rb
CHANGED
|
@@ -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
|
+
|
|
@@ -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-
|
|
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="
|
|
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-
|
|
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="
|
|
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-
|
|
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="
|
|
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-
|
|
10
|
-
<script src="//berlinmagic.github.io/magic_stylez/assets/application-
|
|
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="
|
|
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-
|
|
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="
|
|
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-
|
|
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="
|
|
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: $
|
|
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
|
|
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:
|
|
34
|
-
font-size:
|
|
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:
|
|
60
|
+
margin-bottom: $line-height-computed;
|
|
61
61
|
font-style: normal;
|
|
62
|
-
line-height:
|
|
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:
|
|
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:
|
|
101
|
+
font-size: $font-size-large;
|
|
102
102
|
font-weight: 600;
|
|
103
103
|
}
|
|
104
|
-
h3 { font-size:
|
|
105
|
-
h4 { font-size:
|
|
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:
|
|
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:
|
|
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:
|
|
209
|
-
font-size:
|
|
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:
|
|
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:
|
|
216
|
+
font-size: $font-size-xl;
|
|
217
217
|
}
|
|
218
218
|
p {
|
|
219
|
-
font-size:
|
|
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:
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
}
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
|
|
18
18
|
.inpt-group {
|
|
19
19
|
display: block; position: relative;
|
|
20
|
-
margin: 0 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:
|
|
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:
|
|
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:
|
|
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:
|
|
198
|
+
&.form-control { margin-bottom: $general-vertical-spacing-half; }
|
|
199
199
|
}
|
|
200
|
-
.btn-divided, .btn-splited, .btn-block { margin-bottom:
|
|
200
|
+
.btn-divided, .btn-splited, .btn-block { margin-bottom: $general-vertical-spacing-half; }
|
|
201
201
|
|
|
202
202
|
.row > * {
|
|
203
|
-
margin-bottom:
|
|
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:
|
|
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:
|
|
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
|
|
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
|
|
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
|
|
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:
|
|
39
|
-
.half-press, .press-half { margin-bottom:
|
|
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:
|
|
41
|
+
.col-press { margin-bottom: $grid-gutter-width !important; }
|
|
42
42
|
|
|
43
|
-
.press-top { margin-top:
|
|
44
|
-
.press-left { margin-left:
|
|
45
|
-
.press-right { margin-right:
|
|
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(
|
|
14
|
-
width:
|
|
15
|
-
line-height:
|
|
16
|
-
font-size:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
44
|
+
margin-left: $pic_size + 10;
|
|
44
45
|
.head {
|
|
45
|
-
line-height:
|
|
46
|
-
font-size:
|
|
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:
|
|
51
|
-
|
|
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-
|
|
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
|
|
|
@@ -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:
|
|
74
|
-
&.press-half, &.half-press { margin-bottom:
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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: $
|
|
10
|
-
line-height: $
|
|
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:
|
|
21
|
-
font-size:
|
|
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:
|
|
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:
|
|
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:
|
|
96
|
-
font-size:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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.
|
|
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-
|
|
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.
|
|
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
|