simply-cyan 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA256:
3
+ metadata.gz: ebb57ac84eb48cfd7a87b2e62c9c76e2527a4b6996f60ada598f23e731f82867
4
+ data.tar.gz: 0c7253bde113bd62a8a50e4d7fa6f709e29b65d226b0dfbcd620082608ae1e30
5
+ SHA512:
6
+ metadata.gz: 192fd37862cd95df768e1ab0bc4e0b2b812eb5404a14a4a3f85da46c32f23cb5342c92283880574459036f45bb26291a7a691bd5c7c50a282ef4383135abdb17
7
+ data.tar.gz: a7e5fa509dada40e3f4e477826a2dd6e43cd083915dc3537deaa18f98fdf2c229e07254861d3eb4a237260b86cea0ee13064e71320402ad354a729ab75a568b2
data/LICENSE.txt ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2022
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,98 @@
1
+ # simply-cyan
2
+
3
+ Simply Cyan is a Jekyll theme dedicated to text and reading. This theme focuses on readability and clarity.
4
+
5
+ You can visit the demo website of this theme [here](https://pquod.github.io/simply-cyan-demo/).
6
+
7
+ Three main functions are at work to facilitate the reader's experience : a classic dark/light mode, but also toggles to change the font size and get bigger characters or to change the font-style (by default meant to switch between serif and sans-serif fonts).
8
+
9
+ The design of Simply Cyan is sober and elegant, yet pop with its bright colorful oblique stripes punctuating the screen.
10
+
11
+ Symply Cyan can feature a multitude of authors and offers a page to display all of their profiles, as well as an archives page to display all the site's posts.
12
+
13
+
14
+ ## Installation
15
+
16
+ Add this line to your Jekyll site's `Gemfile` to add the theme as a dependancy:
17
+
18
+ ```ruby
19
+ gem "simply-cyan"
20
+ ```
21
+
22
+ Run `bundle install` in the root file of your project:
23
+
24
+ Add this line to your Jekyll site's `_config.yml` to set the theme:
25
+
26
+ ```yaml
27
+ theme: simply-cyan
28
+ ```
29
+
30
+ Run `bundle exec jekyll serve` to build and serve your site.
31
+
32
+ You can use the `config.yml` to update the configuration of your website and set things such as its title, description, navigation links and a lot more
33
+
34
+ ## Usage
35
+
36
+ ### Customizing styles
37
+
38
+ You can customize many style parameters of the Simply Cyan theme by changing the different variables in the `settings.scss` file of the project (`_sass/_settings.scss`). You'll find there such parameters as the colors of the dark and white modes, fonts, line height, font sizes etc.
39
+
40
+ You can also overwrite the complete theme with your own custom file by matching its filename and path.
41
+
42
+ ### Accessing site parameters
43
+
44
+ Several parameters are also accessible in the `config.yml` file. For example, you can choose there whether to display or not the different reading functions (dark mode, big fonts etc.) of the site.
45
+
46
+ ### Creating a post
47
+
48
+ You are now ready to add content to your new jekyll site. You can do so by adding new posts in the `_posts` folder. Be sure your new post begins with the same front matter lines than the ones in the example posts (check [Jekyll documentation](https://jekyllrb.com/docs/posts/) in case you're not sure how to make your first post):
49
+
50
+ ```
51
+ ---
52
+ layout: post
53
+ title: "Example Post"
54
+ date: 2022-11-15
55
+ author:
56
+ - "Someone"
57
+ - "Someone else"
58
+ ---
59
+ ```
60
+
61
+ ### Managing different authors
62
+
63
+ Note that if you want to have all of the authors of your site displayed on the authors page, you'll have to create a new file for each of them in the `_categories` folder. The title of this new file must match the way you wrote the author's name in the category line of the post's front matter.
64
+
65
+ You can add a description or bio to each author's page in its respective file in `_categories`.
66
+
67
+ Of course, this folder and the category files can be used to display other things than authors. You just have to change the title of the `categories.md` page in order to display your posts grouped by any category you choose.
68
+
69
+ ### Homepage
70
+
71
+ By default, the homepage displays the ten newest posts. This number can be changed in the `config.yml` file.
72
+
73
+ ### Archives
74
+
75
+ The archives page displays the integrality of the posts published on your site.
76
+
77
+ ## Contributing
78
+
79
+ Bug reports and pull requests are welcome on GitHub at https://github.com/pquod/simply-cyan. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
80
+
81
+ If you have any idea about improving this theme or if you find any lack in its documentation, feel free to write at l.desaubliaux@gmail.com, I'd be happy to keep on making this theme better and better for your use!
82
+
83
+ ## Development
84
+
85
+ To set up your environment to develop this theme, run `bundle install`.
86
+
87
+ Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
88
+
89
+ When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
90
+ To add a custom directory to your theme-gem, please edit the regexp in `simply-cyan.gemspec` accordingly.
91
+
92
+ ## License
93
+
94
+ The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
95
+
96
+ ## Credits
97
+
98
+ Thanks a lots to Quentin, Candice and Robinson, the people behind the conception of the original Internet Exploreur website who helped me a lot designing it.
@@ -0,0 +1,4 @@
1
+ <footer>
2
+ {{ site.copyright }}
3
+ </footer>
4
+ </div>
@@ -0,0 +1,4 @@
1
+ <input class="dark-mode-checkbox sr-only" id="dark-mode" type="checkbox">
2
+ <input class="typo-plus-checkbox sr-only" id="typo-plus" type="checkbox">
3
+ <input class="typo-dys-checkbox sr-only" id="typo-dys" type="checkbox">
4
+ <div class="theme-container grow">
@@ -0,0 +1,31 @@
1
+ <script>
2
+ document.addEventListener('DOMContentLoaded', function () {
3
+ const checkbox = document.querySelector('.dark-mode-checkbox');
4
+
5
+ checkbox.checked = localStorage.getItem('darkMode') === 'true';
6
+
7
+ checkbox.addEventListener('change', function (event) {
8
+ localStorage.setItem('darkMode', event.currentTarget.checked);
9
+ });
10
+ });
11
+
12
+ document.addEventListener('DOMContentLoaded', function () {
13
+ const checkbox = document.querySelector('.typo-plus-checkbox');
14
+
15
+ checkbox.checked = localStorage.getItem('typoPlus') === 'true';
16
+
17
+ checkbox.addEventListener('change', function (event) {
18
+ localStorage.setItem('typoPlus', event.currentTarget.checked);
19
+ });
20
+ });
21
+
22
+ document.addEventListener('DOMContentLoaded', function () {
23
+ const checkbox = document.querySelector('.typo-dys-checkbox');
24
+
25
+ checkbox.checked = localStorage.getItem('typoDys') === 'true';
26
+
27
+ checkbox.addEventListener('change', function (event) {
28
+ localStorage.setItem('typoDys', event.currentTarget.checked);
29
+ });
30
+ });
31
+ </script>
@@ -0,0 +1,9 @@
1
+ <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
2
+ <script>
3
+ window['ga-disable-{{ site.google_analytics }}'] = window.doNotTrack === "1" || navigator.doNotTrack === "1" || navigator.doNotTrack === "yes" || navigator.msDoNotTrack === "1";
4
+ window.dataLayer = window.dataLayer || [];
5
+ function gtag(){dataLayer.push(arguments);}
6
+ gtag('js', new Date());
7
+
8
+ gtag('config', '{{ site.google_analytics }}');
9
+ </script>
@@ -0,0 +1,15 @@
1
+ <!DOCTYPE html>
2
+ <html lang="{{page.lang | default: site.lang | default: "en"}}">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width-device-width, intial-scale=1">
6
+ {% if page.indexing == false %}
7
+ <meta name="robots" content="noindex">
8
+ {% endif %}
9
+ <title>{{ site.title }}</title>
10
+ <meta name="description" content="{{ site.description }}">
11
+ <link rel="stylesheet" href="{{ "/assets/styles.css" | relative_url }}">
12
+ {%- if jekyll.environment == 'production' and site.google_analytics -%}
13
+ {%- include google-analytics.html -%}
14
+ {%- endif -%}
15
+ </head>
@@ -0,0 +1,25 @@
1
+ <header>
2
+ <div class="site_title" role="heading" aria-level="1">
3
+ <a href="{{ '/' | relative_url }}" class="site-title">
4
+ {{ site.title | escape }}
5
+ </a>
6
+ </div>
7
+ <nav>
8
+ {% assign pages = site.pages %}
9
+ {% for page in pages %}
10
+ {% if page.nav_header == true %}
11
+ <a href="{{ page.url | relative_url }}" class="pages_links">
12
+ <span class="pages_names">{{ page.title | escape }}</span>
13
+ </a>
14
+ {% endif %}
15
+ {% endfor %}
16
+ </nav>
17
+ <div class="site_functions">
18
+ {% if site.darkmode == true %}
19
+ <label class="dark-mode-label" aria-label="Night Mode" for="dark-mode"></label>
20
+ {% endif %}
21
+ {% if site.typosize == true %}
22
+ <label class="typo-plus-label" aria-label="Change font size" for="typo-plus"></label>
23
+ {% endif %}
24
+ </div>
25
+ </header>
@@ -0,0 +1,21 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+ <article>
5
+ <h1 class="custom-pages-title">All the articles</h1>
6
+ <table class="archives-table">
7
+ {% for post in site.posts %}
8
+ <tr>
9
+ <td>
10
+ <a href="{{ post.url | relative_url}}">
11
+ <h2 class="list_post_title"><span class="a-nude">{{ post.title | truncate: 30 | escape }}</span></h2>
12
+ </a>
13
+ </td>
14
+ <td class="archives-date">
15
+ <h2 class="list_post_title">&#10040; {{ post.date | date: "%d/%m/%Y" | escape }}</h2>
16
+ </td>
17
+ </tr>
18
+ {% endfor %}
19
+ </table>
20
+ <div class="line"></div>
21
+ </article>
@@ -0,0 +1,16 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+ <article>
5
+ <h1 class="custom-pages-title">All the authors</h1>
6
+ <div class="authors-list">
7
+ {% assign sorted_authors = site.categories | sort %}
8
+ {% for author in sorted_authors %}
9
+ <a href="{{ author.url | relative_url }}">
10
+ <h2 class="list_post_title">
11
+ <span class="a-nude"><span class="desktop-star">&#10040;</span> {{ author.title }} <span class="desktop-star">&#10040;</span></span>
12
+ </h2>
13
+ </a>
14
+ {% endfor %}
15
+ </div>
16
+ </article>
@@ -0,0 +1,28 @@
1
+ ---
2
+ layout: page
3
+ ---
4
+
5
+ {{ content }}
6
+ {% assign biocontent = page.content | strip_newlines %}
7
+ {% unless biocontent == '' %}
8
+ <h2>Posts by {{page.title}}</h2>
9
+ {% endunless %}
10
+ <table class="archives-table">
11
+ {% for post in site.posts %}
12
+ {% assign author_list = post.categories %}
13
+ {% for author in author_list %}
14
+ {% if author == page.title %}
15
+ <tr>
16
+ <td>
17
+ <a href="{{ post.url | relative_url}}">
18
+ <p><span class="a-nude">{{ post.title | truncate: 30 | escape }}</span></p>
19
+ </a>
20
+ </td>
21
+ <td class="archives-date">
22
+ <p class="list_post_title">&#10040; {{ post.date | date: "%d/%m/%Y" | escape }}</p>
23
+ </td>
24
+ </tr>
25
+ {% endif %}
26
+ {% endfor %}
27
+ {% endfor %}
28
+ </table>
@@ -0,0 +1,14 @@
1
+
2
+ {%- include head.html -%}
3
+ <body>
4
+ {%- include functions.html -%}
5
+ {%- include header.html -%}
6
+ <main class="page_content" aria-label="Content">
7
+
8
+ {{ content | markdownify }}
9
+
10
+ </main>
11
+ {%- include footer.html -%}
12
+ {%- include functionsscript.html -%}
13
+ </body>
14
+ </html>
@@ -0,0 +1,19 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+ <article>
5
+ {% assign posts = site.posts %}
6
+ {% assign posts_limit = site.home-posts-limit %}
7
+ {% if posts.size > 0 %}
8
+ <div class="apercu-post" role="list">
9
+ {% for post in posts limit: posts_limit %}
10
+ <a href="{{ post.url | relative_url }}" role="listitem">
11
+ <h1 class="list_post_title"><span class="a-nude">{{ post.title | escape }}</span></h1>
12
+ </a>
13
+ {% assign authors = post.category | join: ", " %}
14
+ <h2 class="list_post_info">{{ authors }} ✷ {{ post.date | date_to_long_string }}</h2>
15
+ <div class="line"></div>
16
+ {% endfor %}
17
+ </div>
18
+ {% endif %}
19
+ </article>
@@ -0,0 +1,14 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+ <article>
5
+ <h1>{{ page.title }}</h1>
6
+ {% assign biocontent = page.content | strip_newlines %}
7
+ {% unless page.collection == "categories" and biocontent == '' %}
8
+ <div class="page-typo-type">
9
+ <label class="typo-dys-label" aria-label="typo sans-serif" for="typo-dys"></label>
10
+ </div>
11
+ {% endunless %}
12
+ {{ content }}
13
+ <div class="line"></div>
14
+ </article>
@@ -0,0 +1,13 @@
1
+ ---
2
+ layout: page
3
+ ---
4
+
5
+ {{ content }}
6
+ {% assign authors = page.category %}
7
+ <div class="post_footer">
8
+ <h2 class="list_post_info">
9
+ {% for author in authors %}
10
+ <a href="{{ site.baseurl }}/categories/{{ author | slugify }}">{{ author }}</a> ✷
11
+ {% endfor %} {{ page.date | date_to_long_string }}
12
+ </h2>
13
+ </div>
@@ -0,0 +1,104 @@
1
+ @import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap");
2
+ @import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap");
3
+
4
+ :root {
5
+ // Variable for the light mode
6
+ --bg-color: #f2f2f2; // Background color
7
+ --font-serif: "Libre Baskerville", serif; // Serif font
8
+ --font-sansserif: "Montserrat", sans-serif; // Sans-Serif font
9
+ --font-color: #333333; // Font color
10
+ --font-size: 22px; // Font size
11
+ --text-width: 35em; // Width of the area where the content of the pages and posts are displayed
12
+ --text-font: var(--font-serif); // Default font for the text
13
+ --line-height: calc(var(--font-size) * 2); // Line height
14
+ --custom-color: cyan; // Complementary color, for the lines and underlinings
15
+ --lines: linear-gradient(
16
+ to top,
17
+ var(--custom-color) 50%,
18
+ rgba(255, 255, 255, 0) 50%
19
+ ); // Lines
20
+ --quote-color: #e7e8ea; // Background-color for quotes
21
+ --dark-mode-label: "DARK MODE"; // Label displayed in the header to toggle dark mode
22
+ --light-mode-label: "LIGHT MODE"; // Label displayed in the header to toggle light mode
23
+ --typo-plus-label: "A+"; // Label displayed in the header to enlarge the font size
24
+ --typo-moins-label: "A-"; // Label displayed in the header to reduce the font size
25
+ --sans-serif-label: " SANS-SERIF FONT"; // Label displayed at the top of posts to change the font-style to sans-serif
26
+ --serif-label: "SERIF FONT"; // Label displayed at the top of posts to change the font-style to serif
27
+ }
28
+
29
+ /* Dark-mode styles */
30
+ #dark-mode:checked,
31
+ #dark-mode:checked ~ .theme-container {
32
+ --bg-color: #333; // Background color
33
+ --font-color: #eee; // Font color
34
+ --custom-color: #ef1a63; // Complementary color, for the lines and underlinings
35
+ --lines: linear-gradient(
36
+ to top,
37
+ var(--custom-color) 50%,
38
+ rgba(255, 255, 255, 0) 50%
39
+ ); // Lines
40
+ --quote-color: #333642; // Background-color for quotes
41
+ }
42
+
43
+ .dark-mode-label::before {
44
+ content: var(
45
+ --dark-mode-label
46
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
47
+ }
48
+
49
+ .dark-mode-checkbox:checked ~ .theme-container .dark-mode-label::before {
50
+ content: var(
51
+ --light-mode-label
52
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
53
+ }
54
+
55
+ /* Large font mode styles */
56
+ #typo-plus:checked,
57
+ #typo-plus:checked ~ .theme-container {
58
+ --font-size: 30px; // Font-size when large fonts are toggled
59
+ --line-height: 35px; // Line height when large fonts are toggled
60
+ --text-width: 60em; // Width of the area where the content of the pages and posts are displayed
61
+ .site_title {
62
+ font-size: calc(var(--font-size) * 3);
63
+ line-height: calc(var(--line-height) * 3);
64
+ }
65
+ .site_functions {
66
+ margin-top: 20px;
67
+ }
68
+ }
69
+
70
+ .typo-plus-label::before {
71
+ content: var(
72
+ --typo-plus-label
73
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
74
+ }
75
+
76
+ .typo-plus-checkbox:checked ~ .theme-container .typo-plus-label::before {
77
+ content: var(
78
+ --typo-moins-label
79
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
80
+ }
81
+
82
+ /* Typo-dys */
83
+ .typo-dys-label::before {
84
+ content: var(
85
+ --sans-serif-label
86
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
87
+ font-size: calc(
88
+ var(--font-size) / 1.5
89
+ ); // Size font of the displayed text to switch between serif and sans-serif
90
+ font-family: var(--font-sansserif);
91
+ }
92
+
93
+ .typo-dys-checkbox:checked ~ .theme-container .typo-dys-label::before {
94
+ content: var(
95
+ --serif-label
96
+ ); // If you want to change the displayed text to change mode, change it in the :root section of this file
97
+ font-family: var(--font-serif);
98
+ }
99
+
100
+ #typo-dys:checked,
101
+ #typo-dys:checked ~ .theme-container {
102
+ --text-font: var(--font-sansserif);
103
+ }
104
+
data/_sass/_theme.scss ADDED
@@ -0,0 +1,324 @@
1
+ * {
2
+ margin: 0;
3
+ padding: 0;
4
+ }
5
+
6
+ .theme-container {
7
+ background-color: var(--bg-color);
8
+ color: var(--font-color);
9
+ font-family: var(--text-font);
10
+ }
11
+
12
+ .sr-only {
13
+ position: absolute;
14
+ overflow: hidden;
15
+ clip: rect(0 0 0 0);
16
+ width: 1px;
17
+ height: 1px;
18
+ margin: -1px;
19
+ padding: 0;
20
+ border: 0;
21
+ white-space: nowrap;
22
+ }
23
+
24
+ html {
25
+ height: 100%;
26
+ }
27
+
28
+ body {
29
+ height: 100%;
30
+ display: flex;
31
+ flex-direction: column;
32
+ font-size: var(--font-size);
33
+ line-height: var(--line-height);
34
+ background-color: var(--bg-color);
35
+ color: var(--font-color);
36
+ }
37
+
38
+ .grow {
39
+ flex-grow: 1;
40
+ }
41
+
42
+ h1,
43
+ h2,
44
+ h3,
45
+ h4,
46
+ h5,
47
+ h6 {
48
+ font-family: var(--font-sansserif);
49
+ }
50
+
51
+ h1 {
52
+ font-size: calc(var(--font-size) * 1.7);
53
+ }
54
+
55
+ h2 {
56
+ font-size: calc(var(--font-size) * 1.3);
57
+ }
58
+
59
+ a {
60
+ color: var(--font-color);
61
+ text-decoration: none;
62
+ }
63
+
64
+ .a-nude {
65
+ background-size: 0% 100%;
66
+ transition: background-size 0.5s 0s;
67
+ &:hover {
68
+ background: var(--lines);
69
+ background-repeat: no-repeat;
70
+ background-size: 100% 100%;
71
+ }
72
+ }
73
+
74
+ p, li {
75
+ font-size: var(--font-size);
76
+ margin-bottom: var(--line-height);
77
+ }
78
+
79
+ hr {
80
+ margin-bottom: var(--line-height);
81
+ border: 3px solid var(--custom-color);
82
+ }
83
+
84
+ tr {
85
+ line-height: calc(var(--line-height)/3);
86
+ }
87
+
88
+ blockquote {
89
+ margin-right: 25px;
90
+ margin-left: 25px;
91
+ margin-bottom: var(--line-height);
92
+ border-width: 2px;
93
+ background: var(--quote-color);
94
+ padding: 10px 10px 1px 20px;
95
+ border-left-width: 5px;
96
+ border-left-style: solid;
97
+ border-left-color: var(--custom-color);
98
+ quotes: "“" "”" "‘" "’";
99
+ }
100
+
101
+ q {
102
+ quotes: "‘" "’" "“" "”";
103
+ }
104
+
105
+ code{
106
+ background: var(--quote-color);
107
+ }
108
+
109
+ .footnotes::before {
110
+ content: "---";
111
+ }
112
+
113
+ .footnotes li {
114
+ counter-increment: my-counter;
115
+ margin-bottom: var(--line-height);
116
+ }
117
+
118
+ .footnotes li::before {
119
+ content: counter(my-counter) ". ";
120
+ font-weight: bold;
121
+ }
122
+
123
+ .footnotes p {
124
+ display: inline;
125
+ }
126
+
127
+ label {
128
+ cursor: pointer;
129
+ font-weight: bold;
130
+ font-size: var(--font-size);
131
+ background: var(--lines);
132
+ background-repeat: no-repeat;
133
+ background-size: 100% 100%;
134
+ transition: background-size 0.5s 0s;
135
+ margin-right: 20px;
136
+ padding-bottom: 2px;
137
+ }
138
+
139
+ label:hover {
140
+ background-size: 0% 100%;
141
+ }
142
+
143
+ /** HEADER **/
144
+ header {
145
+ font-family: var(--font-sansserif);
146
+ text-transform: uppercase;
147
+ margin: 30px;
148
+ line-height: calc(var(--line-height) / 1.5);
149
+ }
150
+
151
+ .site_title {
152
+ text-transform: uppercase;
153
+ display: inline-block;
154
+ font-size: calc(var(--font-size) * 2.5);
155
+ padding-bottom: 5px;
156
+ font-weight: bold;
157
+ background: none;
158
+ }
159
+
160
+ .pages_links {
161
+ display: inline-block;
162
+ font-size: calc(var(--font-size) * 1.5);
163
+ padding-right: 20px;
164
+ font-weight: bold;
165
+ }
166
+
167
+ .pages_names {
168
+ background: var(--lines);
169
+ background-repeat: no-repeat;
170
+ background-size: 100% 100%;
171
+ transition: background-size 0.5s 0s;
172
+ padding-bottom: 5px;
173
+ &:hover {
174
+ background-size: 0% 100%;
175
+ }
176
+ }
177
+
178
+ .site_functions {
179
+ margin-top: 10px;
180
+ }
181
+
182
+ /** MAIN **/
183
+ main {
184
+ padding: 30px;
185
+ min-height: 55%;
186
+ a {
187
+ background: var(--lines);
188
+ background-repeat: no-repeat;
189
+ background-size: 100% 100%;
190
+ transition: background-size 0.5s 0s;
191
+ &:hover {
192
+ background-size: 0% 100%;
193
+ }
194
+ }
195
+ }
196
+
197
+ .line {
198
+ height: 30px;
199
+ border-bottom: 10px solid var(--custom-color);
200
+ transform: rotate(2deg);
201
+ position: relative;
202
+ top: var(--line-height);
203
+ margin-bottom: calc(var(--line-height) * 3);
204
+ }
205
+
206
+ /** HOME **/
207
+ .list_post_title,
208
+ .list_post_info {
209
+ font-weight: normal;
210
+ }
211
+
212
+ .list_post_info {
213
+ font-size: 22px;
214
+ }
215
+
216
+ /** PAGES **/
217
+ article {
218
+ max-width: var(--text-width);
219
+ margin: auto;
220
+ margin-top: calc(var(--line-height) * 3);
221
+ margin-bottom: calc(var(--line-height) * 3);
222
+
223
+ }
224
+
225
+ article h1,h2,h3,h4,h5,h6{
226
+ margin-bottom: var(--line-height);
227
+ }
228
+
229
+ .page-typo-type {
230
+ margin-bottom: var(--line-height);
231
+ text-align: right;
232
+ }
233
+
234
+ .post_footer {
235
+ text-align:right;
236
+ }
237
+
238
+ /** CUSTOM-PAGES (archives & authors) **/
239
+ .custom-pages-title {
240
+ margin-bottom: calc(var(--line-height) * 2);
241
+ }
242
+
243
+ .archives-table {
244
+ width: 100%;
245
+ }
246
+
247
+ .archives-date {
248
+ text-align: right;
249
+ }
250
+
251
+ .authors-list {
252
+ text-align: center;
253
+ }
254
+
255
+ .author-archives {
256
+ margin-top: var(--line-height);
257
+ }
258
+
259
+
260
+ /** FOOTER **/
261
+ footer {
262
+ font-size: calc(var(--font-size) / 2);
263
+ text-align: center;
264
+ width: 100%;
265
+ background: var(--bg-color);
266
+ font-family: var(--font-sansserif);
267
+ }
268
+
269
+
270
+ /* Variables for responsive layouts */
271
+ @media screen and (max-width: 801px)
272
+ {
273
+ :root{
274
+ line-height: calc(var(--font-size)*1.5);
275
+ }
276
+
277
+ .site_title{
278
+ margin-bottom:calc(var(--line-height)*0.5);
279
+ }
280
+
281
+ .site_title, .list_post_title{
282
+ font-size:calc(var(--font-size)*1.5);
283
+ }
284
+
285
+ .pages_links{
286
+ font-size:var(--font-size);
287
+ }
288
+
289
+ label{
290
+ font-size: calc(var(--font-size)*0.8);
291
+ }
292
+
293
+ .typo-plus-label{
294
+ display:none;
295
+ }
296
+
297
+ article{
298
+ margin-top: var(--line-height);
299
+ margin-bottom: var(--line-height);
300
+ }
301
+
302
+ .list_post_info{
303
+ margin-bottom: 0;
304
+ }
305
+
306
+ }
307
+
308
+ @media screen and (max-width: 600px) {
309
+ tr {
310
+ line-height: var(--line-height);
311
+ }
312
+
313
+ .archives-date{
314
+ display:none;
315
+ }
316
+
317
+ .authors-list{
318
+ text-align:left;
319
+ }
320
+
321
+ .desktop-star{
322
+ display:none;
323
+ }
324
+ }
@@ -0,0 +1,7 @@
1
+
2
+ @charset "utf-8";
3
+
4
+ @import
5
+ "settings", // Defines elements variables
6
+ "theme" // Defines structure and style based on CSS selectors
7
+ ;
@@ -0,0 +1,6 @@
1
+ ---
2
+ title: false
3
+ styles: true
4
+ ---
5
+
6
+ @import "simply-cyan";
metadata ADDED
@@ -0,0 +1,106 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: simply-cyan
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.1.0
5
+ platform: ruby
6
+ authors:
7
+ - P_Quod
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2023-01-12 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: jekyll
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '4.0'
20
+ type: :runtime
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '4.0'
27
+ - !ruby/object:Gem::Dependency
28
+ name: bundler
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '1.16'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '1.16'
41
+ - !ruby/object:Gem::Dependency
42
+ name: rake
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: '12.0'
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: '12.0'
55
+ description:
56
+ email:
57
+ - l.desaubliaux@gmail.com
58
+ executables: []
59
+ extensions: []
60
+ extra_rdoc_files: []
61
+ files:
62
+ - LICENSE.txt
63
+ - README.md
64
+ - _includes/footer.html
65
+ - _includes/functions.html
66
+ - _includes/functionsscript.html
67
+ - _includes/google-analytics.html
68
+ - _includes/head.html
69
+ - _includes/header.html
70
+ - _layouts/archives.html
71
+ - _layouts/categories.html
72
+ - _layouts/category_single.html
73
+ - _layouts/default.html
74
+ - _layouts/home.html
75
+ - _layouts/page.html
76
+ - _layouts/post.html
77
+ - _sass/_settings.scss
78
+ - _sass/_theme.scss
79
+ - _sass/simply-cyan.scss
80
+ - assets/styles.scss
81
+ homepage: https://pquod.github.io/simply-cyan-demo/
82
+ licenses:
83
+ - MIT
84
+ metadata: {}
85
+ post_install_message:
86
+ rdoc_options: []
87
+ require_paths:
88
+ - lib
89
+ required_ruby_version: !ruby/object:Gem::Requirement
90
+ requirements:
91
+ - - ">="
92
+ - !ruby/object:Gem::Version
93
+ version: '0'
94
+ required_rubygems_version: !ruby/object:Gem::Requirement
95
+ requirements:
96
+ - - ">="
97
+ - !ruby/object:Gem::Version
98
+ version: '0'
99
+ requirements: []
100
+ rubygems_version: 3.1.6
101
+ signing_key:
102
+ specification_version: 4
103
+ summary: Simply-cyan is a clear and elegant theme dedicated to text-based websites.
104
+ It contains an archives functionality and can handle multiple authors. The theme
105
+ also has a dark/light mode.
106
+ test_files: []