lines-engine 0.3.3.2 → 0.4

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 4b4eef4d13ccf7bd28bd4a4e6a965f2527040c6d
4
- data.tar.gz: d0c55814f56623426696e4a712fef0bba4361f4e
3
+ metadata.gz: f83af3f846afa013fa55aac736ddec0d5f685fff
4
+ data.tar.gz: 6ffefaa4ad0f1cdd4de98cfb326007794db219be
5
5
  SHA512:
6
- metadata.gz: be208c9d171d954305c05c8cb22f7a7f7596697316c58249cba2399668e0130fb0d24e1b13090ddb64e92549358b50ccc6ebf5d8f4fecbbea4cdcdff9d4cc2b6
7
- data.tar.gz: 90acb65bec8dc818c9749175e131000cafc2a6a1ec7404c3bdb3f9bebf729870f5e50b1e35288c98ab90817d24324b5098df758576ecf2f8f9181c780abe4915
6
+ metadata.gz: a1cca4cd481dd1c3df923cbcc43217836af82bafd99d749335b964358120a2b74e1ca4cf3898809ed48f452cd2753ba1cf473a95a1681aafc162db6f2575c1ca
7
+ data.tar.gz: baa9e13e55d96405632c7ddfa84d474936b89006493beb02ff35574ed5c0ed59852abc6ace91773218756561665fed573621ad2dde65857b08acc10a9c984506
data/CHANGELOG.md CHANGED
@@ -1,5 +1,10 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.4
4
+
5
+ - CSS finetuning. CSS files are now splitted into semantic parts.
6
+
7
+
3
8
  ## 0.3.3 / 0.3.3.1
4
9
 
5
10
  - Override file for custom CSS added (lines_overrides.css.scss)
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- lines-engine (0.3.3.2)
4
+ lines-engine (0.4)
5
5
  acts-as-taggable-on (~> 3.2.6, >= 3.2.6)
6
6
  bcrypt (~> 3.1.0, >= 3.1.0)
7
7
  carrierwave (~> 0.10.0, >= 0.10.0)
@@ -9,10 +9,14 @@
9
9
  * compiled file, but it's generally better to create a new file per style scope.
10
10
  *
11
11
  *= require_self
12
- *= require lines/fonts
13
- *= require lines/navbar
14
- *= require lines/style
15
12
  *= require lines/pygments
16
- *= require lines/media_queries
17
- *= require lines/lines_overrides
18
13
  */
14
+
15
+ @import 'fonts.css.scss';
16
+ @import 'variables_and_mixins.css.scss';
17
+ @import 'navbar.css.scss';
18
+ @import 'general.css.scss';
19
+ @import 'article.css.scss';
20
+ @import 'footer.css.scss';
21
+ @import 'media_queries.css.scss';
22
+ @import 'lines_overrides.css.scss';
@@ -0,0 +1,181 @@
1
+ .article {
2
+ max-width: $max-width;
3
+ font-family: $Merriweather;
4
+ line-height: 1.5em;
5
+ font-size: 1.125em;
6
+ color: #555;
7
+
8
+
9
+ h1, h2, h3, h4, h5 {
10
+ font-family: $SourceSansPro;
11
+ }
12
+
13
+ .article_header, .article_teaser, .article_content {
14
+ margin: 0 auto;
15
+
16
+ * { margin: 1.1em auto;}
17
+ & > * { padding: 0 13%; }
18
+ & > blockquote { padding: 0 5%; }
19
+ & > p img {
20
+ margin: 0 -10%;
21
+ max-width: 120%;
22
+ }
23
+ }
24
+
25
+ .hero_image {
26
+ margin-top: 1.2em;
27
+ }
28
+
29
+ .article_header {
30
+ text-align: center;
31
+ h1 {
32
+ font-size: 2.4em;
33
+ font-weight: 700;
34
+ line-height: 1.05em;
35
+ color: $orange;
36
+ a { color: $orange; }
37
+ a:hover { color:$darkgrey; }
38
+ }
39
+ h2 {
40
+ font-size: 1.333em;
41
+ font-weight: 400;
42
+ color: #b4b4b4;
43
+ line-height: 1.1em;
44
+ }
45
+ .author_name {
46
+ font-family: $MerriweatherSans;
47
+ font-size: 0.8em;
48
+ text-transform: uppercase;
49
+ }
50
+ }
51
+
52
+
53
+ .article_teaser {
54
+ font-size: 1.2em;
55
+ line-height: 1.8em;
56
+ font-weight: 400;
57
+ .more-link { display: none; }
58
+ }
59
+
60
+ .article_content {
61
+ line-height: 1.8em;
62
+
63
+ h1, h2, h3, h4, h5, h6 { margin-top: 3.0em; line-height: 1.15em; color: #333 }
64
+
65
+ h1 { font-size: 2.0em; }
66
+
67
+ h2 { font-size: 1.5em; }
68
+
69
+ h3 {
70
+ font-size: 1.25em;
71
+ color: $orange;
72
+ margin-bottom: 1.0em;
73
+ a { color: $orange; }
74
+ a:hover { color: $darkgrey; }
75
+ }
76
+
77
+ h4 { font-size: 1.111em; }
78
+
79
+ h5 { font-size: 1em; }
80
+
81
+ p {
82
+ display: block;
83
+ a { color: $orange; }
84
+ a:hover { color: $darkgrey; }
85
+ }
86
+
87
+ a { border-bottom: 1px solid #ccc; }
88
+
89
+ img { display: block; margin: 0 auto; }
90
+
91
+ br { display: block; margin: 0; padding: 0;}
92
+
93
+ ul, ol { }
94
+ ul {
95
+ margin-left: 2em;
96
+ margin-right: 2em;
97
+ li { margin: 0.5em 0; }
98
+ }
99
+
100
+ blockquote {
101
+ font-family: $Merriweather;
102
+ font-style: italic;
103
+ font-size: 1.5em;
104
+ line-height: 1.5em;
105
+ color:#999;
106
+ em:last-child { font-family: $MerriweatherSans; font-style: normal; font-size: 1.0rem; }
107
+ strong { font-weight: bold; }
108
+ }
109
+
110
+ pre {
111
+ font-size: 1.0em;
112
+ }
113
+
114
+ .highlight pre { margin: auto 2em; }
115
+ }
116
+
117
+ .article_footer {
118
+ border-top: 1px solid #ccc;
119
+ border-bottom: 1px solid #ccc;
120
+ text-align: center;
121
+ color: #808080;
122
+ font-size: 0.8em;
123
+ a { color: $orange; }
124
+ a:hover { color: $darkgrey; }
125
+ }
126
+
127
+ .article_googleplus {
128
+ border-top: 1px solid #ccc;
129
+ padding: 1.1em;
130
+ min-height: 40px;
131
+ line-height: 40px;
132
+ text-align: center;
133
+ a {
134
+ margin: 0 auto;
135
+ display: inline-block;
136
+ color: $lightgrey;
137
+ &:hover { color: $darkgrey; }
138
+ }
139
+ span {
140
+ background: url('/assets/ic_googleplus.png') 0px 0px no-repeat;
141
+ height: 40px;
142
+ width: 40px;
143
+ line-height: 40px;
144
+ display: inline-block;
145
+ float: left;
146
+ margin: 0 15px 0 0;
147
+ }
148
+ }
149
+
150
+
151
+ &.small {
152
+ max-width: 50%;
153
+ float: left;
154
+ .article_header {
155
+ h1 { font-size: 1.8em; }
156
+ h2 { display: none; }
157
+ }
158
+ .article_teaser {
159
+ p { font-size: 1.0rem; line-height: 1.5em; }
160
+ .more-link {
161
+ display: block;
162
+ margin:40px auto 0 auto;
163
+ text-align: center;
164
+ a {
165
+ display: inline-block;
166
+ text-transform: uppercase;
167
+ letter-spacing: 0.06em;
168
+ font-size:0.8em;
169
+ background-color: #f4f4f4;
170
+ padding:5px 10px;
171
+ color: #4d4d4d;
172
+ display:block;
173
+ width:100%;
174
+ text-align:center;
175
+ &:hover { background-color: #e7e7e7; }
176
+ }
177
+ }
178
+ }
179
+ .article_googleplus, .article_footer, .article_content { display:none; }
180
+ }
181
+ }
@@ -1,4 +1,8 @@
1
- /*------------------------ 1. FONTS -----------------------*/
1
+ @import url(//fonts.googleapis.com/css?family=Merriweather:400,400italic,700);
2
+ @import url(//fonts.googleapis.com/css?family=Merriweather+Sans:400,700);
3
+ @import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,700italic,900);
4
+ @import url(//fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic,700italic&subset=latin,latin-ext);
5
+
2
6
  @font-face {
3
7
  font-family: 'BPmono';
4
8
  src: url('/assets/BPmono-webfont.eot');
@@ -31,69 +35,3 @@
31
35
  font-weight: bold;
32
36
  font-style: normal;
33
37
  }
34
-
35
- @font-face {
36
- font-family: 'Museo';
37
- src: url('/assets/Museo500-Regular-webfont.eot');
38
- src: url('/assets/Museo500-Regular-webfont.eot?#iefix') format('embedded-opentype'),
39
- url('/assets/Museo500-Regular-webfont.woff') format('woff'),
40
- url('/assets/Museo500-Regular-webfont.ttf') format('truetype'),
41
- url('/assets/Museo500-Regular-webfont.svg#Museo500-Regular-webfont') format('svg');
42
- font-weight: 500;
43
- font-style: normal;
44
- }
45
-
46
- @font-face {
47
- font-family: 'Museo';
48
- src: url('/assets/Museo300-Regular-webfont.eot');
49
- src: url('/assets/Museo300-Regular-webfont.eot?#iefix') format('embedded-opentype'),
50
- url('/assets/Museo300-Regular-webfont.woff') format('woff'),
51
- url('/assets/Museo300-Regular-webfont.ttf') format('truetype'),
52
- url('/assets/Museo300-Regular-webfont.svg#Museo300-Regular-webfont') format('svg');
53
- font-weight: 300;
54
- font-style: normal;
55
- }
56
-
57
- @font-face {
58
- font-family: 'Ubuntu';
59
- src: url('/assets/Ubuntu-R-webfont.eot');
60
- src: url('/assets/Ubuntu-R-webfont.eot?#iefix') format('embedded-opentype'),
61
- url('/assets/Ubuntu-R-webfont.woff') format('woff'),
62
- url('/assets/Ubuntu-R-webfont.ttf') format('truetype'),
63
- url('/assets/Ubuntu-R-webfont.svg#Ubuntu-R-webfont') format('svg');
64
- font-weight: normal;
65
- font-style: normal;
66
- }
67
-
68
- @font-face {
69
- font-family: 'Ubuntu';
70
- src: url('/assets/Ubuntu-B-webfont.eot');
71
- src: url('/assets/Ubuntu-B-webfont.eot?#iefix') format('embedded-opentype'),
72
- url('/assets/Ubuntu-B-webfont.woff') format('woff'),
73
- url('/assets/Ubuntu-B-webfont.ttf') format('truetype'),
74
- url('/assets/Ubuntu-B-webfont.svg#Ubuntu-B-webfont') format('svg');
75
- font-weight: bold;
76
- font-style: normal;
77
- }
78
-
79
- @font-face {
80
- font-family: 'Ubuntu';
81
- src: url('/assets/Ubuntu-RI-webfont.eot');
82
- src: url('/assets/Ubuntu-RI-webfont.eot?#iefix') format('embedded-opentype'),
83
- url('/assets/Ubuntu-RI-webfont.woff') format('woff'),
84
- url('/assets/Ubuntu-RI-webfont.ttf') format('truetype'),
85
- url('/assets/Ubuntu-RI-webfont.svg#Ubuntu-R-webfont') format('svg');
86
- font-weight: normal;
87
- font-style: italic;
88
- }
89
-
90
- @font-face {
91
- font-family: 'UbuntuLight';
92
- src: url('/assets/Ubuntu-L-webfont.eot');
93
- src: url('/assets/Ubuntu-L-webfont.eot?#iefix') format('embedded-opentype'),
94
- url('/assets/Ubuntu-L-webfont.woff') format('woff'),
95
- url('/assets/Ubuntu-L-webfont.ttf') format('truetype'),
96
- url('/assets/Ubuntu-L-webfont.svg#Ubuntu-L-webfont') format('svg');
97
- font-weight: normal;
98
- font-style: normal;
99
- }
@@ -0,0 +1,62 @@
1
+ footer, #footer {
2
+ background-color: #f4f4f4;
3
+ margin: 50px 0 0 0;
4
+ padding: 30px 0;
5
+
6
+ .container {
7
+ margin: 0 auto;
8
+ max-width: $max-width;
9
+ color: #999;
10
+ font-size: 0.85em;
11
+ font-family: $Merriweather;
12
+ .row {
13
+ text-align: left;
14
+ width: 100%;
15
+ .two-cols {
16
+ padding: 0 20px;
17
+ width: 50%;
18
+ line-height:24px;
19
+ float: left;
20
+ &:first-child {
21
+ margin-right: 0;
22
+ }
23
+ }
24
+ }
25
+ }
26
+
27
+ hr { background-color:#ccc; margin:40px 0px; }
28
+
29
+ h2, h2 a {
30
+ margin-top: 20px;
31
+ text-transform: uppercase;
32
+ font-family: $SourceSansPro;
33
+ font-size: 1.2em;
34
+ font-weight: 300;
35
+ letter-spacing: 0.03em;
36
+ }
37
+
38
+ span.label {
39
+ text-transform: uppercase;
40
+ font-size:13px;
41
+ color:#c0bfbf;
42
+ }
43
+
44
+ .weekday {
45
+ font-family: $SourceSansPro;
46
+ font-weight: 300;
47
+ color: $darkgrey;
48
+ }
49
+
50
+ #copyright {
51
+ text-align:center;
52
+ padding:50px 0 10px 0;
53
+ font-size:13px;
54
+ text-transform:uppercase;
55
+ letter-spacing: 0.05em;
56
+ line-height:24px;
57
+ a {
58
+ color:#999; font-family: $Merriweather;
59
+ &:hover { color: $orange; }
60
+ }
61
+ }
62
+ }
@@ -0,0 +1,81 @@
1
+ * {
2
+ margin: 0; padding: 0;
3
+ -webkit-box-sizing: border-box;
4
+ -moz-box-sizing: border-box;
5
+ box-sizing: border-box;
6
+ }
7
+
8
+ body { height: 100%; background-color: #fff; }
9
+
10
+ img, div { border: 0; display: block; }
11
+
12
+ div, header, footer { display: block; overflow: hidden; }
13
+
14
+ img {
15
+ max-width: 100%;
16
+ height: auto;
17
+ width: auto\9; /* ie8 */
18
+ }
19
+
20
+ a {
21
+ text-decoration: none;
22
+ color: $darkgrey;
23
+ @include addTransition(0.3);
24
+ &:hover { color: $orange; }
25
+ }
26
+
27
+ i, em { font-family: $Merriweather; font-style: italic; }
28
+ strong, b { font-family: $Merriweather; font-weight: bold; }
29
+
30
+ ul li { list-style-position: outside; }
31
+
32
+ hr { display: block; margin: 1.2em 0; height: 1px; background-color: #3d3d3d; border:none; }
33
+
34
+ .float-right { float:right; margin: 15px 0 5px 10px; }
35
+ .clearfix {
36
+ zoom:1; /* For IE 6/7 (trigger hasLayout) */
37
+ &:before, &:after { content: ""; display: table; }
38
+ &:after { clear: both; }
39
+ }
40
+
41
+ div.rss { display:none; }
42
+
43
+ /*--------------------------------------------------------*/
44
+ /*------------------------ HEADER ----------------------*/
45
+ /*--------------------------------------------------------*/
46
+
47
+ #topbar {
48
+ color: #fff;
49
+ font-size: 12px;
50
+ padding: 2px 0;
51
+ background-color: #000;
52
+ div { max-width: $max-width; margin: 0 auto; }
53
+ .right { float: right; }
54
+ a { color: #aaa; }
55
+ }
56
+
57
+ header {
58
+ margin: 0 auto;
59
+ max-width: $max-width;
60
+ padding: 1.1em;
61
+ font-family: $SourceSansPro;
62
+ font-weight: 500;
63
+ font-size: 1.188em;
64
+ border-bottom: 1px solid #e3e3e3;
65
+ a {
66
+ color: #000;
67
+ &:hover { color: $orange; }
68
+ }
69
+ #logo { float: left; }
70
+ #lines {
71
+ float: right;
72
+ font-size: 0.737em;
73
+ text-transform: uppercase;
74
+ }
75
+ }
76
+
77
+ .container {
78
+ position: relative;
79
+ max-width: $max-width;
80
+ margin: 0 auto;
81
+ }
@@ -8,14 +8,19 @@ smaller than 975px
8
8
  smaller than 800px
9
9
  *************************************************************************************/
10
10
  @media screen and (max-width: 800px) {
11
- html { font-size: 14px; }
11
+ html { font-size: 16px; }
12
+ .article {
13
+ .article_header, .article_teaser, .article_content {
14
+ & > * { padding: 0 8%; }
15
+ }
16
+ }
12
17
  }
13
18
 
14
19
  /************************************************************************************
15
20
  smaller than 600px
16
21
  *************************************************************************************/
17
22
  @media screen and (max-width: 600px) {
18
- html { font-size: 12px; }
23
+ html { font-size: 14px; }
19
24
  .article.small { width: 100%; max-width: 100%; }
20
25
  }
21
26
 
@@ -0,0 +1,38 @@
1
+ #pagination {
2
+ font-family: $Merriweather;
3
+ display: block;
4
+ overflow: visible;
5
+ border-top: 1px solid #ccc;
6
+ margin: 0px auto;
7
+ width: 100%;
8
+ text-transform: uppercase;
9
+ font-size: 1.5em;
10
+ padding: 30px 0 0 0;
11
+ text-align: center;
12
+ position: relative;
13
+ a {
14
+ color: $lightgrey;
15
+ &:hover { color: $darkgrey; }
16
+ }
17
+ .newer, .older { position: absolute; display: inline-block; }
18
+ .newer { left: 0px; }
19
+ .older { right: 0px; }
20
+ .prev, .first {
21
+ float: left;
22
+ padding: 0 10px;
23
+ }
24
+ .next, .last {
25
+ float: right;
26
+ padding: 0 10px;
27
+ }
28
+
29
+ .pages {
30
+ font-size: 0.7em;
31
+ color: lighten($lightgrey,30%);
32
+ a {
33
+ color: lighten($lightgrey,30%);
34
+ &:hover { color: $lightgrey; }
35
+ }
36
+ .current { color: $lightgrey; font-size: 1.50em; }
37
+ }
38
+ }
@@ -0,0 +1,17 @@
1
+ $max-width: 960px;
2
+
3
+ $darkgrey: #333;
4
+ $lightgrey: #666;
5
+ $orange: #ee4422;
6
+
7
+ $SourceSansPro: 'Source Sans Pro', 'Helvetica', 'Arial', sans-serif;
8
+ $MerriweatherSans: 'Merriweather Sans', 'Helvetica', 'Arial', sans-serif;
9
+ $Merriweather: 'Merriweather', 'Georgia', serif;
10
+
11
+ @mixin addTransition($x) {
12
+ transition: all $x+s ease;
13
+ -o-transition: all $x+s ease;
14
+ -ms-transition: all $x+s ease;
15
+ -moz-transition: all $x+s ease;
16
+ -webkit-transition: all $x+s ease;
17
+ }
@@ -14,12 +14,7 @@ module Lines
14
14
 
15
15
  def copy_stylesheets
16
16
  FileUtils.mkdir_p "app/assets/stylesheets/lines"
17
- copy_file "../../../app/assets/stylesheets/lines/lines_overrides.css.scss", "app/assets/stylesheets/lines/lines_overrides.css.scss"
18
- copy_file "../../../app/assets/stylesheets/lines/style.css.scss", "app/assets/stylesheets/lines/style.css.scss"
19
- copy_file "../../../app/assets/stylesheets/lines/fonts.css.scss", "app/assets/stylesheets/lines/fonts.css.scss"
20
- copy_file "../../../app/assets/stylesheets/lines/media_queries.css.scss", "app/assets/stylesheets/lines/media_queries.css.scss"
21
- copy_file "../../../app/assets/stylesheets/lines/navbar.css.scss", "app/assets/stylesheets/lines/navbar.css.scss"
22
- copy_file "../../../app/assets/stylesheets/lines/pygments.css.erb", "app/assets/stylesheets/lines/pygments.css.erb"
17
+ directory('../../../app/assets/stylesheets/lines/', 'app/assets/stylesheets/lines/', {:exclude_pattern => /admin/} )
23
18
  end
24
19
 
25
20
  def copy_views
data/lib/lines/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Lines
2
- VERSION = "0.3.3.2"
2
+ VERSION = "0.4"
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: lines-engine
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.3.3.2
4
+ version: '0.4'
5
5
  platform: ruby
6
6
  authors:
7
7
  - Opoloo GbR
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-11-05 00:00:00.000000000 Z
11
+ date: 2014-11-06 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: orm_adapter
@@ -645,13 +645,17 @@ files:
645
645
  - app/assets/javascripts/lines/autosize.min.js
646
646
  - app/assets/javascripts/lines/pictures.js.coffee
647
647
  - app/assets/stylesheets/lines/admin.css.scss
648
- - app/assets/stylesheets/lines/application.css
648
+ - app/assets/stylesheets/lines/application.css.scss
649
+ - app/assets/stylesheets/lines/article.css.scss
649
650
  - app/assets/stylesheets/lines/fonts.css.scss
651
+ - app/assets/stylesheets/lines/footer.css.scss
652
+ - app/assets/stylesheets/lines/general.css.scss
650
653
  - app/assets/stylesheets/lines/lines_overrides.css.scss
651
654
  - app/assets/stylesheets/lines/media_queries.css.scss
652
655
  - app/assets/stylesheets/lines/navbar.css.scss
656
+ - app/assets/stylesheets/lines/pagination.css.scss
653
657
  - app/assets/stylesheets/lines/pygments.css.erb
654
- - app/assets/stylesheets/lines/style.css.scss
658
+ - app/assets/stylesheets/lines/variables_and_mixins.css.scss
655
659
  - app/controllers/lines/admin/application_controller.rb
656
660
  - app/controllers/lines/admin/articles_controller.rb
657
661
  - app/controllers/lines/admin/authors_controller.rb
@@ -1,410 +0,0 @@
1
- $max-width: 960px;
2
-
3
- $darkgrey: #333;
4
- $lightgrey: #666;
5
- $orange: #e8581e;
6
-
7
- @mixin addTransition($x) {
8
- transition: all $x+s ease;
9
- -o-transition: all $x+s ease;
10
- -ms-transition: all $x+s ease;
11
- -moz-transition: all $x+s ease;
12
- -webkit-transition: all $x+s ease;
13
- }
14
-
15
- /*-----------------------------------------------------------*/
16
- /*----------------------- 1. GENERAL ----------------------*/
17
- /*-----------------------------------------------------------*/
18
-
19
- * {
20
- margin: 0; padding: 0;
21
- -webkit-box-sizing: border-box;
22
- -moz-box-sizing: border-box;
23
- box-sizing: border-box;
24
- }
25
-
26
- body {
27
- height: 100%;
28
- background-color: #fff;
29
- }
30
-
31
- img, div { border: 0; display: block; }
32
-
33
- div, header, footer { display: block; overflow: hidden; }
34
-
35
- img {
36
- max-width: 100%;
37
- height: auto;
38
- width: auto\9; /* ie8 */
39
- }
40
-
41
- a {
42
- text-decoration: none;
43
- color: $darkgrey;
44
- @include addTransition(0.3);
45
- &:hover { color: $orange; }
46
- }
47
-
48
- i, em, strong, b { font-weight: normal; font-style: normal; }
49
- i, em { font-family: 'Ubuntu'; font-style: italic; }
50
- strong, b { font-family: 'Ubuntu'; font-weight: bold; }
51
-
52
- ul li { list-style-position: inside; }
53
-
54
- hr { display: block; margin: 30px 0px; height: 1px; background-color: #3d3d3d; border:none; }
55
-
56
- .float-right { float:right; margin: 15px 0 5px 10px; }
57
- .clearfix {
58
- zoom:1; /* For IE 6/7 (trigger hasLayout) */
59
- &:before, &:after { content: ""; display: table; }
60
- &:after { clear: both; }
61
- }
62
-
63
-
64
- /*-----------------------------------------------------------*/
65
- /*------------------------ 2. HEADER ----------------------*/
66
- /*-----------------------------------------------------------*/
67
-
68
- #topbar {
69
- color: #fff;
70
- font-size: 12px;
71
- padding: 2px 0;
72
- background-color: #000;
73
- div { max-width: $max-width; margin: 0 auto; }
74
- .right { float: right; }
75
- a { color: #aaa; }
76
- }
77
-
78
- header {
79
- margin: 0 auto;
80
- max-width: $max-width;
81
- padding: 20px;
82
- font-family: 'Museo';
83
- font-weight: 500;
84
- font-size: 1.188em;
85
- border-bottom: 1px solid #e3e3e3;
86
- a {
87
- color: #000;
88
- &:hover { color: $orange; }
89
- }
90
- #logo { float: left; }
91
- #lines {
92
- float: right;
93
- font-size: 0.737em;
94
- text-transform: uppercase;
95
- }
96
- }
97
-
98
-
99
- /*-----------------------------------------------------------*/
100
- /*-----------------------------------------------------------*/
101
- /*----------------------- 3. CONTENT ----------------------*/
102
- /*-----------------------------------------------------------*/
103
- /*-----------------------------------------------------------*/
104
-
105
- .container {
106
- position: relative;
107
- max-width: $max-width;
108
- margin: 0 auto;
109
- }
110
-
111
- .article {
112
- max-width: $max-width;
113
- padding: 10px 0 25px 0;
114
- font-family: 'Ubuntu';
115
- line-height: 1.5em;
116
- font-size: 1.125em;
117
- color: #555;
118
-
119
- .hero_image {
120
- margin-top: 1.2em;
121
- }
122
-
123
- .article_header {
124
- text-align: center;
125
- padding: 0 15px;
126
- h1 {
127
- font-family: 'Museo';
128
- font-weight: 500;
129
- font-size: 2.4em;
130
- line-height: 1.01em;
131
- letter-spacing: -0.03em;
132
- color: $orange;
133
- margin: 30px 0 10px 0;
134
- a { color: $orange; }
135
- a:hover { color:$darkgrey; }
136
- }
137
- h2 {
138
- font-size: 1.333em;
139
- color: #b4b4b4;
140
- line-height: 1.1em;
141
- letter-spacing: 0.05em;
142
- margin: 0 0 25px 0;
143
- }
144
- .author_name {
145
- font-size: 0.8em;
146
- text-transform: uppercase;
147
- }
148
- }
149
-
150
- .article_teaser {
151
- padding: 0 10%;
152
- margin: 30px auto;
153
- .more-link { display: none; }
154
- p { font-weight: bold; }
155
- }
156
-
157
- .article_content {
158
- line-height: 1.8em;
159
- padding: 0 10%;
160
- h1, h2, h3, h4, h5 { font-weight: normal; }
161
-
162
- h1 {
163
- font-family: 'Museo';
164
- font-weight: 500;
165
- font-size: 1.3em;
166
- color: $darkgrey;
167
- text-transform: uppercase;
168
- margin: 50px 0 10px 0;
169
- letter-spacing: 0.05em;
170
- }
171
-
172
- h2 {
173
- font-size: 1.333em;
174
- margin: 40px 0 5px 0;
175
- letter-spacing: 0.13em;
176
- color: #b4b4b4;
177
- text-transform: uppercase;
178
- }
179
-
180
- h3 {
181
- font-size: 1.111em;
182
- font-family: 'Ubuntu';
183
- font-weight: bold;
184
- margin: 30px 0 0 0;
185
- }
186
-
187
- h4 {
188
- font-size: 1em;
189
- letter-spacing: 0.04em;
190
- margin: 30px 0 5px 0;
191
- text-transform: uppercase;
192
- }
193
-
194
- h5 {
195
- font-size: 1em;
196
- font-family: 'Ubuntu';
197
- font-weight: bold;
198
- margin: 20px 0 0 0;
199
- }
200
-
201
- p {
202
- margin: 0 0 20px 0;
203
- display: block;
204
- }
205
-
206
- a { border-bottom: 1px solid #ccc; padding: 0 0 1px 0; }
207
-
208
- img { display: block; margin: 0 auto; }
209
-
210
- ul, ol { margin-bottom: 20px; }
211
- ul {
212
- margin-left: 10px;
213
- li { margin: 0 0 5px 0; }
214
- }
215
-
216
- blockquote {
217
- font-family: 'BPmono';
218
- font-size: 1.125em;
219
- color:#999;
220
- letter-spacing: -0.02em;
221
- em { font-style: italic; letter-spacing: -0.02em; }
222
- strong { font-weight: bold; }
223
- }
224
-
225
- pre {
226
- font-size: 1.0em;
227
- margin-bottom: 15px;
228
- }
229
-
230
- .highlight pre { margin: 0 0 30px 20px; padding: 10px; }
231
- }
232
-
233
- .article_footer {
234
- border-top: 1px solid #ccc;
235
- border-bottom: 1px solid #ccc;
236
- text-align: center;
237
- color: #808080;
238
- font-size: 0.8em;
239
- padding: 1.1em;
240
- a { color: $orange; }
241
- a:hover { color: $darkgrey; }
242
- }
243
-
244
- .article_googleplus {
245
- border-top: 1px solid #ccc;
246
- padding: 1.1em;
247
- font-size: 1.5em;
248
- min-height: 40px;
249
- line-height: 40px;
250
- text-align: center;
251
- a {
252
- margin: 0 auto;
253
- display: inline-block;
254
- color: $lightgrey;
255
- &:hover { color: $darkgrey; }
256
- }
257
- span {
258
- background: url('/assets/ic_googleplus.png') 0px 0px no-repeat;
259
- height: 40px;
260
- width: 40px;
261
- line-height: 40px;
262
- display: inline-block;
263
- float: left;
264
- margin: 0 15px 0 0;
265
- }
266
- }
267
-
268
-
269
- &.small {
270
- max-width: 50%;
271
- float: left;
272
- .article_header {
273
- h1 { font-size: 1.8em; }
274
- h2 { display: none; }
275
- }
276
- .article_teaser {
277
- p { font-weight: normal; }
278
- .more-link {
279
- display: block;
280
- margin:40px auto 0 auto;
281
- text-align: center;
282
- a {
283
- display: inline-block;
284
- text-transform: uppercase;
285
- letter-spacing: 0.06em;
286
- font-size:0.8em;
287
- background-color: #f4f4f4;
288
- padding:5px 10px;
289
- color: #4d4d4d;
290
- display:block;
291
- width:100%;
292
- text-align:center;
293
- &:hover { background-color: #e7e7e7; }
294
- }
295
- }
296
- }
297
- .article_googleplus, .article_footer, .article_content { display:none; }
298
- }
299
- }
300
-
301
- #pagination {
302
- font-family: 'Ubuntu';
303
- display: block;
304
- overflow: visible;
305
- border-top: 1px solid #ccc;
306
- margin: 0px auto;
307
- width: 100%;
308
- text-transform: uppercase;
309
- font-size: 1.500em;
310
- padding: 30px 0 0 0;
311
- text-align: center;
312
- position: relative;
313
- a {
314
- color: $lightgrey;
315
- &:hover { color: $darkgrey; }
316
- }
317
- .newer, .older { position: absolute; display: inline-block; }
318
- .newer { left: 0px; }
319
- .older { right: 0px; }
320
- .prev, .first {
321
- float: left;
322
- padding: 0 10px;
323
- }
324
- .next, .last {
325
- float: right;
326
- padding: 0 10px;
327
- }
328
-
329
- .pages {
330
- font-size: 0.7em;
331
- color: lighten($lightgrey,30%);
332
- a {
333
- color: lighten($lightgrey,30%);
334
- &:hover { color: $lightgrey; }
335
- }
336
- .current { color: $lightgrey; font-size: 1.50em; }
337
- }
338
- }
339
-
340
-
341
- /*-----------------------------------------------------------*/
342
- /*-----------------------------------------------------------*/
343
- /*----------------------- 5. FOOTER - ----------------------*/
344
- /*-----------------------------------------------------------*/
345
- /*-----------------------------------------------------------*/
346
-
347
- footer, #footer {
348
- background-color: #f4f4f4;
349
- margin: 50px 0 0 0;
350
- padding: 30px 0;
351
-
352
- .container {
353
- margin: 0 auto;
354
- max-width: $max-width;
355
- color: #999;
356
- font-size: 0.85em;
357
- font-family: 'UbuntuLight';
358
- .row {
359
- text-align: left;
360
- width: 100%;
361
- .two-cols {
362
- padding: 0 20px;
363
- width: 50%;
364
- line-height:24px;
365
- float: left;
366
- &:first-child {
367
- margin-right: 0;
368
- }
369
- }
370
- }
371
- }
372
-
373
- hr { background-color:#ccc; margin:40px 0px; }
374
-
375
- h2, h2 a {
376
- margin-top: 20px;
377
- text-transform: uppercase;
378
- font-family: 'Museo';
379
- font-size: 1.2em;
380
- font-weight: 300;
381
- letter-spacing: 0.03em;
382
- }
383
-
384
- span.label {
385
- text-transform: uppercase;
386
- font-size:13px;
387
- color:#c0bfbf;
388
- }
389
-
390
- .weekday {
391
- font-family: 'Museo';
392
- font-weight: 300;
393
- color: $darkgrey;
394
- }
395
-
396
- #copyright {
397
- text-align:center;
398
- padding:50px 0 10px 0;
399
- font-size:13px;
400
- text-transform:uppercase;
401
- letter-spacing: 0.05em;
402
- line-height:24px;
403
- a {
404
- color:#999; font-family: 'Ubuntu';
405
- &:hover { color: $orange; }
406
- }
407
- }
408
- }
409
-
410
- div.rss { display:none; }