r-jekyll-theme 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE +21 -0
  3. data/README.md +55 -0
  4. data/_config.yml +59 -0
  5. data/_includes/content/multipage.html +10 -0
  6. data/_includes/content/singlepage.html +7 -0
  7. data/_includes/footer.html +17 -0
  8. data/_includes/glossary.md +21 -0
  9. data/_includes/head.html +20 -0
  10. data/_includes/header.html +24 -0
  11. data/_includes/print/cover_back.html +20 -0
  12. data/_includes/print/cover_front.html +12 -0
  13. data/_includes/print/print_button.html +1 -0
  14. data/_includes/toc/pages.html +21 -0
  15. data/_includes/toc/sections.html +170 -0
  16. data/_layouts/default.html +21 -0
  17. data/_layouts/singlepage_dev.html +20 -0
  18. data/_sass/_variables.scss +30 -0
  19. data/_sass/r.scss +40 -0
  20. data/_sass/r/content/abbr.scss +61 -0
  21. data/_sass/r/content/code.scss +123 -0
  22. data/_sass/r/content/image.scss +32 -0
  23. data/_sass/r/content/link.scss +22 -0
  24. data/_sass/r/content/list.scss +64 -0
  25. data/_sass/r/content/note.scss +41 -0
  26. data/_sass/r/content/paragraph.scss +16 -0
  27. data/_sass/r/content/quote.scss +27 -0
  28. data/_sass/r/content/table.scss +76 -0
  29. data/_sass/r/content/title.scss +64 -0
  30. data/_sass/r/layout/columns.scss +36 -0
  31. data/_sass/r/layout/desktop.scss +187 -0
  32. data/_sass/r/layout/mobile.scss +242 -0
  33. data/_sass/r/layout/print.scss +204 -0
  34. data/_sass/r/styling/animations.scss +43 -0
  35. data/_sass/r/styling/button.scss +26 -0
  36. data/_sass/r/styling/formatting.scss +10 -0
  37. data/_sass/r/styling/selection.scss +5 -0
  38. data/_sass/r/styling/shadow.scss +33 -0
  39. data/assets/bicycle.jpg +0 -0
  40. data/assets/favicon.svg +52 -0
  41. data/assets/icons/500px.svg +83 -0
  42. data/assets/icons/500px_dark.svg +83 -0
  43. data/assets/icons/email.svg +52 -0
  44. data/assets/icons/email_dark.svg +52 -0
  45. data/assets/icons/github.svg +79 -0
  46. data/assets/icons/github_dark.svg +79 -0
  47. data/assets/icons/linkedin.svg +53 -0
  48. data/assets/icons/linkedin_dark.svg +53 -0
  49. data/assets/icons/twitter.svg +46 -0
  50. data/assets/icons/twitter_dark.svg +46 -0
  51. data/assets/main.scss +3 -0
  52. metadata +107 -0
@@ -0,0 +1,16 @@
1
+ /* Position paragraphs */
2
+ p {
3
+ margin: $margin 0 0 0;
4
+ display: block;
5
+ font-size: 1.6rem;
6
+ }
7
+
8
+ /* Reduce margins after titles */
9
+ h1 + p,
10
+ h2 + p,
11
+ h3 + p,
12
+ h4 + p,
13
+ h5 + p,
14
+ h6 + p {
15
+ margin-top: $margin-small;
16
+ }
@@ -0,0 +1,27 @@
1
+ /* Style cite elements. */
2
+ cite {
3
+ font-style: italic;
4
+ }
5
+
6
+ /* Style quote elements */
7
+ q {
8
+ font-style: italic;
9
+ }
10
+ q::before,
11
+ q::after {
12
+ content: '"';
13
+ font-style: inherit;
14
+ }
15
+
16
+ /* Style long quote elements. */
17
+ blockquote {
18
+ width: fit-content;
19
+ margin: $margin 0;
20
+ padding: 0 0.5rem 0 0.5rem;
21
+ background-color: $background-middle;
22
+ font-size: 1.3rem;
23
+ border-radius: $border-radius;
24
+ }
25
+ blockquote * {
26
+ font-size: 1.3rem;
27
+ }
@@ -0,0 +1,76 @@
1
+ /* Tables */
2
+ table {
3
+ width: 100%;
4
+ margin: $margin 0;
5
+ table-layout: auto;
6
+ border-collapse: collapse;
7
+ border: none;
8
+ border-top: 0.25rem solid $primary-color;
9
+ border-bottom: 0.25rem solid $primary-color;
10
+ }
11
+
12
+ /* Tables without headers */
13
+ table:has(thead) {
14
+ border-top: none;
15
+ }
16
+
17
+
18
+ /* Table entries padding */
19
+ td,
20
+ tr,
21
+ th {
22
+ padding: 0.5em;
23
+ }
24
+ th,
25
+ th * {
26
+ font-weight: bold;
27
+ color: $text-light;
28
+ background-color: $primary-color;
29
+ }
30
+
31
+ /* Uneven table rows. */
32
+ tr:nth-child(odd) > td {
33
+ background-color: transparent;
34
+ }
35
+
36
+ /* Even table rows. */
37
+ tr:nth-child(even) > td {
38
+ background-color: $background-middle;
39
+ }
40
+
41
+ /*** Special table - START */
42
+ table.cv-experience {
43
+ border: none;
44
+ width: 100%;
45
+ margin-top: $margin;
46
+ display: block;
47
+
48
+ thead {
49
+ display: none;
50
+ }
51
+
52
+ tr > td {
53
+ background-color: transparent;
54
+ vertical-align: top;
55
+ }
56
+
57
+ tr > td:nth-child(1) {
58
+ padding: 0.75rem 2.5rem 0.75rem 0;
59
+ }
60
+
61
+ tr > td:nth-child(2) {
62
+ border-left: $border-thin;
63
+ padding: 0.75rem 0 0.75rem 2.5rem;
64
+ }
65
+
66
+ td {
67
+ color: $primary-color;
68
+ font-size: 1.4rem;
69
+
70
+ strong {
71
+ color: $text-dark;
72
+ font-size: 1.6rem;
73
+ }
74
+ }
75
+ }
76
+ /*** Special table - END */
@@ -0,0 +1,64 @@
1
+ /* ALl titles */
2
+ h1,
3
+ h2,
4
+ h3,
5
+ h4,
6
+ h5,
7
+ h6 {
8
+ margin: 1.5em 0 0 0;
9
+ color: $primary-color;
10
+ display: block;
11
+ clear: both;
12
+ line-height: 1.1em;
13
+ margin-left: -0.035em;
14
+ }
15
+ h1 *,
16
+ h2 *,
17
+ h3 *,
18
+ h4 *,
19
+ h5 *,
20
+ h6 * {
21
+ letter-spacing: inherit;
22
+ color: inherit;
23
+ font-weight: inherit;
24
+ font-size: inherit;
25
+ }
26
+
27
+ /* Individual titles */
28
+ h1 {
29
+ margin: 0;
30
+ font-size: 3.8rem;
31
+ font-weight: bold;
32
+ margin-left: -0.035em;
33
+ }
34
+ h2 {
35
+ font-size: 2.4rem;
36
+ font-weight: bold;
37
+ color: $primary-color;
38
+
39
+ }
40
+ h3 {
41
+ margin: 1em 0 0 0;
42
+ font-size: 2.0rem;
43
+ font-weight: normal;
44
+ }
45
+ h4,
46
+ h5,
47
+ h6 {
48
+ margin: 1em 0 0 0;
49
+ font-size: 1.8rem;
50
+ font-weight: normal;
51
+ }
52
+
53
+ /* Support images in titles */
54
+ h1 > img,
55
+ h2 > img,
56
+ h3 > img,
57
+ h4 > img,
58
+ h5 > img,
59
+ h6 > img {
60
+ display: inline;
61
+ margin: inherit;
62
+ height: 1.2em;
63
+ margin-bottom: -0.25em;
64
+ }
@@ -0,0 +1,36 @@
1
+ /* Define column count */
2
+ .two_column {
3
+ column-count: 2;
4
+ }
5
+ .three_column {
6
+ column-count: 3;
7
+ }
8
+ .four_column {
9
+ column-count: 4;
10
+ }
11
+
12
+ /* Style column classes */
13
+ .two_column,
14
+ .three_column,
15
+ .four_column {
16
+ column-gap: $margin;
17
+ }
18
+
19
+ /* Avoid breaking some elements in columns */
20
+ .two_column p,
21
+ .three_column p,
22
+ .four_column p,
23
+ .two_column dt,
24
+ .three_column dt,
25
+ .four_column dt,
26
+ .two_column dd,
27
+ .three_column dd,
28
+ .four_column dd,
29
+ .two_column h1,
30
+ .three_column h1,
31
+ .four_column h1,
32
+ .two_column h2,
33
+ .three_column h2,
34
+ .four_column h2 {
35
+ break-inside: avoid;
36
+ }
@@ -0,0 +1,187 @@
1
+ /*** General - START */
2
+ html {
3
+ scroll-behavior: smooth;
4
+ font-size: 62.5%;
5
+ margin: 0;
6
+ }
7
+ * {
8
+ font-family: $main-font;
9
+ line-height: 1.6em;
10
+ text-align: left;
11
+ color: $text-dark;
12
+ font-size: 1.6rem;
13
+ }
14
+ .print {
15
+ display: none;
16
+ }
17
+ /*** General - END */
18
+
19
+ /*** Body - START */
20
+ body {
21
+ margin: 0;
22
+ padding: 0;
23
+ display: block;
24
+ background-color: $background-light;
25
+ }
26
+
27
+ main#page-content {
28
+ display: block;
29
+ min-width: 60rem;
30
+ margin: 0 0 0 35rem;
31
+ }
32
+
33
+ article {
34
+ color: $text-dark;
35
+ padding: 5rem 10rem;
36
+ }
37
+
38
+ article + article {
39
+ border-top: 0.5rem dashed $background-middle;
40
+ }
41
+
42
+ /*** Body - END */
43
+
44
+ /*** Header - START */
45
+ header#site-header {
46
+ position: fixed;
47
+ display: flexbox;
48
+ width: 30rem;
49
+ top: 0;
50
+ left: 0;
51
+ bottom: 0;
52
+ padding: 5rem 2.5rem 0 2.5rem;
53
+ text-align: left;
54
+ background-color: $primary-color;
55
+ overflow-y: auto;
56
+ -ms-overflow-style: none;
57
+ scrollbar-width: none;
58
+ }
59
+ header#site-header::-webkit-scrollbar {
60
+ display: none;
61
+ }
62
+
63
+ /* Logo */
64
+ div#site-logo-container {
65
+ display: flex;
66
+ justify-content: flex-start;
67
+ overflow: hidden;
68
+ flex-grow: 0;
69
+ flex-shrink: 0;
70
+ margin: 0 2rem;
71
+ }
72
+ a#site-logo {
73
+ font-size: 15rem;
74
+ font-weight: normal;
75
+ color: $text-light;
76
+ text-decoration: none;
77
+ line-height: 0.8em;
78
+ font-family: $logo-font;
79
+ margin-left: -0.035em;
80
+ }
81
+
82
+ /* Navigation */
83
+ nav#site-nav {
84
+ display: flex;
85
+ align-items: flex-start;
86
+ justify-content: flex-start;
87
+ margin: 3.5rem 0;
88
+ max-width: 30rem;
89
+ }
90
+
91
+ div#site-nav-page {
92
+ padding: 0 1.5rem 0 2rem;
93
+ }
94
+ div#site-nav-section {
95
+ padding: 0 2rem 0 1.5rem;
96
+ border-left: 0.25rem solid $text-light;
97
+ }
98
+
99
+ /* Navigation links */
100
+ div#toc-pages ul {
101
+ margin: 0;
102
+ padding: 0;
103
+ display: flexbox;
104
+ justify-content: flex-start;
105
+ flex-wrap: wrap;
106
+ }
107
+ div#toc-sections ul {
108
+ margin: 0;
109
+ padding: 0;
110
+ display: flexbox;
111
+ justify-content: flex-start;
112
+ flex-wrap: wrap;
113
+ }
114
+ div#toc-pages li {
115
+ list-style: none;
116
+ padding-bottom: 0.8em;
117
+ }
118
+ div#toc-sections li {
119
+ list-style: none;
120
+ }
121
+
122
+ /* Navigation links */
123
+ #toc-pages a.nav-link {
124
+ font-weight: bold;
125
+ font-size: 2.2rem;
126
+ }
127
+ #toc-sections a.nav-link {
128
+ font-size: 1.6rem;
129
+ }
130
+ a.nav-link {
131
+ color: $text-light;
132
+ text-decoration: none;
133
+ text-transform: lowercase;
134
+ line-height: 0;
135
+ }
136
+ a.nav-link:hover,
137
+ a.nav-link:active,
138
+ a.nav-link:focus {
139
+ text-decoration: underline;
140
+ }
141
+ /*** Header - END */
142
+
143
+ /*** Footer - START */
144
+ footer#site-footer {
145
+ position: fixed;
146
+ left: 0;
147
+ bottom: 0;
148
+ display: flexbox;
149
+ width: 30rem;
150
+ background-color: $primary-color;
151
+ padding: 2.5rem;
152
+ }
153
+ div.footer-column {
154
+ color: $text-light;
155
+ padding: 0 2.5rem;
156
+ font-weight: normal;
157
+ font-size: 1.2rem;
158
+ text-decoration: none;
159
+ }
160
+
161
+ a.footer-link {
162
+ color: $text-light;
163
+ font-weight: bold;
164
+ font-size: 1.2rem;
165
+ text-decoration: none;
166
+ }
167
+ a.footer-link:hover,
168
+ a.footer-link:active {
169
+ text-decoration: underline;
170
+ }
171
+ img.footer-icon {
172
+ width: 2.8rem;
173
+ height: 2.8rem;
174
+ display: inline-block;
175
+ padding-right: 0.8rem;
176
+ }
177
+ img.footer-icon:first-of-type {
178
+ padding-left: 0;
179
+ }
180
+ /*** Footer - END */
181
+
182
+ @media only screen and (max-width: 1100px) {
183
+ article {
184
+ color: $text-dark;
185
+ padding: 5rem;
186
+ }
187
+ }
@@ -0,0 +1,242 @@
1
+ /*** General - START */
2
+ html {
3
+ scroll-behavior: smooth;
4
+ font-size: 62.5%;
5
+ margin: 0;
6
+ }
7
+ * {
8
+ font-family: $main-font;
9
+ line-height: 1.6em;
10
+ text-align: left;
11
+ color: $text-dark;
12
+ font-size: 1.6rem;
13
+ }
14
+ .print {
15
+ display: none;
16
+ }
17
+ /*** General - END */
18
+
19
+ /*** Body - START */
20
+ body {
21
+ margin: 0;
22
+ min-width: 375px;
23
+ display:flex;
24
+ flex-direction:column;
25
+ height:100vh;
26
+ min-height: -webkit-fill-available;
27
+ background-color: $background-light;
28
+ }
29
+
30
+ main#page-content {
31
+ margin: 0;
32
+ }
33
+
34
+ article {
35
+ color: $text-dark;
36
+ padding: 5rem 5rem;
37
+ }
38
+
39
+ article + article {
40
+ border-top: 0.5rem dotted $background-middle;
41
+ }
42
+ /*** Body - END */
43
+
44
+ /*** Header - START */
45
+ header#site-header {
46
+ position: relative;
47
+ top: 0;
48
+ left: 0;
49
+ right: 0;
50
+ padding: 2.5rem 4.2rem $margin 4.2rem;
51
+ display: flex;
52
+ flex-direction: row;
53
+ flex-wrap: nowrap;
54
+ align-items: flex-start;
55
+ justify-content: space-between;
56
+ background-color: $primary-color;
57
+ min-height: fit-content;
58
+ }
59
+
60
+ /* Logo */
61
+ div#site-logo-container {
62
+ display: flex;
63
+ justify-items: flex-start;
64
+ overflow: hidden;
65
+ margin: 0 5rem 0 0;
66
+ flex-grow: 0;
67
+ flex-shrink: 0;
68
+ min-height: 10rem;
69
+ }
70
+ a#site-logo {
71
+ font-size: 10rem;
72
+ font-weight: normal;
73
+ color: $text-light;
74
+ text-decoration: none;
75
+ line-height: 0.9em;
76
+ overflow: hidden;
77
+ font-family: $logo-font;
78
+ margin-left: -0.035em;
79
+ padding: 0 0.8rem;
80
+ }
81
+
82
+ /* Navigation */
83
+ nav#site-nav {
84
+ display: flexbox;
85
+ justify-content: flex-end;
86
+ margin: 0;
87
+ }
88
+ div#site-nav-page {
89
+ margin: 0 0 1rem 0;
90
+ }
91
+ div#site-nav-section {
92
+ margin: 0;
93
+ }
94
+
95
+ /* Navigation links */
96
+ div#toc-pages ul {
97
+ margin: 0;
98
+ padding: 0;
99
+ display: flex;
100
+ justify-content: flex-end;
101
+ flex-wrap: wrap;
102
+ }
103
+ div#toc-sections ul {
104
+ margin: 0;
105
+ padding: 0;
106
+ display: flex;
107
+ justify-content: flex-end;
108
+ flex-wrap: wrap;
109
+ }
110
+ div#toc-pages li {
111
+ padding: 0 0.8rem;
112
+ list-style: none;
113
+ }
114
+ div#toc-sections li {
115
+ padding: 0 0.8rem;
116
+ list-style: none;
117
+ }
118
+
119
+ #toc-pages a.nav-link {
120
+ font-weight: bold;
121
+ font-size: 2.2rem;
122
+ }
123
+ #toc-sections a.nav-link {
124
+ font-size: 1.6rem;
125
+ }
126
+ a.nav-link {
127
+ color: $text-light;
128
+ text-decoration: none;
129
+ text-transform: lowercase;
130
+ }
131
+ a.nav-link:hover,
132
+ a.nav-link:active,
133
+ a.nav-link:focus {
134
+ text-decoration: underline;
135
+ }
136
+ /*** Header - END */
137
+
138
+ /*** Footer - START */
139
+ footer#site-footer {
140
+ margin-top: auto;
141
+ position: relative;
142
+ bottom: 0;
143
+ background-color: $primary-color;
144
+ color: $text-light;
145
+ display: flex;
146
+ justify-content: space-between;
147
+ flex-direction: row-reverse;
148
+ align-items: center;
149
+ flex-wrap: wrap;
150
+ padding: 1rem 5rem;
151
+ min-height: fit-content;
152
+ }
153
+ div.footer-column {
154
+ color: $text-light;
155
+ font-weight: normal;
156
+ font-size: 1.4rem;
157
+ text-decoration: none;
158
+ padding: 0.5rem 0;
159
+ }
160
+
161
+ div.footer-column.footer-contact {
162
+ padding-left: 2.5rem;
163
+ display: flex;
164
+ flex-wrap: wrap;
165
+ }
166
+
167
+ a.footer-link {
168
+ color: $text-light;
169
+ font-weight: bold;
170
+ font-size: 1.4rem;
171
+ text-decoration: none;
172
+ }
173
+ a.footer-link:hover,
174
+ a.footer-link:active {
175
+ text-decoration: underline;
176
+ }
177
+
178
+ a.footer-image-link {
179
+ display: flex;
180
+ }
181
+
182
+ img.footer-icon {
183
+ width: 2.8rem;
184
+ height: 2.8rem;
185
+ padding-left: 0.8rem;
186
+ }
187
+ /*** Footer - END */
188
+
189
+ /*** Tall screens - START */
190
+ @media only screen and (max-width: 680px) {
191
+ header#site-header {
192
+ display: flexbox;
193
+ flex-direction: column;
194
+ }
195
+ div#site-logo-container {
196
+ float: none;
197
+ margin: 0;
198
+ width: 100%;
199
+ min-height: 2.8rem;
200
+ display: flex;
201
+ justify-content: center;
202
+ }
203
+ a#site-logo {
204
+ font-size: 6.2rem;
205
+ line-height: 0.9em;
206
+ overflow: hidden;
207
+ }
208
+ nav#site-nav {
209
+ width: 100%;
210
+ }
211
+ div#toc-pages ul {
212
+ display: flex;
213
+ justify-content: center;
214
+ }
215
+ div#toc-sections ul {
216
+ display: flex;
217
+ justify-content: center;
218
+ }
219
+ #toc-pages a.nav-link {
220
+ font-weight: bold;
221
+ font-size: 2.2rem;
222
+ }
223
+ #toc-sections a.nav-link {
224
+ font-size: 1.6rem;
225
+ }
226
+ }
227
+
228
+ /* iPhone 10-ish */
229
+ @media only screen and (max-width: 450px) {
230
+ html {
231
+ font-size: 50%;
232
+ }
233
+
234
+ article,
235
+ footer#site-footer {
236
+ padding: 2.5rem 2.5rem;
237
+ }
238
+ header#site-header {
239
+ padding: 2.5rem 1.7rem $margin 1.7rem;
240
+ }
241
+ }
242
+ /*** Tall screens - END */