classic-jekyll-theme 1.2.0 → 1.2.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +11 -1
- data/_includes/navbanner.html +0 -3
- data/_sass/classic-jekyll-theme.scss +32 -36
- data/_sass/classic/_formatting.scss +27 -54
- data/_sass/classic/_layout.scss +4 -4
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 917f501cf2fcc0a16264a7ac57a57dba37a208aa
|
|
4
|
+
data.tar.gz: bec435de0624739a7376377d5185f039c7ab19f9
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: c80c670981a41ef364fe340750666949699cce95608aa76a95671cf974671db90d9840d01e61a8080b656a9e10adc7ef9e4d2de486d79fbfbddf48712a20db64
|
|
7
|
+
data.tar.gz: c22feb7186111b5d13eaeff55bacc5832b21185cd786e3b31f6a09bee46c22467881b872a02e339e2a7d5fc113144f6a7e335fbe39d4a8f95fcf743e4ffbd577
|
data/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# Classic-Jekyll-Theme v1.2.
|
|
1
|
+
# Classic-Jekyll-Theme v1.2.1
|
|
2
2
|
|
|
3
3
|
Welcome to Classic-Jekyll-Theme. This theme centers around one of the most used website structures on the web. A banner, navigation menu, (up to) three columns and a footer. The design is fully responsive for three different screen widths: wide, medium and narrow. It is probably best shown in an example:
|
|
4
4
|
|
|
@@ -253,6 +253,10 @@ Release 1.2.0
|
|
|
253
253
|
- Added option for an icon on the top-left side of the site.
|
|
254
254
|
- Fixed a problem where the tertiary column divider was not removed for medium layout.
|
|
255
255
|
|
|
256
|
+
Release 1.2.1
|
|
257
|
+
|
|
258
|
+
- Fixed problem with Icon placement.
|
|
259
|
+
|
|
256
260
|
## Upgrade information
|
|
257
261
|
|
|
258
262
|
### from 0.2.6 to 1.0.0
|
|
@@ -296,6 +300,12 @@ No changes needed except for the `Gemfile` in which you should upgrade the versi
|
|
|
296
300
|
|
|
297
301
|
If changes were made to `_sass/classic-jekyll-theme.scss` then this file must be replaced with the new version that comes with this release and the changes must be re-applied. Note that background color setting has changed slightly.
|
|
298
302
|
|
|
303
|
+
### from 1.2.0 to 1.2.1
|
|
304
|
+
|
|
305
|
+
Replace the 'initial' values in `_sass/classic-jekyll-theme.scss` for the backgrounds with 'none'.
|
|
306
|
+
The icon size (width and height) values are no longer used and can be removed.
|
|
307
|
+
As always, update the version number in the `Gemfile`
|
|
308
|
+
|
|
299
309
|
## Known problems (need your help)
|
|
300
310
|
|
|
301
311
|
There is some odd behaviour in the navigation bar that I have not been able to nail down yet. It has to do with the space between top level menu items. There is some additional space that I am not able to trace down. For those who like a puzzle: there is some space around a ".navbanner-menu ul li" that has no obvious source. Please let me know if you happen to find where it comes from. (rien@balancingrock.nl)
|
data/_includes/navbanner.html
CHANGED
|
@@ -36,38 +36,48 @@ $grey-color-dark: darken($grey-color, 25%);
|
|
|
36
36
|
$theme-color: green;
|
|
37
37
|
|
|
38
38
|
// Background color or pictures (keep in mind that some of these will overlap)
|
|
39
|
-
// The value set is assigned to the CSS3 'background' property.
|
|
39
|
+
// The value set is assigned to the CSS3 'background' property. Use 'none' if no background image or color is used.
|
|
40
40
|
// background: color image-url position/size repeat origin clip attachment initial|inherit;
|
|
41
41
|
// The properties that can be set, are: background-color, background-image, background-position, background-size, background-repeat, background-origin, background-clip, and background-attachment.
|
|
42
42
|
// See http://www.w3schools.com/cssref/css3_pr_background.asp for a full description.
|
|
43
43
|
// Example: ...-background: url("/assets/img/bckgnd.png") repeat
|
|
44
|
-
$wide-body-background:
|
|
45
|
-
$medium-body-background:
|
|
46
|
-
$narrow-body-background:
|
|
47
|
-
$wide-banner-background:
|
|
48
|
-
$medium-banner-background:
|
|
49
|
-
$narrow-banner-background:
|
|
50
|
-
$menubar-background:
|
|
51
|
-
$column-panel-background:
|
|
52
|
-
$primary-column-background:
|
|
53
|
-
$secondary-column-background:
|
|
54
|
-
$tertiary-column-background:
|
|
55
|
-
$wide-footer-background:
|
|
56
|
-
$medium-footer-background:
|
|
57
|
-
$narrow-footer-background:
|
|
44
|
+
$wide-body-background: none;
|
|
45
|
+
$medium-body-background: none;
|
|
46
|
+
$narrow-body-background: none;
|
|
47
|
+
$wide-banner-background: none;
|
|
48
|
+
$medium-banner-background: none;
|
|
49
|
+
$narrow-banner-background: none;
|
|
50
|
+
$menubar-background: none;
|
|
51
|
+
$column-panel-background: none;
|
|
52
|
+
$primary-column-background: none;
|
|
53
|
+
$secondary-column-background: none;
|
|
54
|
+
$tertiary-column-background: none;
|
|
55
|
+
$wide-footer-background: none;
|
|
56
|
+
$medium-footer-background: none;
|
|
57
|
+
$narrow-footer-background: none;
|
|
58
58
|
|
|
59
59
|
// For an icon in the top left of the site (left side of the banner)
|
|
60
|
+
// Set to 'url("/assets/img/site-icon.png")' to specify a url.
|
|
60
61
|
// Set the url's to 'none' if no icon should be shown.
|
|
61
|
-
// Note: width and height are ignored when the url is set to 'none'
|
|
62
62
|
$wide-icon-url: none;
|
|
63
|
-
$wide-icon-width: 0px;
|
|
64
|
-
$wide-icon-height: 0px;
|
|
65
63
|
$medium-icon-url: none;
|
|
66
|
-
$medium-icon-width: 0px;
|
|
67
|
-
$medium-icon-height: 0px;
|
|
68
64
|
$narrow-icon-url: none;
|
|
69
|
-
|
|
70
|
-
|
|
65
|
+
|
|
66
|
+
// Setting a minimum height for the banner. This can be helpfull if a background image has to be displayed.
|
|
67
|
+
// Note that for 'auto' the banner hight is determined by the title text. If a value is specified, the
|
|
68
|
+
// actual height will be determined by the largest number of this value or the font height of the title.
|
|
69
|
+
$wide-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
70
|
+
$medium-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
71
|
+
$narrow-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
72
|
+
|
|
73
|
+
// Shift the title this much to the right or left to fine-tune the title placement.
|
|
74
|
+
// Implementation note: actually sets a margin-left and margin-top on the div that holds the title.
|
|
75
|
+
$wide-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
76
|
+
$wide-vertical-title-shift: 0px; // positive is down, negative is up
|
|
77
|
+
$medium-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
78
|
+
$medium-vertical-title-shift: 0px; // positive is down, negative is up
|
|
79
|
+
$narrow-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
80
|
+
$narrow-vertical-title-shift: 0px; // positive is down, negative is up
|
|
71
81
|
|
|
72
82
|
// Colors for the dividers between the panels, columns and widgets
|
|
73
83
|
// Set display to 'none' to get rid of the divider, 'block' to enable the divider
|
|
@@ -86,20 +96,6 @@ $narrow-site-title-font-size: 2 * $base-font-size;
|
|
|
86
96
|
$medium-site-title-font-size: 2.5 * $base-font-size;
|
|
87
97
|
$wide-site-title-font-size: 3.5 * $base-font-size;
|
|
88
98
|
|
|
89
|
-
// Shift the title this much to the right or left to fine-tune the title placement.
|
|
90
|
-
// Implementation note: actually sets a margin-left and margin-top on the div that holds the title.
|
|
91
|
-
$wide-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
92
|
-
$wide-vertical-title-shift: 0px; // positive is down, negative is up
|
|
93
|
-
$medium-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
94
|
-
$medium-vertical-title-shift: 0px; // positive is down, negative is up
|
|
95
|
-
$narrow-horizontal-title-shift: 0px; // positive is to the right, negative is to the left
|
|
96
|
-
$narrow-vertical-title-shift: 0px; // positive is down, negative is up
|
|
97
|
-
|
|
98
|
-
// Setting a minimum height for the banner. This can be helpfull if a background image has to be displayed. Note that for 'auto' the banner hight is determined by the tallest of either the icon image or title text.
|
|
99
|
-
$wide-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
100
|
-
$medium-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
101
|
-
$narrow-minimum-banner-height: auto; // Set to 'auto' to disable a minimum height
|
|
102
|
-
|
|
103
99
|
// Special characters used for menu functions
|
|
104
100
|
$menu-symbol-code: '\02261'; // ≡ Used in narrow and medium banner only
|
|
105
101
|
$menu-closed-submenu-code: '\021E8'; // ⇨ Used in narrow when the menu items are visible
|
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
// The distinction between "layout" and "formatting" is as follows: If the resulting CCS affects the placement of and/or visibility of multiple items, it is placed in "layout". If the CSS affects only the appearance of an item, then it appears here. Of course the appearance may affect the layout, so there is no hard distinction.
|
|
2
2
|
|
|
3
|
+
// Sets the background for the .navbanner-title
|
|
4
|
+
@mixin titleBackgroundWithIcon($bgnd, $icn) {
|
|
5
|
+
@if $bgnd != none {
|
|
6
|
+
@if $icn != none {
|
|
7
|
+
background: $icn left center no-repeat, $bgnd;
|
|
8
|
+
} @else {
|
|
9
|
+
background: $bgnd;
|
|
10
|
+
}
|
|
11
|
+
} @else {
|
|
12
|
+
@if $icn != none {
|
|
13
|
+
background: $icn left center no-repeat;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
|
|
3
18
|
// Setting a background image on the entire site-title-color
|
|
4
19
|
body {
|
|
5
20
|
@include wide-layout { background: $wide-body-background; }
|
|
@@ -9,72 +24,30 @@ body {
|
|
|
9
24
|
|
|
10
25
|
// Formatting for the navbanner panel elements.
|
|
11
26
|
.navbanner-panel {
|
|
12
|
-
|
|
13
|
-
.navbanner-icon {
|
|
14
|
-
@include wide-layout {
|
|
15
|
-
@if $wide-icon-url == none {
|
|
16
|
-
display: none;
|
|
17
|
-
} @else {
|
|
18
|
-
background: $wide-icon-url no-repeat center center;
|
|
19
|
-
width: $wide-icon-width;
|
|
20
|
-
height: $wide-icon-height;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
@include medium-layout {
|
|
24
|
-
@if $medium-icon-url == none {
|
|
25
|
-
display: none;
|
|
26
|
-
} @else {
|
|
27
|
-
background: $medium-icon-url no-repeat center center;
|
|
28
|
-
width: $medium-icon-width;
|
|
29
|
-
height: $medium-icon-height;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
@include narrow-layout {
|
|
33
|
-
@if $narrow-icon-url == none {
|
|
34
|
-
display: none;
|
|
35
|
-
} @else {
|
|
36
|
-
background: $narrow-icon-url no-repeat center center;
|
|
37
|
-
width: $narrow-icon-width;
|
|
38
|
-
height: $narrow-icon-height;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
27
|
|
|
43
28
|
// Title formatting
|
|
44
29
|
.navbanner-title {
|
|
45
30
|
p { color: $site-title-color; }
|
|
46
31
|
@include wide-layout {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
} @else {
|
|
50
|
-
margin-left: $wide-horizontal-title-shift - $wide-icon-width;
|
|
51
|
-
}
|
|
32
|
+
font-size: $wide-site-title-font-size;
|
|
33
|
+
margin-left: $wide-horizontal-title-shift;
|
|
52
34
|
margin-top: $wide-vertical-title-shift;
|
|
53
35
|
min-height: $wide-minimum-banner-height;
|
|
54
|
-
|
|
55
|
-
font-size: $wide-site-title-font-size;
|
|
36
|
+
@include titleBackgroundWithIcon($wide-banner-background, $wide-icon-url);
|
|
56
37
|
}
|
|
57
38
|
@include medium-layout {
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
} @else {
|
|
61
|
-
margin-left: $medium-horizontal-title-shift - $medium-icon-width;
|
|
62
|
-
}
|
|
39
|
+
font-size: $medium-site-title-font-size;
|
|
40
|
+
margin-left: $medium-horizontal-title-shift;
|
|
63
41
|
margin-top: $medium-vertical-title-shift;
|
|
64
42
|
min-height: $medium-minimum-banner-height;
|
|
65
|
-
|
|
66
|
-
font-size: $medium-site-title-font-size;
|
|
43
|
+
@include titleBackgroundWithIcon($medium-banner-background, $medium-icon-url);
|
|
67
44
|
}
|
|
68
45
|
@include narrow-layout {
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
} @else {
|
|
72
|
-
margin-left: $narrow-horizontal-title-shift - $narrow-icon-width;
|
|
73
|
-
}
|
|
46
|
+
font-size: $narrow-site-title-font-size;
|
|
47
|
+
margin-left: $narrow-horizontal-title-shift;
|
|
74
48
|
margin-top: $narrow-vertical-title-shift;
|
|
75
49
|
min-height: $narrow-minimum-banner-height;
|
|
76
|
-
|
|
77
|
-
font-size: $narrow-site-title-font-size;
|
|
50
|
+
@include titleBackgroundWithIcon($narrow-banner-background, $narrow-icon-url);
|
|
78
51
|
}
|
|
79
52
|
}
|
|
80
53
|
|
|
@@ -86,8 +59,8 @@ body {
|
|
|
86
59
|
|
|
87
60
|
// Size of the title and menu symbol depends on the layout in effect.
|
|
88
61
|
@include narrow-layout {
|
|
89
|
-
min-height: $
|
|
90
|
-
background: $
|
|
62
|
+
min-height: $narrow-minimum-banner-height;
|
|
63
|
+
background: $narrow-banner-background;
|
|
91
64
|
font-size: $narrow-site-title-font-size;
|
|
92
65
|
label { padding: 0 $hspacing-unit; } // Give the menu label more area to make it easier to tap.
|
|
93
66
|
}
|
|
@@ -100,7 +73,7 @@ body {
|
|
|
100
73
|
@include wide-layout {
|
|
101
74
|
min-height: $narrow-minimum-banner-height;
|
|
102
75
|
background: $narrow-banner-background;
|
|
103
|
-
font-size: $
|
|
76
|
+
font-size: $narrow-site-title-font-size;
|
|
104
77
|
}
|
|
105
78
|
}
|
|
106
79
|
|
data/_sass/classic/_layout.scss
CHANGED
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
@include narrow-layout {
|
|
76
76
|
|
|
77
77
|
// Disabled items.
|
|
78
|
-
.navbanner-menu, .nav-bottom-divider, input, .menu-item-separator
|
|
78
|
+
.navbanner-menu, .nav-bottom-divider, input, .menu-item-separator { display: none; }
|
|
79
79
|
|
|
80
80
|
// Conditionally visible/invisible items (conditionally on the invisible checkbox, i.e. menu symbol)
|
|
81
81
|
input:checked ~ {
|
|
@@ -137,7 +137,7 @@
|
|
|
137
137
|
@include medium-layout {
|
|
138
138
|
|
|
139
139
|
// Disabled items
|
|
140
|
-
.navbanner-menu, input, .menu-item-symbol, .menu-subitem-symbol, .nav-bottom-divider
|
|
140
|
+
.navbanner-menu, input, .menu-item-symbol, .menu-subitem-symbol, .nav-bottom-divider { display: none; }
|
|
141
141
|
|
|
142
142
|
// Conditionally visible/invisible items (conditionally on the invisible checkbox, i.e. menu symbol)
|
|
143
143
|
input:checked ~ {
|
|
@@ -199,8 +199,8 @@
|
|
|
199
199
|
|
|
200
200
|
@include wide-layout {
|
|
201
201
|
|
|
202
|
-
// Do not show the
|
|
203
|
-
.navbanner-label, input, .menu-item-symbol
|
|
202
|
+
// Do not show the checkbox label, the input(s) and the menu symbols
|
|
203
|
+
.navbanner-label, input, .menu-item-symbol { display: none; }
|
|
204
204
|
|
|
205
205
|
.navbanner-menu {
|
|
206
206
|
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: classic-jekyll-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 1.2.
|
|
4
|
+
version: 1.2.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Rien
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2016-11-
|
|
11
|
+
date: 2016-11-15 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll-feed
|