jekyll-theme-simplex 0.9.4 → 0.9.5

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: b332a4036a61aeab0a1028cf031d9322aa326f56566fd5d3b14c45d586bccfa6
4
- data.tar.gz: 312f1f3b07cb3c0f091d5c24234a02df100d0263a82f617208b795de511c8c61
3
+ metadata.gz: 3294a1cbffe7a7b4b7624bf42a4d962bc03265d840305ef74c485dbe5e78622e
4
+ data.tar.gz: fc353f36599d02f8d103ea4d313b93ebf2d9ce9e73776d7c8cf809f18e63c168
5
5
  SHA512:
6
- metadata.gz: d7394a9b5e32a127dd93f117240ddedd51ea23f6c79651242f3a4e103a81b5098fd5f0400dd4287e15baf8102e6d43c07c4e811a40cdd4824b6deb61705e81c4
7
- data.tar.gz: 8237b3833fee7837aaa1af13b6259950ba1fa8b5c2019d4fdc2f4f48599c410a7c30212dba96cbf6814ed8508ce8ba1418ea789b5bf819660a2a277f06bb9207
6
+ metadata.gz: 528ec5e472bc2e01a14041280f797a47c71c2b56ffb86bbdf290555dc8f1b9bab0ddeb61058305876f479af97ab3c153c1091f18a45d5d4d8e85f645c4c628ef
7
+ data.tar.gz: 86a70450ceb07ab632a141c3a66dc2d38f861d0a19429e4ef63b8fc13731e7c679901c13efeb38b7db6598b18011ed9c02468387472479c1a83e964366abc447
data/README.md CHANGED
@@ -9,6 +9,13 @@ A *simple* yet neat blogging theme. Developed for the [golas blog](https://golas
9
9
  ## 👓 Preview
10
10
  ![Preview](preview.gif)
11
11
 
12
+ ## 💎 Features
13
+ ### Responsive
14
+ ![Responsivity preview](previewResponsive.gif)
15
+
16
+ ### Dark mode
17
+ ![Dark mode preview](previewDark.gif)
18
+
12
19
  ## ℹ Installation
13
20
 
14
21
  Add this line to your Jekyll site's `Gemfile`:
@@ -20,12 +20,19 @@
20
20
  flex-direction: column;
21
21
  };
22
22
 
23
+ color: var(--c-feed-title);
24
+
23
25
  text-align: center;
24
26
  padding: 0 2rem;
27
+ margin-bottom: 2rem;
25
28
  min-width: 80%;
26
29
 
27
30
  h1{
28
31
  margin: 1rem 0 0 0;
32
+
33
+ @include for-size('tablet'){
34
+ margin: 0;
35
+ }
29
36
  }
30
37
  }
31
38
 
@@ -42,12 +49,12 @@
42
49
  height: 100%;
43
50
  margin: 1rem 0;
44
51
  padding: 1rem 2rem;
45
- box-shadow: inset 0px 0px 14px -4px rgba(0, 0, 0, 0);
52
+ box-shadow: inset 0px 0px 14px -4px var(--c-snippetShadow);
46
53
  transition: $t-smooth;
47
54
 
48
55
  &:hover{
49
56
  transform: scale(.99);
50
- box-shadow: inset 0px 0px 14px -4px rgba(0,0,0,0.5);
57
+ box-shadow: inset 0px 0px 14px -4px var(--c-snippetShadowHover);
51
58
  }
52
59
  }
53
60
 
@@ -78,6 +85,17 @@
78
85
  background: var(--c-themePrimaryDark);
79
86
  padding: .2rem .5rem;
80
87
  }
88
+
89
+
90
+ @include for-size('tablet'){
91
+ flex-direction: column;
92
+
93
+ p{
94
+ text-align: center;
95
+ width: 100%;
96
+ margin: 0;
97
+ }
98
+ }
81
99
  }
82
100
 
83
101
  &__date{
@@ -96,6 +114,7 @@
96
114
 
97
115
  &__header{
98
116
  margin: 1rem 0 0 0;
117
+ color: var(--c-articleHeading);
99
118
 
100
119
  @include for-size('tablet'){
101
120
  margin: 1rem 0 0 0;
@@ -105,12 +124,14 @@
105
124
 
106
125
  &__text{
107
126
 
127
+ color: var(--c-snippetHeading);
108
128
  margin: 1rem 0 0 0;
109
129
  }
110
130
 
111
131
  &__author{
112
132
 
113
133
  margin: 1.5rem 0 0 0;
134
+ color: var(--c-snippetAuthor);
114
135
 
115
136
  @include flexbox{
116
137
  flex-direction: row;
@@ -8,6 +8,7 @@
8
8
  @include flexbox;
9
9
  padding: 1rem 0 0 0;
10
10
  margin-top: auto;
11
+ color: var(--c-footerText);
11
12
 
12
13
  &__about{
13
14
 
@@ -36,6 +37,7 @@
36
37
  height: 1.25rem;
37
38
  margin: 0 .5rem;
38
39
  transition: $t-smooth;
40
+ filter: var(--c-footerImageFilter);
39
41
 
40
42
  &:hover{
41
43
  transform: scale(1.05) rotate(-5deg);
@@ -26,6 +26,7 @@
26
26
  margin: 0;
27
27
  }
28
28
  &__img{
29
+ filter: var(--c-headerImageFilter);
29
30
  height: 2rem;
30
31
  }
31
32
  }
@@ -37,7 +38,7 @@
37
38
  outline: none;
38
39
  cursor: pointer;
39
40
 
40
- margin: 2rem 0;
41
+ margin: 2rem 0 1rem 0;
41
42
  padding: 0;
42
43
  font-size: 1rem;
43
44
  width: 3em;
@@ -103,7 +104,7 @@
103
104
 
104
105
  img,p{
105
106
  transition: $t-smooth;
106
- filter: brightness(0);
107
+ filter: var(--c-menuItemsFilter);
107
108
  }
108
109
 
109
110
  img{
@@ -144,7 +145,7 @@
144
145
  max-height: 0;
145
146
  width: 250px;
146
147
  overflow: hidden;
147
- box-shadow: inset 0px 0px 14px -4px rgba(0,0,0,0.5);
148
+ box-shadow: inset 0px 0px 14px -4px var(--c-menuShadow);
148
149
  transition: $t-smooth;
149
150
  flex-direction: column;
150
151
 
@@ -169,7 +170,7 @@
169
170
 
170
171
  img{
171
172
  transform: scale(1.1);
172
- filter: none;
173
+ filter: var(--c-menuItemsFilterHover);
173
174
 
174
175
  @include for-size('tablet'){
175
176
  transform: scale(1);
@@ -178,7 +179,7 @@
178
179
 
179
180
  p{
180
181
  letter-spacing: .1rem;
181
- filter: none;
182
+ filter: var(--c-menuItemsFilterHover);
182
183
 
183
184
  @include for-size('tablet'){
184
185
  letter-spacing: .2rem;
@@ -273,11 +274,12 @@
273
274
  }
274
275
 
275
276
  @include for-size('tablet'){
276
- box-shadow: inset 0px 0px 14px -4px rgba(0,0,0,0.5);
277
+ box-shadow: inset 0px 0px 14px -4px var(--c-menuShadow);
277
278
 
278
279
  transition: $t-smooth;
279
280
  max-height: 0;
280
281
  overflow: hidden;
282
+ margin: 0;
281
283
  &.open{
282
284
  max-height: $s-m-menuMaxHeight;
283
285
  }
@@ -5,6 +5,7 @@
5
5
 
6
6
  .page{
7
7
 
8
+ color: var(--c-pageText);
8
9
  justify-self: center;
9
10
  padding: 0 1rem;
10
11
  max-width: 1000px;
@@ -17,6 +17,7 @@
17
17
  &__title{
18
18
 
19
19
  &__text{
20
+ color: var(--c-postTitle);
20
21
  margin-bottom: 0;
21
22
  }
22
23
  }
@@ -27,6 +28,7 @@
27
28
  width: 100%;
28
29
 
29
30
  &__divider{
31
+ color: var(--c-postText);
30
32
  margin: 0 1rem;
31
33
 
32
34
  @include for-size('tablet'){
@@ -60,6 +62,7 @@
60
62
 
61
63
  &__date{
62
64
 
65
+ color: var(--c-postText);
63
66
  @include for-size('tablet'){
64
67
  margin-top: 1rem;
65
68
  }
@@ -67,6 +70,7 @@
67
70
 
68
71
  &__author{
69
72
 
73
+ color: var(--c-postText);
70
74
  width: fit-content;
71
75
  //box-shadow: inset 0px 0px 14px -4px rgba(0,0,0,0.5);
72
76
  @include flexbox;
@@ -85,6 +89,7 @@
85
89
 
86
90
  &__content{
87
91
 
92
+ color: var(--c-postText);
88
93
  h1{
89
94
  font-size: 1.8rem;
90
95
  }
@@ -28,33 +28,75 @@
28
28
 
29
29
  @media (prefers-color-scheme: light){
30
30
 
31
+
31
32
  --c-articleHeading: var(--c-themePrimaryDark);
32
33
  --c-articleParagraph: var(--c-themeSecondaryDark);
33
34
  --c-articleBackground: var(--c-themePrimaryLight);
34
35
 
35
36
  --c-pageBackground: var(--c-themePrimaryLight);
36
37
 
38
+ --c-headerImageFilter: none;
37
39
  --c-menuLinks: var(--c-themePrimaryDark);
38
40
  --c-menuDepth0: var(--c-themeSecondaryLight);
41
+ --c-menuItemsFilter: brightness(0);
42
+ --c-menuItemsFilterHover: none;
43
+ --c-menuShadow: rgba(0,0,0,0.5);
39
44
 
40
45
  --c-snippetBackgroundExternal: rgba(239, 239, 239, 0.425);
41
46
  --c-snippetBackgroundInternal: var(--c-pageBackground);
42
-
47
+ --c-snippetHeading: var(--c-themePrimaryDark);
43
48
  --c-snippetDate: var(--c-themeSecondaryDark);
49
+ --c-snippetAuthor: var(--c-themePrimaryDark);
50
+ --c-snippetShadowHover: rgba(0,0,0,0.5);
51
+ --c-snippetShadow: rgba(0, 0, 0, 0);
52
+
53
+ --c-postTitle: var(--c-themePrimaryDark);
54
+ --c-postText: var(--c-themePrimaryDark);
55
+ --c-pageTitle: var(--c-themePrimaryDark);
56
+ --c-pageText: var(--c-themePrimaryDark);
57
+
58
+ --c-feed-title: var(--c-themePrimaryDark);
44
59
 
45
60
  --c-link: var(--c-themeTerniaryDark);
46
61
  --c-linkVisited: var(--c-themeQuaternaryDark);
47
62
  --c-linkHover: var(--c-themePrimaryDark);
48
63
  --c-linkActive: var(--c-themePrimaryDark);
64
+
65
+ --c-footerText: var(--c-themePrimaryDark);
66
+ --c-footerImageFilter: none;
49
67
  }
50
68
 
51
69
  @media (prefers-color-scheme: dark){
52
70
 
71
+ --c-headerImageFilter: invert(1);
72
+ --c-menuLinks: var(--c-themePrimaryLight);
73
+ --c-menuDepth0: var(--c-themeSecondaryLight);
74
+ --c-menuItemsFilter: none;
75
+ --c-menuItemsFilterHover: brightness(100);
76
+ --c-menuShadow: rgba(255, 255, 255, 0.2);
77
+
53
78
  --c-articleHeading: var(--c-themePrimaryLight);
54
79
  --c-articleParagraph: var(--c-themeSecondaryLight);
55
80
  --c-articleBackground: var(--c-themePrimaryDark);
56
81
 
82
+ --c-snippetHeading: var(--c-themePrimaryLight);
83
+ --c-snippetDate: var(--c-themeSecondaryLight);
84
+ --c-snippetAuthor: var(--c-themePrimaryLight);
85
+
86
+ --c-snippetShadowHover: rgba(255, 255, 255, 0.5);
87
+ --c-snippetShadow: rgba(0, 0, 0, 0);
88
+
89
+ --c-postTitle: var(--c-themePrimaryLight);
90
+ --c-postText: var(--c-themePrimaryLight);
91
+ --c-pageTitle: var(--c-themePrimaryLight);
92
+ --c-pageText: var(--c-themePrimaryLight);
93
+
94
+ --c-feed-title: var(--c-themePrimaryLight);
95
+
57
96
  --c-pageBackground: var(--c-themePrimaryDark);
97
+
98
+ --c-footerText: var(--c-themePrimaryLight);
99
+ --c-footerImageFilter: invert(1);
58
100
  }
59
101
 
60
102
  }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: jekyll-theme-simplex
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.9.4
4
+ version: 0.9.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - Ondrej Golasowski
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2021-01-12 00:00:00.000000000 Z
11
+ date: 2021-01-13 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll