jekyll-theme-chirpy 3.0.2 → 3.2.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,10 +1,5 @@
1
1
  /*
2
2
  * Mainly scss modules, only imported to `assets/css/main.scss`
3
- *
4
- * v2.1
5
- * https://github.com/cotes2020/jekyll-theme-chirpy
6
- * © 2020 Cotes Chung
7
- * MIT Licensed
8
3
  */
9
4
 
10
5
  /* ---------- scss placeholder --------- */
@@ -100,6 +95,7 @@
100
95
 
101
96
  @mixin panel-label {
102
97
  @include label(inherit);
98
+
103
99
  display: block;
104
100
  line-height: 1.2;
105
101
  padding-top: 0.5rem;
@@ -1,9 +1,5 @@
1
1
  /*
2
2
  * The syntax highlight.
3
- * v2.0
4
- * https://github.com/cotes2020/jekyll-theme-chirpy
5
- * © 2018-2019 Cotes Chung
6
- * MIT Licensed
7
3
  */
8
4
 
9
5
  @import "colors/light-syntax";
@@ -161,7 +157,7 @@ div {
161
157
  div[class^='language-']::before {
162
158
  content: attr(lang);
163
159
  position: absolute;
164
- right: 1.8rem;
160
+ right: 2rem;
165
161
  margin-top: 3px;
166
162
  font-size: 0.7rem;
167
163
  font-weight: 600;
@@ -174,3 +170,9 @@ div[class^='language-']::before {
174
170
  right: 3.1rem;
175
171
  }
176
172
  }
173
+
174
+ @media (min-width: 1650px) {
175
+ div[class^='language-']::before {
176
+ right: 3.5rem;
177
+ }
178
+ }
@@ -1,10 +1,5 @@
1
1
  /*
2
2
  * Mainly scss variables
3
- *
4
- * v2.1
5
- * https://github.com/cotes2020/jekyll-theme-chirpy
6
- * © 2020 Cotes Chung
7
- * MIT Licensed
8
3
  */
9
4
 
10
5
  /* --- ↓ width and height ---- */
@@ -1,22 +1,23 @@
1
1
  /*!
2
2
  * The styles for Jekyll theme Chirpy
3
3
  *
4
- * Chirpy v3.0.2 (https://github.com/cotes2020/jekyll-theme-chirpy)
5
- * © 2021 Cotes Chung
4
+ * Chirpy v3.2.1 (https://github.com/cotes2020/jekyll-theme-chirpy)
5
+ * © 2019 Cotes Chung
6
6
  * MIT Licensed
7
7
  */
8
8
 
9
- @import "colors/light-typography";
10
- @import "colors/dark-typography";
9
+ @import
10
+ "colors/light-typography",
11
+ "colors/dark-typography",
11
12
 
12
- @import "addon/module";
13
- @import "addon/variables";
14
- @import 'addon/syntax';
15
- @import "addon/commons";
13
+ "addon/module",
14
+ "addon/variables",
15
+ "addon/syntax",
16
+ "addon/commons",
16
17
 
17
- @import "layout/home";
18
- @import "layout/post";
19
- @import "layout/tags";
20
- @import "layout/archives";
21
- @import "layout/categories";
22
- @import "layout/category-tag";
18
+ "layout/home",
19
+ "layout/post",
20
+ "layout/tags",
21
+ "layout/archives",
22
+ "layout/categories",
23
+ "layout/category-tag";
@@ -14,34 +14,12 @@
14
14
 
15
15
  #archives {
16
16
  letter-spacing: 0.03rem;
17
- li {
18
- font-size: 1.1rem;
19
- line-height: 3rem;
20
- &:nth-child(odd) {
21
- background-color: var(--main-wrapper-bg, #fff);
22
- background-image: linear-gradient(
23
- to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff);
24
- }
25
- > div {
26
- white-space: nowrap;
27
- overflow: hidden;
28
- text-overflow: ellipsis;
29
- }
30
- }
31
17
 
32
18
  span.lead {
33
19
  font-size: 1.5rem;
34
20
  position: relative;
35
21
  left: 8px;
36
22
 
37
- &:not(:first-child) {
38
- position: relative;
39
- left: 4px;
40
- &::after {
41
- left: 67px;
42
- }
43
- }
44
-
45
23
  &::after { /* Year dot */
46
24
  content: "";
47
25
  display: block;
@@ -59,8 +37,64 @@
59
37
  box-shadow: 0 0 2px 0 #c2c6cc;
60
38
  z-index: 1;
61
39
  }
40
+
41
+ &:not(:first-child) {
42
+ position: relative;
43
+ left: 4px;
44
+ &::after {
45
+ left: 67px;
46
+ }
47
+ }
48
+
62
49
  } // #archives span.lead
63
50
 
51
+ ul {
52
+ li {
53
+ font-size: 1.1rem;
54
+ line-height: 3rem;
55
+
56
+ div {
57
+ white-space: nowrap;
58
+ overflow: hidden;
59
+ text-overflow: ellipsis;
60
+
61
+ a {
62
+ /* post title in Archvies */
63
+ margin-left: 2.5rem;
64
+ position: relative;
65
+ top: 0.1rem;
66
+ }
67
+ }
68
+
69
+ &:nth-child(odd) {
70
+ background-color: var(--main-wrapper-bg, #fff);
71
+ background-image: linear-gradient(to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff);
72
+ }
73
+
74
+ &::after {
75
+ @extend %date-timeline;
76
+
77
+ height: 2.8rem;
78
+ top: -1.3rem;
79
+ }
80
+
81
+ &:first-child::before {
82
+ @extend %date-timeline;
83
+
84
+ height: 3.06rem;
85
+ top: -1.61rem;
86
+ }
87
+ }
88
+
89
+ &:not(:last-child) > li:last-child::after {
90
+ height: 3.4rem;
91
+ }
92
+
93
+ &:last-child > li:last-child::after {
94
+ display: none;
95
+ }
96
+ } // #archives ul
97
+
64
98
  .date {
65
99
  white-space: nowrap;
66
100
  display: inline-block;
@@ -97,36 +131,8 @@
97
131
  }
98
132
  } // #archives .date
99
133
 
100
- ul {
101
- > li {
102
- > div > a {
103
- /* post title in Archvies */
104
- margin-left: 2.5rem;
105
- position: relative;
106
- top: 0.1rem;
107
- }
108
- &::after {
109
- @extend %date-timeline;
110
- height: 2.8rem;
111
- top: -1.3rem;
112
- }
113
- &:first-child::before {
114
- @extend %date-timeline;
115
- height: 3.06rem;
116
- top: -1.61rem;
117
- }
118
- }
119
- &:not(:last-child) > li:last-child::after {
120
- height: 3.4rem;
121
- }
122
- &:last-child > li:last-child::after {
123
- display: none;
124
- }
125
- } // #archives ul
126
-
127
134
  } // #archives
128
135
 
129
-
130
136
  @media all and (max-width: 576px) {
131
137
  #archives {
132
138
  margin-top: -1rem;
@@ -11,6 +11,14 @@
11
11
  .card-header {
12
12
  padding-right: 12px;
13
13
  }
14
+
15
+ i {
16
+ &.far,
17
+ &.fas {
18
+ font-size: 86%; // fontawesome icons
19
+ }
20
+ }
21
+
14
22
  .list-group-item {
15
23
  border-left: none;
16
24
  border-right: none;
@@ -29,12 +37,6 @@
29
37
  @extend %category-icon-color;
30
38
  }
31
39
 
32
- i {
33
- &.far, &.fas {
34
- font-size: 86%; // fontawesome icons
35
- }
36
- }
37
-
38
40
  } // .categories
39
41
 
40
42
  .category-trigger {
@@ -42,7 +44,7 @@
42
44
  height: 1.7rem;
43
45
  border-radius: 50%;
44
46
  text-align: center;
45
- color: #6c757d!important;
47
+ color: #6c757d !important;
46
48
  > i.fas {
47
49
  position: relative;
48
50
  height: 0.7rem;
@@ -2,10 +2,17 @@
2
2
  Style for page Category and Tag
3
3
  */
4
4
 
5
- #page-category, #page-tag {
5
+ .dash {
6
+ margin: 0 .5rem .6rem .5rem;
7
+ border-bottom: 2px dotted var(--dash-color);
8
+ }
9
+
10
+ #page-category,
11
+ #page-tag {
6
12
  ul > li {
7
13
  line-height: 1.5rem;
8
14
  padding: 0.6rem 0;
15
+
9
16
  &::before { // dot
10
17
  background: #999;
11
18
  width: 5px;
@@ -17,14 +24,16 @@
17
24
  top: 0.6rem;
18
25
  margin-right: 0.5rem;
19
26
  }
27
+
20
28
  > a { /* post's title */
21
- font-size: 1.1rem;
22
29
  @extend %no-bottom-border;
30
+
31
+ font-size: 1.1rem;
23
32
  }
33
+
24
34
  > span:last-child {
25
35
  white-space: nowrap;
26
- }
27
- /* post's date */
36
+ } /* post's date */
28
37
  }
29
38
  }
30
39
 
@@ -36,22 +45,19 @@
36
45
  font-size: 1.25rem;
37
46
  }
38
47
 
39
- a:hover {
40
- #page-category &,
41
- #page-tag &,
42
- #access-lastmod & {
48
+ #page-category,
49
+ #page-tag,
50
+ #access-lastmod {
51
+ a:hover {
43
52
  @extend %link-hover;
53
+
44
54
  margin-bottom: -1px; // Avoid jumping
45
55
  }
46
56
  }
47
57
 
48
- .dash {
49
- margin: 0 .5rem .6rem .5rem;
50
- border-bottom: 2px dotted var(--dash-color);
51
- }
52
-
53
58
  @media all and (max-width: 576px) {
54
- #page-category, #page-tag {
59
+ #page-category,
60
+ #page-tag {
55
61
  ul > li {
56
62
  &::before {
57
63
  margin: 0 .5rem;
@@ -2,59 +2,6 @@
2
2
  Style for Homepage
3
3
  */
4
4
 
5
- #post-list {
6
- margin-top: 1rem;
7
- padding-right: 0.5rem;
8
-
9
- .post-preview {
10
- padding-top: 1.5rem;
11
- padding-bottom: 1rem;
12
- border-bottom: 1px solid var(--main-border-color);
13
-
14
- h1 {
15
- font-size: 1.4rem;
16
- margin: 0;
17
- }
18
-
19
- .post-meta {
20
- i {
21
- font-size: 0.73rem;
22
- }
23
- span:not(:last-child) {
24
- margin-right: 1.2rem;
25
- }
26
- }
27
-
28
- .post-content {
29
- margin-top: 0.6rem;
30
- margin-bottom: 0.6rem;
31
- color: var(--post-list-text-color);
32
- > p {
33
- /* Make preview shorter on the homepage */
34
- margin: 0;
35
- overflow: hidden;
36
- text-overflow: ellipsis;
37
- display: -webkit-box;
38
- -webkit-line-clamp: 2;
39
- -webkit-box-orient: vertical;
40
- }
41
- }
42
-
43
- .pin {
44
- > i {
45
- transform: rotate(45deg);
46
- padding-left: 3px;
47
- color: var(--pin-color);
48
- }
49
- > span {
50
- display: none;
51
- }
52
- }
53
-
54
- } // .post-preview
55
-
56
- } // #post-list
57
-
58
5
  .pagination {
59
6
  font-size: 1rem;
60
7
  a:hover {
@@ -79,7 +26,7 @@
79
26
  font-family: 'Lato', sans-serif;
80
27
  background-color: var(--button-bg);
81
28
  &:hover {
82
- background-color: var(--btn-paginator-hover-color)
29
+ background-color: var(--btn-paginator-hover-color);
83
30
  }
84
31
  }
85
32
  &.active {
@@ -109,6 +56,63 @@
109
56
 
110
57
  } // .pagination
111
58
 
59
+ #post-list {
60
+ margin-top: 1rem;
61
+ padding-right: 0.5rem;
62
+
63
+ .post-preview {
64
+ padding-top: 1.5rem;
65
+ padding-bottom: 1rem;
66
+ border-bottom: 1px solid var(--main-border-color);
67
+
68
+ a:hover {
69
+ @extend %link-hover;
70
+ }
71
+
72
+ h1 {
73
+ font-size: 1.4rem;
74
+ margin: 0;
75
+ }
76
+
77
+ .post-meta {
78
+ i {
79
+ font-size: 0.73rem;
80
+ }
81
+ span:not(:last-child) {
82
+ margin-right: 1.2rem;
83
+ }
84
+ }
85
+
86
+ .post-content {
87
+ margin-top: 0.6rem;
88
+ margin-bottom: 0.6rem;
89
+ color: var(--post-list-text-color);
90
+ > p {
91
+ /* Make preview shorter on the homepage */
92
+ margin: 0;
93
+ overflow: hidden;
94
+ text-overflow: ellipsis;
95
+ display: -webkit-box;
96
+ -webkit-line-clamp: 2;
97
+ -webkit-box-orient: vertical;
98
+ }
99
+ }
100
+
101
+ .pin {
102
+ > i {
103
+ transform: rotate(45deg);
104
+ padding-left: 3px;
105
+ color: var(--pin-color);
106
+ }
107
+ > span {
108
+ display: none;
109
+ }
110
+ }
111
+
112
+ } // .post-preview
113
+
114
+ } // #post-list
115
+
112
116
  /* Hide SideBar and TOC */
113
117
  @media all and (max-width: 830px) {
114
118
  .pagination {