jekyll-theme-open-course 2.3.0 → 2.4.0

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: 716df6bf04c275d4007f6d4e949423fa8c98ff93fcfaf8853b817582f7d07978
4
- data.tar.gz: 21964c6358a01696074d03252a050c5340ed8aab96f3efd8ac0f6a969b961f22
3
+ metadata.gz: 4bb9aa2434b1e4e4e0543a12c2e2c442635978579260c335fb4ae300a5a61e15
4
+ data.tar.gz: 9f4347b3bd3f224364ace21cf85f58e83a09bf38e08a1c8e594871a79c295184
5
5
  SHA512:
6
- metadata.gz: b91575da3506b994cc3ad35960d222b3fd35c2cb3b503e93f3e4d119362d79d860eb9f5cd36ae0e079f286ced418cc391b9f630239d6a509448cce61605c43b3
7
- data.tar.gz: 66cb78d35083548cb234b6d037f760c15737b8e19b2c35aba406279e91e3d394756597180d6bcc6e0b5afbca7ac8219a9ca5b5269ac88d10ca351d8e9cde1aa5
6
+ metadata.gz: '080db13b9df00ccfe29ea5cae769befb8c9273aba284dee348436f8753c091d3340bd91c183d5b3897dbd9e474f7184406c102b858371bc52a3e9a2ce576c43c'
7
+ data.tar.gz: ceb510fa60404129b7b205811f187ee8b95e5d7b400cedf140880af61ad3e08ad50ceaadce56ad5b709b2d092ef1b1449ac0446affb754ad58b1383a25a74dd1
@@ -77,8 +77,8 @@ a {
77
77
  @supports (text-decoration-color: red) {
78
78
  a {
79
79
  color: inherit;
80
- text-decoration-color: $spot-color;
81
- text-decoration-color: var(--color-spot);
80
+ text-decoration-color: $link-under;
81
+ text-decoration-color: var(--color-link);
82
82
  }
83
83
  }
84
84
  #header h1 a {
@@ -179,10 +179,10 @@ header small {
179
179
  color: var(--color-text);
180
180
  }
181
181
  #header #theme-button {
182
- background-color: $text-color;
183
- background-color: var(--color-text);
184
- border-color: $text-color;
185
- border-color: var(--color-text);
182
+ background-color: $acnt-color;
183
+ background-color: var(--color-acnt);
184
+ border-color: $acnt-color;
185
+ border-color: var(--color-acnt);
186
186
  color: $back-color;
187
187
  color: var(--color-back);
188
188
  }
@@ -0,0 +1,192 @@
1
+ $text-color: #321207;
2
+ $back-color: #F6EACB;
3
+ $spot-color: #6C1F55;
4
+ $acnt-color: #B34523;
5
+ $gray-color: #73664E; /* #7F7F7F; */
6
+ $gray-alter: darken($gray-color, 10%);
7
+ $link-under: transparentize($spot-color, 0.65);
8
+ $curr-color: darken($back-color, 8%);
9
+
10
+ // Dark mode
11
+ $dk-text-color: #DEDEDE;
12
+ $dk-back-color: #111;
13
+ $dk-spot-color: #FFB700;
14
+ $dk-acnt-color: #FF764D;
15
+ $dk-gray-color: #9E9E9E;
16
+ $dk-link-under: transparentize($dk-spot-color, 0.25);
17
+ $dk-curr-color: darken($dk-gray-color, 45%);
18
+
19
+
20
+ // CSS Variables
21
+ html,
22
+ html.light {
23
+ --color-text: #{$text-color};
24
+ --color-back: #{$back-color};
25
+ --color-spot: #{$spot-color};
26
+ --color-acnt: #{$acnt-color};
27
+ --color-gray: #{$gray-color};
28
+ --color-curr: #{$curr-color};
29
+ --color-altg: #{$gray-alter};
30
+ --color-link: #{$link-under};
31
+ --color-navi: #{$gray-color};
32
+ --color-nava: #{$back-color};
33
+ }
34
+ html.dark {
35
+ --color-text: #{$dk-text-color};
36
+ --color-back: #{$dk-back-color};
37
+ --color-spot: #{$dk-spot-color};
38
+ --color-acnt: #{$dk-acnt-color};
39
+ --color-gray: #{$dk-gray-color};
40
+ --color-curr: #{$dk-curr-color};
41
+ --color-altg: #{$dk-gray-color};
42
+ --color-link: #{$dk-link-under};
43
+ --color-navi: #{$dk-gray-color};
44
+ --color-nava: #{$dk-back-color};
45
+ }
46
+ @media screen and (prefers-color-scheme: dark) {
47
+ html {
48
+ --color-text: #{$dk-text-color};
49
+ --color-back: #{$dk-back-color};
50
+ --color-spot: #{$dk-spot-color};
51
+ --color-acnt: #{$dk-acnt-color};
52
+ --color-gray: #{$dk-gray-color};
53
+ --color-curr: #{$dk-curr-color};
54
+ --color-altg: #{$dk-gray-color};
55
+ --color-link: #{$dk-link-under};
56
+ --color-navi: #{$dk-gray-color};
57
+ --color-nava: #{$dk-back-color};
58
+ }
59
+ }
60
+
61
+ html {
62
+ transition: color 0.5s, background-color 0.5s;
63
+ color: $text-color;
64
+ color: var(--color-text);
65
+ background-color: $back-color;
66
+ background-color: var(--color-back);
67
+ }
68
+ ol > li::before,
69
+ ul li::before {
70
+ color: $acnt-color;
71
+ color: var(--color-acnt);
72
+ }
73
+ a {
74
+ color: $spot-color;
75
+ color: var(--color-spot);
76
+ }
77
+ @supports (text-decoration-color: red) {
78
+ a {
79
+ color: inherit;
80
+ text-decoration-color: $link-under;
81
+ text-decoration-color: var(--color-link);
82
+ }
83
+ }
84
+ #header h1 a {
85
+ color: $spot-color;
86
+ color: var(--color-spot);
87
+ }
88
+ .nav a {
89
+ border: 1px solid $acnt-color;
90
+ border: 1px solid var(--color-acnt);
91
+ color: $gray-color;
92
+ color: var(--color-navi);
93
+ }
94
+ .nav a:hover,
95
+ .nav a:focus,
96
+ .nav a:active,
97
+ #calendar #nav-cal a,
98
+ #policies #nav-pol a,
99
+ #projects #nav-pro a {
100
+ background-color: $acnt-color;
101
+ background-color: var(--color-acnt);
102
+ color: $back-color;
103
+ color: var(--color-nava);
104
+ }
105
+
106
+ .recommended,
107
+ .project .description,
108
+ .project .goals,
109
+ .week .agenda,
110
+ .fine-print {
111
+ color: $gray-color;
112
+ color: var(--color-gray);
113
+ }
114
+ .current {
115
+ transition: background-color 0.5s;
116
+ background-color: $curr-color;
117
+ background-color: var(--color-curr);
118
+ }
119
+ .week.current .agenda {
120
+ color: $gray-alter;
121
+ color: var(--color-altg);
122
+ }
123
+ #btn-show-calendar {
124
+ background-color: $back-color;
125
+ background-color: var(--color-back);
126
+ color: $gray-color;
127
+ color: var(--color-gray);
128
+ border: 1px solid $gray-color;
129
+ border: 1px solid var(--color-gray);
130
+ }
131
+ #btn-show-calendar:active,
132
+ #btn-show-calendar:focus,
133
+ #btn-show-calendar:hover {
134
+ background-color: $gray-color;
135
+ background-color: var(--color-gray);
136
+ color: $back-color;
137
+ color: var(--color-back);
138
+ }
139
+ .agenda h3 a {
140
+ background-color: inherit;
141
+ color: $acnt-color;
142
+ color: var(--color-acnt);
143
+ }
144
+ .youtube {
145
+ color: pink;
146
+ fill: $acnt-color;
147
+ fill: var(--color-acnt);
148
+ }
149
+ .agenda h3 a:active,
150
+ .agenda h3 a:focus,
151
+ .agenda h3 a:hover {
152
+ background-color: $acnt-color;
153
+ background-color: var(--color-acnt);
154
+ color: $back-color;
155
+ color: var(--color-back);
156
+ }
157
+ a:active .youtube,
158
+ a:focus .youtube,
159
+ a:hover .youtube {
160
+ fill: $back-color;
161
+ fill: var(--color-back);
162
+ }
163
+ header small {
164
+ color: $spot-color;
165
+ color: var(--color-spot);
166
+ }
167
+ .week > header small {
168
+ color: $gray-color;
169
+ color: var(--color-gray);
170
+ }
171
+ #header,
172
+ #footer,
173
+ #instructor {
174
+ color: $gray-color;
175
+ color: var(--color-gray);
176
+ }
177
+ #header .nav {
178
+ color: $text-color;
179
+ color: var(--color-text);
180
+ }
181
+ #header #theme-button {
182
+ background-color: $acnt-color;
183
+ background-color: var(--color-acnt);
184
+ border-color: $acnt-color;
185
+ border-color: var(--color-acnt);
186
+ color: $back-color;
187
+ color: var(--color-back);
188
+ }
189
+ #header #theme-button svg {
190
+ fill: $back-color;
191
+ fill: var(--color-back);
192
+ }
@@ -143,7 +143,7 @@ h2 {
143
143
  header small {
144
144
  display: block;
145
145
  font-weight: 500;
146
- // padding-top: $base-line * 0.25;
146
+ padding-top: $base-line * 0.25;
147
147
  }
148
148
  .week > header small {
149
149
  font-weight: normal;
@@ -184,6 +184,7 @@ header small {
184
184
  /* ~ 690px */
185
185
  @media screen and (min-width: 43.125em) {
186
186
  #header,
187
+ .error,
187
188
  .policy,
188
189
  .project,
189
190
  .week,
@@ -197,6 +198,7 @@ header small {
197
198
  grid-template-rows: auto ($base-line * 3.25);
198
199
  align-content: stretch;
199
200
  }
201
+ .error header,
200
202
  .policy header,
201
203
  .project header,
202
204
  .week header {
@@ -212,6 +214,7 @@ header small {
212
214
  grid-row: 2 / 4;
213
215
  }
214
216
 
217
+ .error > *,
215
218
  .policy > * {
216
219
  grid-column: 1 / 5;
217
220
  }
@@ -339,6 +342,7 @@ header small {
339
342
  #footer {
340
343
  padding-top: 0;
341
344
  }
345
+ .error,
342
346
  .policy,
343
347
  .project,
344
348
  .week {
@@ -0,0 +1,192 @@
1
+ $text-color: #470E49;
2
+ $back-color: #ECE9D8;
3
+ $spot-color: #18384D;
4
+ $acnt-color: #596B6B;
5
+ $gray-color: #6D626F; /* #7F7F7F; */
6
+ $gray-alter: darken($gray-color, 10%);
7
+ $link-under: $acnt-color;
8
+ $curr-color: #D4CCBE;
9
+
10
+ // Dark mode
11
+ $dk-text-color: $back-color;
12
+ $dk-back-color: darken($text-color, 10%);
13
+ $dk-spot-color: #E5DDB6;
14
+ $dk-acnt-color: lighten(#627482, 10%);
15
+ $dk-gray-color: lighten($gray-color, 30%);
16
+ $dk-link-under: $dk-acnt-color;
17
+ $dk-curr-color: darken($text-color, 12%);
18
+
19
+
20
+ // CSS Variables
21
+ html,
22
+ html.light {
23
+ --color-text: #{$text-color};
24
+ --color-back: #{$back-color};
25
+ --color-spot: #{$spot-color};
26
+ --color-acnt: #{$acnt-color};
27
+ --color-gray: #{$gray-color};
28
+ --color-curr: #{$curr-color};
29
+ --color-altg: #{$gray-alter};
30
+ --color-link: #{$link-under};
31
+ --color-navi: #{$gray-color};
32
+ --color-nava: #{$back-color};
33
+ }
34
+ html.dark {
35
+ --color-text: #{$dk-text-color};
36
+ --color-back: #{$dk-back-color};
37
+ --color-spot: #{$dk-spot-color};
38
+ --color-acnt: #{$dk-acnt-color};
39
+ --color-gray: #{$dk-gray-color};
40
+ --color-curr: #{$dk-curr-color};
41
+ --color-altg: #{$dk-gray-color};
42
+ --color-link: #{$dk-link-under};
43
+ --color-navi: #{$dk-gray-color};
44
+ --color-nava: #{$dk-back-color};
45
+ }
46
+ @media screen and (prefers-color-scheme: dark) {
47
+ html {
48
+ --color-text: #{$dk-text-color};
49
+ --color-back: #{$dk-back-color};
50
+ --color-spot: #{$dk-spot-color};
51
+ --color-acnt: #{$dk-acnt-color};
52
+ --color-gray: #{$dk-gray-color};
53
+ --color-curr: #{$dk-curr-color};
54
+ --color-altg: #{$dk-gray-color};
55
+ --color-link: #{$dk-link-under};
56
+ --color-navi: #{$dk-gray-color};
57
+ --color-nava: #{$dk-back-color};
58
+ }
59
+ }
60
+
61
+ html {
62
+ transition: color 0.5s, background-color 0.5s;
63
+ color: $text-color;
64
+ color: var(--color-text);
65
+ background-color: $back-color;
66
+ background-color: var(--color-back);
67
+ }
68
+ ol > li::before,
69
+ ul li::before {
70
+ color: $acnt-color;
71
+ color: var(--color-acnt);
72
+ }
73
+ a {
74
+ color: $spot-color;
75
+ color: var(--color-spot);
76
+ }
77
+ @supports (text-decoration-color: red) {
78
+ a {
79
+ color: inherit;
80
+ text-decoration-color: $link-under;
81
+ text-decoration-color: var(--color-link);
82
+ }
83
+ }
84
+ #header h1 a {
85
+ color: $spot-color;
86
+ color: var(--color-spot);
87
+ }
88
+ .nav a {
89
+ border: 1px solid $acnt-color;
90
+ border: 1px solid var(--color-acnt);
91
+ color: $gray-color;
92
+ color: var(--color-navi);
93
+ }
94
+ .nav a:hover,
95
+ .nav a:focus,
96
+ .nav a:active,
97
+ #calendar #nav-cal a,
98
+ #policies #nav-pol a,
99
+ #projects #nav-pro a {
100
+ background-color: $acnt-color;
101
+ background-color: var(--color-acnt);
102
+ color: $back-color;
103
+ color: var(--color-nava);
104
+ }
105
+
106
+ .recommended,
107
+ .project .description,
108
+ .project .goals,
109
+ .week .agenda,
110
+ .fine-print {
111
+ color: $gray-color;
112
+ color: var(--color-gray);
113
+ }
114
+ .current {
115
+ transition: background-color 0.5s;
116
+ background-color: $curr-color;
117
+ background-color: var(--color-curr);
118
+ }
119
+ .week.current .agenda {
120
+ color: $gray-alter;
121
+ color: var(--color-altg);
122
+ }
123
+ #btn-show-calendar {
124
+ background-color: $back-color;
125
+ background-color: var(--color-back);
126
+ color: $gray-color;
127
+ color: var(--color-gray);
128
+ border: 1px solid $gray-color;
129
+ border: 1px solid var(--color-gray);
130
+ }
131
+ #btn-show-calendar:active,
132
+ #btn-show-calendar:focus,
133
+ #btn-show-calendar:hover {
134
+ background-color: $gray-color;
135
+ background-color: var(--color-gray);
136
+ color: $back-color;
137
+ color: var(--color-back);
138
+ }
139
+ .agenda h3 a {
140
+ background-color: inherit;
141
+ color: $acnt-color;
142
+ color: var(--color-acnt);
143
+ }
144
+ .youtube {
145
+ color: pink;
146
+ fill: $acnt-color;
147
+ fill: var(--color-acnt);
148
+ }
149
+ .agenda h3 a:active,
150
+ .agenda h3 a:focus,
151
+ .agenda h3 a:hover {
152
+ background-color: $acnt-color;
153
+ background-color: var(--color-acnt);
154
+ color: $back-color;
155
+ color: var(--color-back);
156
+ }
157
+ a:active .youtube,
158
+ a:focus .youtube,
159
+ a:hover .youtube {
160
+ fill: $back-color;
161
+ fill: var(--color-back);
162
+ }
163
+ header small {
164
+ color: $spot-color;
165
+ color: var(--color-spot);
166
+ }
167
+ .week > header small {
168
+ color: $gray-color;
169
+ color: var(--color-gray);
170
+ }
171
+ #header,
172
+ #footer,
173
+ #instructor {
174
+ color: $gray-color;
175
+ color: var(--color-gray);
176
+ }
177
+ #header .nav {
178
+ color: $text-color;
179
+ color: var(--color-text);
180
+ }
181
+ #header #theme-button {
182
+ background-color: $acnt-color;
183
+ background-color: var(--color-acnt);
184
+ border-color: $acnt-color;
185
+ border-color: var(--color-acnt);
186
+ color: $back-color;
187
+ color: var(--color-back);
188
+ }
189
+ #header #theme-button svg {
190
+ fill: $back-color;
191
+ fill: var(--color-back);
192
+ }
@@ -17,6 +17,10 @@ html.loading * {
17
17
  }
18
18
 
19
19
  @import "fonts";
20
+ {% if site.course.css.theme %}
21
+ @import "{{site.course.css.theme}}.colors";
22
+ {% else %}
20
23
  @import "colors";
24
+ {% endif %}
21
25
  @import "typography";
22
26
  @import "base";
@@ -5,7 +5,7 @@ module JTOpenCourse
5
5
  require 'fileutils'
6
6
  require 'pathname'
7
7
 
8
- VERSION = "2.3.0"
8
+ VERSION = "2.4.0"
9
9
 
10
10
  SPELLED_NUMS = %w(
11
11
  Zero One Two Three Four Five Six Seven Eight Nine Ten Eleven Twelve Thirteen Fourteen Fifteen
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: jekyll-theme-open-course
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.3.0
4
+ version: 2.4.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Karl Stolley
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2020-11-28 00:00:00.000000000 Z
11
+ date: 2020-12-10 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -73,8 +73,10 @@ files:
73
73
  - _layouts/projects.html
74
74
  - _sass/_base.scss
75
75
  - _sass/_colors.scss
76
+ - _sass/_fall.colors.scss
76
77
  - _sass/_fonts.scss
77
78
  - _sass/_typography.scss
79
+ - _sass/_winter.colors.scss
78
80
  - assets/css/print.css
79
81
  - assets/css/screen.scss
80
82
  - assets/img/te.png