theme-4 2.5.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,342 @@
1
+ /**
2
+ * Site header
3
+ */
4
+ .site-header {
5
+ border-top: 5px solid $border-color-03;
6
+ border-bottom: 1px solid $border-color-01;
7
+ min-height: $spacing-unit * 1.865;
8
+ line-height: $base-line-height * $base-font-size * 2.25;
9
+
10
+ // Positioning context for the mobile navigation icon
11
+ position: relative;
12
+ }
13
+
14
+ .site-title {
15
+ @include relative-font-size(1.625);
16
+ font-weight: 300;
17
+ letter-spacing: -1px;
18
+ margin-bottom: 0;
19
+ float: left;
20
+
21
+ @include media-query($on-palm) {
22
+ padding-right: 45px;
23
+ }
24
+
25
+ &,
26
+ &:visited {
27
+ color: $site-title-color;
28
+ }
29
+ }
30
+
31
+ .site-nav {
32
+ position: absolute;
33
+ top: 9px;
34
+ right: $spacing-unit / 2;
35
+ background-color: $background-color;
36
+ border: 1px solid $border-color-01;
37
+ border-radius: 5px;
38
+ text-align: right;
39
+
40
+ .nav-trigger {
41
+ display: none;
42
+ }
43
+
44
+ .menu-icon {
45
+ float: right;
46
+ width: 36px;
47
+ height: 26px;
48
+ line-height: 0;
49
+ padding-top: 10px;
50
+ text-align: center;
51
+
52
+ > svg path {
53
+ fill: $border-color-03;
54
+ }
55
+ }
56
+
57
+ label[for="nav-trigger"] {
58
+ display: block;
59
+ float: right;
60
+ width: 36px;
61
+ height: 36px;
62
+ z-index: 2;
63
+ cursor: pointer;
64
+ }
65
+
66
+ input ~ .trigger {
67
+ clear: both;
68
+ display: none;
69
+ }
70
+
71
+ input:checked ~ .trigger {
72
+ display: block;
73
+ padding-bottom: 5px;
74
+ }
75
+
76
+ .page-link {
77
+ color: $text-color;
78
+ line-height: $base-line-height;
79
+ display: block;
80
+ padding: 5px 10px;
81
+
82
+ // Gaps between nav items, but not on the last one
83
+ &:not(:last-child) {
84
+ margin-right: 0;
85
+ }
86
+ margin-left: 20px;
87
+ }
88
+
89
+ @media screen and (min-width: $on-medium) {
90
+ position: static;
91
+ float: right;
92
+ border: none;
93
+ background-color: inherit;
94
+
95
+ label[for="nav-trigger"] {
96
+ display: none;
97
+ }
98
+
99
+ .menu-icon {
100
+ display: none;
101
+ }
102
+
103
+ input ~ .trigger {
104
+ display: block;
105
+ }
106
+
107
+ .page-link {
108
+ display: inline;
109
+ padding: 0;
110
+
111
+ &:not(:last-child) {
112
+ margin-right: 20px;
113
+ }
114
+ margin-left: auto;
115
+ }
116
+ }
117
+ }
118
+
119
+
120
+
121
+ /**
122
+ * Site footer
123
+ */
124
+ .site-footer {
125
+ border-top: 1px solid $border-color-01;
126
+ padding: $spacing-unit 0;
127
+ }
128
+
129
+ .footer-heading {
130
+ @include relative-font-size(1.125);
131
+ margin-bottom: $spacing-unit / 2;
132
+ }
133
+
134
+ .feed-subscribe .svg-icon {
135
+ padding: 5px 5px 2px 0
136
+ }
137
+
138
+ .contact-list,
139
+ .social-media-list {
140
+ list-style: none;
141
+ margin-left: 0;
142
+ }
143
+
144
+ .footer-col-wrapper,
145
+ .social-links {
146
+ @include relative-font-size(0.9375);
147
+ color: $brand-color;
148
+ }
149
+
150
+ .footer-col {
151
+ margin-bottom: $spacing-unit / 2;
152
+ }
153
+
154
+ .footer-col-1,
155
+ .footer-col-2 {
156
+ width: calc(50% - (#{$spacing-unit} / 2));
157
+ }
158
+
159
+ .footer-col-3 {
160
+ width: calc(100% - (#{$spacing-unit} / 2));
161
+ }
162
+
163
+ @media screen and (min-width: $on-large) {
164
+ .footer-col-1 {
165
+ width: calc(35% - (#{$spacing-unit} / 2));
166
+ }
167
+
168
+ .footer-col-2 {
169
+ width: calc(20% - (#{$spacing-unit} / 2));
170
+ }
171
+
172
+ .footer-col-3 {
173
+ width: calc(45% - (#{$spacing-unit} / 2));
174
+ }
175
+ }
176
+
177
+ @media screen and (min-width: $on-medium) {
178
+ .footer-col-wrapper {
179
+ display: flex
180
+ }
181
+
182
+ .footer-col {
183
+ width: calc(100% - (#{$spacing-unit} / 2));
184
+ padding: 0 ($spacing-unit / 2);
185
+
186
+ &:first-child {
187
+ padding-right: $spacing-unit / 2;
188
+ padding-left: 0;
189
+ }
190
+
191
+ &:last-child {
192
+ padding-right: 0;
193
+ padding-left: $spacing-unit / 2;
194
+ }
195
+ }
196
+ }
197
+
198
+
199
+
200
+ /**
201
+ * Page content
202
+ */
203
+ .page-content {
204
+ padding: $spacing-unit 0;
205
+ flex: 1 0 auto;
206
+ }
207
+
208
+ .page-heading {
209
+ @include relative-font-size(2);
210
+ }
211
+
212
+ .post-list-heading {
213
+ @include relative-font-size(1.75);
214
+ }
215
+
216
+ .post-list {
217
+ margin-left: 0;
218
+ list-style: none;
219
+
220
+ > li {
221
+ margin-bottom: $spacing-unit;
222
+ }
223
+ }
224
+
225
+ .post-meta {
226
+ font-size: $small-font-size;
227
+ color: $brand-color;
228
+ }
229
+
230
+ .post-link {
231
+ display: block;
232
+ @include relative-font-size(1.5);
233
+ }
234
+
235
+
236
+
237
+ /**
238
+ * Posts
239
+ */
240
+ .post-header {
241
+ margin-bottom: $spacing-unit;
242
+ }
243
+
244
+ .post-title,
245
+ .post-content h1 {
246
+ @include relative-font-size(2.625);
247
+ letter-spacing: -1px;
248
+ line-height: 1.15;
249
+
250
+ @media screen and (min-width: $on-large) {
251
+ @include relative-font-size(2.625);
252
+ }
253
+ }
254
+
255
+ .post-content {
256
+ margin-bottom: $spacing-unit;
257
+
258
+ h1, h2, h3 { margin-top: $spacing-unit * 2 }
259
+ h4, h5, h6 { margin-top: $spacing-unit }
260
+
261
+ h2 {
262
+ @include relative-font-size(1.75);
263
+
264
+ @media screen and (min-width: $on-large) {
265
+ @include relative-font-size(2);
266
+ }
267
+ }
268
+
269
+ h3 {
270
+ @include relative-font-size(1.375);
271
+
272
+ @media screen and (min-width: $on-large) {
273
+ @include relative-font-size(1.625);
274
+ }
275
+ }
276
+
277
+ h4 {
278
+ @include relative-font-size(1.25);
279
+ }
280
+
281
+ h5 {
282
+ @include relative-font-size(1.125);
283
+ }
284
+ h6 {
285
+ @include relative-font-size(1.0625);
286
+ }
287
+ }
288
+
289
+
290
+ .social-media-list {
291
+ display: table;
292
+ margin: 0 auto;
293
+ li {
294
+ float: left;
295
+ margin: 5px 10px 5px 0;
296
+ &:last-of-type { margin-right: 0 }
297
+ a {
298
+ display: block;
299
+ padding: $spacing-unit / 4;
300
+ border: 1px solid $border-color-01;
301
+ &:hover { border-color: $border-color-02 }
302
+ }
303
+ }
304
+ }
305
+
306
+
307
+
308
+ /**
309
+ * Pagination navbar
310
+ */
311
+ .pagination {
312
+ margin-bottom: $spacing-unit;
313
+ @extend .social-media-list;
314
+ li {
315
+ a, div {
316
+ min-width: 41px;
317
+ text-align: center;
318
+ box-sizing: border-box;
319
+ }
320
+ div {
321
+ display: block;
322
+ padding: $spacing-unit / 4;
323
+ border: 1px solid transparent;
324
+
325
+ &.pager-edge {
326
+ color: $border-color-01;
327
+ border: 1px dashed;
328
+ }
329
+ }
330
+ }
331
+ }
332
+
333
+
334
+
335
+ /**
336
+ * Grid helpers
337
+ */
338
+ @media screen and (min-width: $on-large) {
339
+ .one-half {
340
+ width: calc(50% - (#{$spacing-unit} / 2));
341
+ }
342
+ }
@@ -0,0 +1,2 @@
1
+ // Placeholder to allow defining custom styles that override everything else.
2
+ // (Use `_sass/minima/custom-variables.scss` to override variable defaults)
@@ -0,0 +1 @@
1
+ // Placeholder to allow overriding predefined variables smoothly.
@@ -0,0 +1,50 @@
1
+ @charset "utf-8";
2
+
3
+ // Define defaults for each variable.
4
+
5
+ $base-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Segoe UI Symbol", "Segoe UI Emoji", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif !default;
6
+ $code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;
7
+ $base-font-size: 16px !default;
8
+ $base-font-weight: 400 !default;
9
+ $small-font-size: $base-font-size * 0.875 !default;
10
+ $base-line-height: 1.5 !default;
11
+
12
+ $spacing-unit: 30px !default;
13
+
14
+ $table-text-align: left !default;
15
+
16
+ // Width of the content area
17
+ $content-width: 800px !default;
18
+
19
+ $on-palm: 600px !default;
20
+ $on-laptop: 800px !default;
21
+
22
+ $on-medium: $on-palm !default;
23
+ $on-large: $on-laptop !default;
24
+
25
+ // Use media queries like this:
26
+ // @include media-query($on-palm) {
27
+ // .wrapper {
28
+ // padding-right: $spacing-unit / 2;
29
+ // padding-left: $spacing-unit / 2;
30
+ // }
31
+ // }
32
+ // Notice the following mixin uses max-width, in a deprecated, desktop-first
33
+ // approach, whereas media queries used elsewhere now use min-width.
34
+ @mixin media-query($device) {
35
+ @media screen and (max-width: $device) {
36
+ @content;
37
+ }
38
+ }
39
+
40
+ @mixin relative-font-size($ratio) {
41
+ font-size: #{$ratio}rem;
42
+ }
43
+
44
+ // Import pre-styling-overrides hook and style-partials.
45
+ @import
46
+ "minima/custom-variables", // Hook to override predefined variables.
47
+ "minima/base", // Defines element resets.
48
+ "minima/layout", // Defines structure and style based on CSS selectors.
49
+ "minima/custom-styles" // Hook to override existing styles.
50
+ ;
@@ -0,0 +1,91 @@
1
+ @charset "utf-8";
2
+
3
+ $brand-color: #828282 !default;
4
+ $brand-color-light: lighten($brand-color, 40%) !default;
5
+ $brand-color-dark: darken($brand-color, 25%) !default;
6
+
7
+ $site-title-color: $brand-color-dark !default;
8
+
9
+ $text-color: #111111 !default;
10
+ $background-color: #fdfdfd !default;
11
+ $code-background-color: #eeeeff !default;
12
+
13
+ $link-base-color: #2a7ae2 !default;
14
+ $link-visited-color: darken($link-base-color, 15%) !default;
15
+ $link-hover-color: $text-color !default;
16
+
17
+ $border-color-01: $brand-color-light !default;
18
+ $border-color-02: lighten($brand-color, 35%) !default;
19
+ $border-color-03: $brand-color-dark !default;
20
+
21
+ $table-text-color: lighten($text-color, 18%) !default;
22
+ $table-zebra-color: lighten($brand-color, 46%) !default;
23
+ $table-header-bg-color: lighten($brand-color, 43%) !default;
24
+ $table-header-border: lighten($brand-color, 37%) !default;
25
+ $table-border-color: $border-color-01 !default;
26
+
27
+
28
+ // Syntax highlighting styles should be adjusted appropriately for every "skin"
29
+ // ----------------------------------------------------------------------------
30
+
31
+ .highlight {
32
+ .c { color: #998; font-style: italic } // Comment
33
+ .err { color: #a61717; background-color: #e3d2d2 } // Error
34
+ .k { font-weight: bold } // Keyword
35
+ .o { font-weight: bold } // Operator
36
+ .cm { color: #998; font-style: italic } // Comment.Multiline
37
+ .cp { color: #999; font-weight: bold } // Comment.Preproc
38
+ .c1 { color: #998; font-style: italic } // Comment.Single
39
+ .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special
40
+ .gd { color: #000; background-color: #fdd } // Generic.Deleted
41
+ .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
42
+ .ge { font-style: italic } // Generic.Emph
43
+ .gr { color: #a00 } // Generic.Error
44
+ .gh { color: #999 } // Generic.Heading
45
+ .gi { color: #000; background-color: #dfd } // Generic.Inserted
46
+ .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
47
+ .go { color: #888 } // Generic.Output
48
+ .gp { color: #555 } // Generic.Prompt
49
+ .gs { font-weight: bold } // Generic.Strong
50
+ .gu { color: #aaa } // Generic.Subheading
51
+ .gt { color: #a00 } // Generic.Traceback
52
+ .kc { font-weight: bold } // Keyword.Constant
53
+ .kd { font-weight: bold } // Keyword.Declaration
54
+ .kp { font-weight: bold } // Keyword.Pseudo
55
+ .kr { font-weight: bold } // Keyword.Reserved
56
+ .kt { color: #458; font-weight: bold } // Keyword.Type
57
+ .m { color: #099 } // Literal.Number
58
+ .s { color: #d14 } // Literal.String
59
+ .na { color: #008080 } // Name.Attribute
60
+ .nb { color: #0086B3 } // Name.Builtin
61
+ .nc { color: #458; font-weight: bold } // Name.Class
62
+ .no { color: #008080 } // Name.Constant
63
+ .ni { color: #800080 } // Name.Entity
64
+ .ne { color: #900; font-weight: bold } // Name.Exception
65
+ .nf { color: #900; font-weight: bold } // Name.Function
66
+ .nn { color: #555 } // Name.Namespace
67
+ .nt { color: #000080 } // Name.Tag
68
+ .nv { color: #008080 } // Name.Variable
69
+ .ow { font-weight: bold } // Operator.Word
70
+ .w { color: #bbb } // Text.Whitespace
71
+ .mf { color: #099 } // Literal.Number.Float
72
+ .mh { color: #099 } // Literal.Number.Hex
73
+ .mi { color: #099 } // Literal.Number.Integer
74
+ .mo { color: #099 } // Literal.Number.Oct
75
+ .sb { color: #d14 } // Literal.String.Backtick
76
+ .sc { color: #d14 } // Literal.String.Char
77
+ .sd { color: #d14 } // Literal.String.Doc
78
+ .s2 { color: #d14 } // Literal.String.Double
79
+ .se { color: #d14 } // Literal.String.Escape
80
+ .sh { color: #d14 } // Literal.String.Heredoc
81
+ .si { color: #d14 } // Literal.String.Interpol
82
+ .sx { color: #d14 } // Literal.String.Other
83
+ .sr { color: #009926 } // Literal.String.Regex
84
+ .s1 { color: #d14 } // Literal.String.Single
85
+ .ss { color: #990073 } // Literal.String.Symbol
86
+ .bp { color: #999 } // Name.Builtin.Pseudo
87
+ .vc { color: #008080 } // Name.Variable.Class
88
+ .vg { color: #008080 } // Name.Variable.Global
89
+ .vi { color: #008080 } // Name.Variable.Instance
90
+ .il { color: #099 } // Literal.Number.Integer.Long
91
+ }