jekyll-theme-consulting 0.8.11 → 0.9.1

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
  SHA256:
3
- metadata.gz: e462e22a0106fd5c370fa28b9106e29b9478881bb481e8c3318c5a32cf0a4782
4
- data.tar.gz: 962ea17bbe106187d101d94fc98b434fc6630bf7963dd7bb598c16c2c4a60356
3
+ metadata.gz: b35f2481952a9ebe8dafa4b1cd177e286164cd92ac747a381733d218a3982ad5
4
+ data.tar.gz: 4651f3798b25346443982a304f7a184a24845b64eca63b1ada5709c3f65dd908
5
5
  SHA512:
6
- metadata.gz: a1c3652343f3c4f577217a20a8465cd91a3b7f9ad855ac1b94498b503000d2edae496bcce926b19143c29cfb9d89db03f2c139d081f24bc9135d0de88d932443
7
- data.tar.gz: 1233e9f48efc716b8281fa334582775a84086d2477eea892d36f00d4ece2b49bd5d6064cea3ad5ccce57340ad042cf2097dc41ced921537518ad567275657030
6
+ metadata.gz: eafecc362c9ed8381a598c422503d71b9afc6e792210c7d23e195361195ee248d700925a69e2ae687ca5bd21ef0615af6f3244124d46fa1ecabf9b7c623358d6
7
+ data.tar.gz: ff1efcfb824a73ae3e024ecc7f941a42e478c34cc737fed5ca2cd151722fb7115e4aea7d2f193a495170d3e64a29be2a28a51d798d61f6f9f013f4376de0a332
data/README.md CHANGED
@@ -14,6 +14,8 @@ You can preview the theme [here](https://moodule.github.io/jekyll-theme-consulti
14
14
 
15
15
  > **Customizable**: theme colors, menu, social items can be changed from a central config file
16
16
 
17
+ > **Many Widgets**: tabs, mini-posts, spotlight, feature listings, and more can be easily inserted without worrying about their internals
18
+
17
19
  > **Many templates**: contact forms, navigation menus, and others can be easily inserted thanks to custom Jekyll includes
18
20
 
19
21
  > **Vector images**: the theme images are vectorized, render smoothly on any display and can be dynamically styled
@@ -1,10 +1,10 @@
1
1
  <!-- Header -->
2
2
  <header id="header" {% if include.style %}class="{{ include.style.class | default: '' }}" style="background-image: url({{ include.style.image | absolute_url }});"{% endif %}>
3
3
  <a href="{{ '' | absolute_url }}" class="logo">
4
- <div class="title">
5
- <strong>{{ include.title }}</strong>
6
- </div>
7
- <div class="subtitle"> - {{ include.subtitle }}</div>
4
+ <span class="title">
5
+ <strong>{{ include.title }}</strong>
6
+ </span>
7
+ <span class="subtitle"> - {{ include.subtitle }}</span>
8
8
  </a>
9
9
  {% include language.html %}
10
10
  </header>
@@ -0,0 +1,17 @@
1
+ <div id="{{ include.id }}" class="vertical-tabset">
2
+ {%- for tab in include.tabs -%}
3
+ {%- capture tab-id -%}{{ tab.id | default: tab.title | slugify }}{{ forloop.index }}{%- endcapture -%}
4
+ <div id="tab-{{ tab-id }}" class="vertical-tab">
5
+ {%- if forloop.first == true -%}
6
+ <input type="radio" name="{{ include.id }}" id="option-{{ tab-id }}" checked>
7
+ {%- else -%}
8
+ <input type="radio" name="{{ include.id }}" id="option-{{ tab-id }}">
9
+ {%- endif -%}
10
+ <label for="option-{{ tab-id }}" style="width: {{ include.header-width | default: 30 }}%;">{{ tab.title }}</label>
11
+ <section class="tab-panel" style="left: {{ include.header-width | default: 30 }}%;">
12
+ <h2>{{ tab.title }}</h2>
13
+ <p>{{ tab.content }}</p>
14
+ </section>
15
+ </div>
16
+ {%- endfor -%}
17
+ </div>
@@ -31,6 +31,8 @@
31
31
  @import 'main/components/features';
32
32
  @import 'main/components/facts';
33
33
  @import 'main/components/posts';
34
+ @import 'main/components/horizontal-tabs';
35
+ @import 'main/components/vertical-tabs';
34
36
 
35
37
  // Layout.
36
38
 
@@ -153,3 +153,21 @@
153
153
  }
154
154
  }
155
155
  }
156
+
157
+ .inverted .facts {
158
+
159
+ article {
160
+
161
+ .on.fact-intro p {
162
+ color: #ffffff !important;
163
+ }
164
+
165
+ .on.fact h3 {
166
+ color: #ffffff !important;
167
+ }
168
+
169
+ .on.fact-outro p {
170
+ color: #ffffff !important;
171
+ }
172
+ }
173
+ }
@@ -100,4 +100,11 @@
100
100
  }
101
101
  }
102
102
  }
103
+
104
+ article:hover {
105
+
106
+ .icon:before, .content p, .content h3 {
107
+ color: _palette(accent-cp) !important;
108
+ }
109
+ }
103
110
  }
@@ -0,0 +1,112 @@
1
+ /*
2
+ Hide the radio buttons
3
+ */
4
+
5
+ .horizontal-tabset > input[type="radio"] {
6
+ position: absolute;
7
+ left: -200vw;
8
+ }
9
+
10
+ /*
11
+ Toggle
12
+ */
13
+
14
+ .horizontal-tabset .tab-panel {
15
+ display: none;
16
+ }
17
+
18
+ .horizontal-tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
19
+ .horizontal-tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
20
+ .horizontal-tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
21
+ .horizontal-tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
22
+ .horizontal-tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
23
+ .horizontal-tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
24
+ display: block;
25
+ }
26
+
27
+ /*
28
+ Common style
29
+ */
30
+
31
+ .horizontal-tabset > input[type="radio"] + label {
32
+ position: relative;
33
+ display: inline-block;
34
+ margin: 0 !important;
35
+ padding: 15px 15px 25px !important;
36
+ border: 2px solid transparent;
37
+ border-bottom: 0;
38
+ cursor: pointer;
39
+ font-weight: bold;
40
+ z-index: 100;
41
+
42
+ &::before {
43
+ display: none !important;
44
+ }
45
+
46
+ &::after {
47
+ content: "";
48
+ position: absolute;
49
+ left: 15px;
50
+ bottom: 10px;
51
+ width: 22px;
52
+ height: 4px;
53
+ background: _palette(border);
54
+ }
55
+ }
56
+
57
+ .horizontal-tabset .tab-panels .tab-panel {
58
+ padding: 30px 0;
59
+ border-top: 2px solid _palette(accent);
60
+ }
61
+
62
+ /*
63
+ Active style
64
+ */
65
+
66
+ .horizontal-tabset > label:hover,
67
+ .horizontal-tabset > input[type="radio"]:focus + label {
68
+ color: _palette(accent);
69
+ }
70
+
71
+ .horizontal-tabset > label:hover::after,
72
+ .horizontal-tabset > input[type="radio"]:focus + label::after,
73
+ .horizontal-tabset > input[type="radio"]:checked + label::after {
74
+ background: _palette(accent);
75
+ }
76
+
77
+ .horizontal-tabset > input[type="radio"]:checked + label {
78
+ border-color: _palette(accent);
79
+ border-bottom: 2px solid _palette(bg);
80
+ margin: 0 0 -2px 0 !important;
81
+ }
82
+
83
+ /*
84
+ Inverted
85
+ */
86
+
87
+ .inverted .horizontal-tabset > input[type="radio"] + label {
88
+ color: _palette(fg-inverted);
89
+
90
+ &::after {
91
+ background: _palette(border-inverted);
92
+ }
93
+ }
94
+
95
+ /*
96
+ Inverted & active
97
+ */
98
+
99
+ .inverted .horizontal-tabset > label:hover,
100
+ .inverted .horizontal-tabset > input[type="radio"]:focus + label {
101
+ color: _palette(accent);
102
+ }
103
+
104
+ .inverted .horizontal-tabset > label:hover::after,
105
+ .inverted .horizontal-tabset > input[type="radio"]:focus + label::after,
106
+ .inverted .horizontal-tabset > input[type="radio"]:checked + label::after {
107
+ background: _palette(accent);
108
+ }
109
+
110
+ .inverted .horizontal-tabset > input[type="radio"]:checked + label {
111
+ border-bottom: 2px solid _palette(bg-alt-inverted);
112
+ }
@@ -0,0 +1,120 @@
1
+ /*
2
+ Hide the radio buttons
3
+ */
4
+
5
+ .vertical-tabset input[type="radio"] {
6
+ position: absolute;
7
+ left: -200vw;
8
+ }
9
+
10
+ /*
11
+ Toggle
12
+ */
13
+
14
+ .vertical-tabset .vertical-tab .tab-panel {
15
+ display: none;
16
+ }
17
+
18
+ .vertical-tabset .vertical-tab input[type="radio"]:checked ~ .tab-panel {
19
+ display: block;
20
+ }
21
+
22
+ /*
23
+ Common style
24
+ */
25
+
26
+ .vertical-tabset {
27
+ position: relative;
28
+ }
29
+
30
+ .vertical-tabset .vertical-tab {
31
+ display: block;
32
+ }
33
+
34
+ .vertical-tabset input[type="radio"] + label {
35
+ position: relative;
36
+ display: inline-block;
37
+ margin: 0 !important;
38
+ padding: 15px 15px 25px !important;
39
+ border: 2px solid transparent;
40
+ border-right: 0;
41
+ cursor: pointer;
42
+ font-weight: bold;
43
+ width: 40%;
44
+ z-index:100;
45
+
46
+ &::before {
47
+ display: none !important;
48
+ }
49
+
50
+ &::after {
51
+ content: "";
52
+ position: absolute;
53
+ left: 15px;
54
+ bottom: 10px;
55
+ width: 22px;
56
+ height: 4px;
57
+ background: _palette(border);
58
+ }
59
+ }
60
+
61
+ .vertical-tabset .vertical-tab .tab-panel {
62
+ position: absolute;
63
+ top: 0;
64
+ left: 40%;
65
+ padding: 0 30px;
66
+ margin: 0 0 0 -2px;
67
+ border-left: 2px solid _palette(accent);
68
+ height: 100%;
69
+ }
70
+
71
+ /*
72
+ Active
73
+ */
74
+
75
+ .vertical-tabset label:hover,
76
+ .vertical-tabset input[type="radio"]:focus + label {
77
+ color: _palette(accent);
78
+ }
79
+
80
+ .vertical-tabset label:hover::after,
81
+ .vertical-tabset input[type="radio"]:focus + label::after,
82
+ .vertical-tabset input[type="radio"]:checked + label::after {
83
+ background: _palette(accent);
84
+ }
85
+
86
+ .vertical-tabset input[type="radio"]:checked + label {
87
+ border-color: _palette(accent);
88
+ border-right: 2px solid _palette(bg);
89
+ }
90
+
91
+ /*
92
+ Inverted
93
+ */
94
+
95
+ .inverted .vertical-tabset input[type="radio"] + label {
96
+ color: _palette(fg-inverted);
97
+
98
+ &::after {
99
+ background: _palette(border-inverted);
100
+ }
101
+ }
102
+
103
+ /*
104
+ Inverted & active
105
+ */
106
+
107
+ .inverted .vertical-tabset input[type="radio"] label:hover,
108
+ .inverted .vertical-tabset input[type="radio"]:focus + label {
109
+ color: _palette(accent);
110
+ }
111
+
112
+ .inverted .vertical-tabset input[type="radio"] label:hover::after,
113
+ .inverted .vertical-tabset input[type="radio"]:focus + label::after,
114
+ .inverted .vertical-tabset input[type="radio"]:checked + label::after {
115
+ background: _palette(accent);
116
+ }
117
+
118
+ .inverted .vertical-tabset input[type="radio"]:checked + label {
119
+ border-right: 2px solid _palette(bg-alt-inverted);
120
+ }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: jekyll-theme-consulting
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.8.11
4
+ version: 0.9.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Moodule
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2020-07-22 00:00:00.000000000 Z
11
+ date: 2020-07-26 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -91,6 +91,7 @@ files:
91
91
  - _includes/search.html
92
92
  - _includes/sidebar.html
93
93
  - _includes/social.html
94
+ - _includes/tabs.html
94
95
  - _includes/thread.html
95
96
  - _includes/toggle.html
96
97
  - _includes/waves/bottom.html
@@ -151,6 +152,7 @@ files:
151
152
  - _sass/main/components/_facts.scss
152
153
  - _sass/main/components/_features.scss
153
154
  - _sass/main/components/_form.scss
155
+ - _sass/main/components/_horizontal-tabs.scss
154
156
  - _sass/main/components/_icon.scss
155
157
  - _sass/main/components/_icons.scss
156
158
  - _sass/main/components/_image.scss
@@ -162,6 +164,7 @@ files:
162
164
  - _sass/main/components/_row.scss
163
165
  - _sass/main/components/_section.scss
164
166
  - _sass/main/components/_table.scss
167
+ - _sass/main/components/_vertical-tabs.scss
165
168
  - _sass/main/layout/_banner.scss
166
169
  - _sass/main/layout/_footer.scss
167
170
  - _sass/main/layout/_header.scss