jekyll-theme-hamilton 1.1.0 → 1.4.2

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: 7788201a88e6630d8f6fed6bccd07815abe37e64aa1a38b6bb81d5c4fea14c7d
4
- data.tar.gz: 5805a10fdc9c4c214fc92c02952807ad2c17ad7d6559ba0cb089bcafecb70c75
3
+ metadata.gz: 810f864c28adffeb0585fd1f3f12a8b1eceea1dd3d929f68c0c8a8efead8154c
4
+ data.tar.gz: 8b04b2e0628cf79a39ceb42ff47133443bcd1e94814a07f8a88ce46cb1025cc8
5
5
  SHA512:
6
- metadata.gz: 987db308f125fe71e45cf4b23bd8bd5336edd9c3a4bfc9d60eac076e6bef3d52d66d47c9f5f388a9a54d2302b7447ee5ec0c3721825bcae9fedeba51881df28f
7
- data.tar.gz: fcd871006ab2bd9366186a138021bc2b9b0a111eb5fed581b2a81df9ccc3ab1d6b9e325ef5b8240c3b2534ce996d94ec373b0648b63503629a20b138fdc919bd
6
+ metadata.gz: b46e258e35418c30f9c1bd150c79d61942b3d28ba46926b6bfc8620b18b07a54bae29f9169ff738c35f3cba287af5764dc6827a9efe6c604dd0860175caf64c6
7
+ data.tar.gz: b3a96ad33db7e9cb3198474b48fe7b73451f4831fd37359910f15af9f452efe6519f3d9421ad6080dfa8f6b46ed0accf265249570e5a328936b309948fcc3cf9
data/README.md CHANGED
@@ -1,6 +1,8 @@
1
1
  # Hamilton <!-- omit in toc -->
2
2
 
3
- Another minimal style of Jekyll theme for writers. The original purpose of this theme is to be a replacement of the default Jekyll theme -- [Minima](https://github.com/jekyll/minima). Hamilton is an enhancement of Minima but still, keep in minimal.
3
+ A minimal and beautiful Jekyll theme best for writing and note-taking.
4
+
5
+ The original purpose of this theme is to be a replacement of the default Jekyll theme -- [Minima](https://github.com/jekyll/minima). Hamilton is an enhancement of Minima but still, keep in minimal.
4
6
 
5
7
  Please check out the [demo](https://ngzhio.github.io/jekyll-theme-hamilton/).
6
8
 
@@ -79,7 +81,9 @@ After installation, you can run `jekyll serve` to check out your site, but befor
79
81
 
80
82
  | Parameters | Types | Specifications |
81
83
  |:---------- |:----- |:-------------- |
82
- | `author` | string | The author name of the site; It would be showed in the copyright statement. |
84
+ | `author` | string | The name of the author of the site; It would be showed in the copyright statement. |
85
+ | `avatar` | string | The avatar of the author of the site. |
86
+ | `email` | string | The email of the author of the site. |
83
87
  | `skin` | string | The skin name. See more information on the [Customization](#customization) section. |
84
88
  | `lang` | string | The language of the site; The default value is `en`. |
85
89
  | `paginate` | int | The number of posts on each page. To enable pagination, you must use a third-party plugin, e.g. [`jekyll-paginate`](https://github.com/jekyll/jekyll-paginate), [`jekyll-paginate-v2`](https://github.com/sverrirs/jekyll-paginate-v2), or [`jekyll-pagination`](https://github.com/prometheus-ev/jekyll-pagination). |
@@ -135,7 +139,7 @@ You can also configure the width and height of the image,
135
139
 
136
140
  Besides, you can pass the `caption` parameter to the include, then it will wrap the `img` with a `figure` block; alternatively, you can pass the `alt` parameter to the include.
137
141
 
138
- If you feel that passing a long path to the image to the include is ugly and wasting time, you can replace the `src` parameter with the `name` parameter, which is just the name of the image, and by default, the path would be `assets/img/{{ page.title | slugify}}/{{ include.name }}`.
142
+ If you feel that passing a long path to the image to the include is ugly and wasting time, you can replace the `src` parameter with the `name` parameter, which is just the name of the image, and by default, the path would be `assets/img/posts/{{ page.title | slugify}}/{{ include.name }}`.
139
143
 
140
144
  ## Customization
141
145
 
@@ -156,6 +160,23 @@ You can create a file `_data/navigation.yml` to configure links to some pages. F
156
160
  url: /tags/
157
161
  ```
158
162
 
163
+ The navigation bar also supports dropdown submenus:
164
+
165
+ ```yml
166
+ - title: About
167
+ url: /about/
168
+ - title: Categories
169
+ url: /categories/
170
+ - title: Tags
171
+ url: /tags/
172
+ - title: More
173
+ sublinks:
174
+ - title: FAQ
175
+ url: /faq/
176
+ - title: Docs
177
+ url: /docs/
178
+ ```
179
+
159
180
  ### Social Media
160
181
 
161
182
  You can create a file `_data/social.yml` to configure links to your social media. For example,
@@ -1,54 +1,24 @@
1
- <footer id="footer" class="site-footer">
2
- <div class="wrapper">
3
- <div class="footer-col-wrapper">
4
-
5
- <div class="footer-col">
6
- <p class="feed-subscribe">
7
- <a href="{{ 'feed.xml' | relative_url }}">
8
- <i class="feed-icon fas fa-rss"></i><span>Subscribe</span>
9
- </a>
10
- </p>
11
- <ul class="contact-list">
12
- {%- if site.author -%}
13
- <li class="p-name">{{ site.author | escape }}</li>
14
- {%- endif -%}
15
- {%- if site.email -%}
16
- <li><a class="u-email" href="mailto:{{ site.email }}">{{ site.email }}</a></li>
17
- {%- endif -%}
18
- </ul>
19
- </div>
20
-
21
- <div class="footer-col">
22
- <div class="copyright">
23
- {% assign year_from = site.posts[-1].date | date: '%Y' %}
24
- {% assign year_to = site.time | date: '%Y' %}
25
- {% if year_from == nil or year_from == year_to %}
26
- {% assign year_string = year_from %}
27
- {% else %}
28
- {% assign year_string = year_from | append: '&nbsp;' | append: '-' | append: '&nbsp;' | append: year_to %}
29
- {% endif %}
30
- {% if site.author %}
31
- <p>© {{ year_string }} {{ site.author }}; All rights reserved</p>
32
- {% endif %}
33
- </div>
34
- <p>
35
- Powered by <a href="https://jekyllrb.com/">Jekyll</a> & <a href="https://github.com/ngzhio/jekyll-theme-hamilton">Hamilton</a>
36
- </p>
37
- </div>
38
-
39
- <div class="footer-col">
40
- <p>{{ site.description | escape }}</p>
41
- </div>
1
+ <div class="footer-col-wrapper">
42
2
 
3
+ <div class="footer-col">
4
+ <div class="copyright">
5
+ {% assign year_from = site.posts[-1].date | date: '%Y' %}
6
+ {% assign year_to = site.time | date: '%Y' %}
7
+ {% if year_from == nil or year_from == year_to %}
8
+ {% assign year_string = year_from %}
9
+ {% else %}
10
+ {% assign year_string = year_from | append: '&nbsp;' | append: '-' | append: '&nbsp;' | append: year_to %}
11
+ {% endif %}
12
+ {% if site.author %}
13
+ <p>Copyright © {{ year_string }} {{ site.author }}; All rights reserved.</p>
14
+ {% endif %}
43
15
  </div>
16
+ <p>
17
+ Powered by <a href="https://jekyllrb.com/">Jekyll</a> & <a href="https://github.com/ngzhio/jekyll-theme-hamilton">Hamilton</a>
18
+ </p>
19
+ </div>
44
20
 
45
- {% if site.data.social %}
46
- <div class="social-icons">
47
- {% for social in site.data.social %}
48
- <a class="social-icon" href="{{ social.url }}"><i class="{{ social.icon | default: 'fas fa-link' }} fa-2x" title="{{ social.title }}"></i></a>
49
- {% endfor %}
50
- </div>
51
- {% endif %}
21
+ <div class="footer-col">
22
+ <p>{{ site.description | escape }}</p>
52
23
  </div>
53
- </footer>
54
-
24
+ </div>
@@ -14,6 +14,14 @@
14
14
  {% include mathjax.html %}
15
15
  {% endif %}
16
16
 
17
+ <!-- Google Fonts -->
18
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
19
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open%20Sans">
20
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inconsolata">
21
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Dancing%20Script">
22
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto%20Sans%20SC">
23
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto%20Serif%20SC">
24
+
17
25
  <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
18
26
  <link rel="stylesheet" href="{{ '/assets/css/skin.css' | relative_url }}">
19
27
 
@@ -1,27 +1,54 @@
1
- <header class="site-header">
1
+ <div class="wrapper">
2
+ <script>
3
+ function clickSidebarButton() {
4
+ const elem = document.getElementById("site-sidebar")
5
+ if (elem.style.display == "none" || elem.style.display == "") {
6
+ elem.style.display = "block";
7
+ } else {
8
+ elem.style.display = "none";
9
+ }
10
+ }
11
+ </script>
12
+ <a class="site-sidebar-button" onclick="clickSidebarButton()">
13
+ {%- if site.avatar contains "://" -%}
14
+ {%- assign avatar = site.avatar -%}
15
+ {%- else -%}
16
+ {%- assign avatar = site.avatar | relative_url -%}
17
+ {%- endif -%}
18
+ <i class="far fa-user"></i>
19
+ </a>
2
20
 
3
- <div class="wrapper">
4
- <a class="site-title" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
21
+ <a class="site-title" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
5
22
 
6
- {% if site.data.navigation %}
7
- <nav class="site-nav">
8
- <input type="checkbox" id="nav-trigger" class="nav-trigger" />
9
- <label for="nav-trigger" title="nav-trigger">
10
- <span class="menu-icon">
11
- <svg viewBox="0 0 18 15" width="18px" height="15px">
12
- <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
13
- </svg>
14
- </span>
15
- </label>
23
+ {% if site.data.navigation %}
24
+ <nav class="site-nav">
25
+ <input type="checkbox" id="nav-trigger" class="nav-trigger" />
26
+ <label for="nav-trigger" title="nav-trigger">
27
+ <span class="menu-icon">
28
+ <svg viewBox="0 0 18 15" width="18px" height="15px">
29
+ <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
30
+ </svg>
31
+ </span>
32
+ </label>
16
33
 
17
- <div class="trigger">
18
- {% for nav in site.data.navigation %}
19
- {% if nav.title %}
20
- <a class="page-link {% if page.url == nav.url %}current-page{% endif %}" href="{{ nav.url | relative_url }}">{{ nav.title | escape }}</a>
34
+ <ul class="trigger">
35
+ {%- for nav in site.data.navigation -%}
36
+ {%- if nav.title -%}
37
+ {% if nav.sublinks %}
38
+ <li class="dropdown" href="#">
39
+ <a href="javascript:void(0)" class="dropbtn">{{ nav.title | escape }}</a>
40
+ <div class="dropdown-content">
41
+ {%- for link in nav.sublinks %}
42
+ <a class="{% if page.url == link.url %}current-page{% endif %}" href="{{ link.url | relative_url }}">{{ link.title | escape }}</a>
43
+ {%- endfor %}
44
+ </div>
45
+ </li>
46
+ {% else %}
47
+ <li><a class="{% if page.url == nav.url %}current-page{% endif %}" href="{{ nav.url | relative_url }}">{{ nav.title | escape }}</a></li>
21
48
  {% endif %}
22
- {% endfor %}
23
- </div>
24
- </nav>
25
- {% endif %}
26
- </div>
27
- </header>
49
+ {%- endif -%}
50
+ {%- endfor -%}
51
+ </ul>
52
+ </nav>
53
+ {% endif %}
54
+ </div>
@@ -3,7 +3,7 @@
3
3
  {%- if include.src -%}
4
4
  {% assign src = include.src %}
5
5
  {%- elsif include.name -%}
6
- {% capture src %}assets/img/{{ page.title | slugify }}/{{ include.name }}{% endcapture %}
6
+ {% capture src %}assets/img/posts/{{ page.title | slugify }}/{{ include.name }}{% endcapture %}
7
7
  {%- endif -%}
8
8
 
9
9
  {% if include.caption %}
@@ -0,0 +1,39 @@
1
+ {% if site.avatar -%}
2
+ <div class="sidebar-section">
3
+ {%- if site.avatar contains "://" -%}
4
+ {%- assign avatar = site.avatar -%}
5
+ {%- else -%}
6
+ {%- assign avatar = site.avatar | relative_url -%}
7
+ {%- endif -%}
8
+ <img src="{{ avatar }}" class="author-avatar u-photo align-center" alt="{{ site.author }}">
9
+ </div>
10
+ {%- endif %}
11
+
12
+ <div class="sidebar-section">
13
+ <ul class="contact-list">
14
+ {% if site.author -%}
15
+ <li class="p-name"><i class="sidebar-icon fas fa-at"></i><span>{{ site.author | escape }}</span></li>
16
+ {%- endif %}
17
+ {% if site.email -%}
18
+ <li><a class="u-email" href="mailto:{{ site.email }}"><i class="sidebar-icon fas fa-envelope"></i><span>{{ site.email }}</span></a></li>
19
+ {%- endif %}
20
+ </ul>
21
+ </div>
22
+
23
+ <div class="sidebar-section feed-subscribe">
24
+ <a href="{{ 'feed.xml' | relative_url }}">
25
+ <i class="sidebar-icon fas fa-rss"></i><span>Subscribe</span>
26
+ </a>
27
+ </div>
28
+
29
+ {% if site.data.social -%}
30
+ <div class="sidebar-section">
31
+ <ul class="social-icons">
32
+ {% for social in site.data.social -%}
33
+ <li>
34
+ <a class="social-icon" href="{{ social.url }}"><i class="{{ social.icon | default: 'fas fa-link' }} fa-2x" title="{{ social.title }}"></i></a>
35
+ </li>
36
+ {%- endfor %}
37
+ </ul>
38
+ </div>
39
+ {%- endif %}
@@ -6,15 +6,23 @@
6
6
  </head>
7
7
 
8
8
  <body>
9
-
10
- {% include header.html %}
11
-
12
- <main class="page-content" aria-label="Content">
13
- {{ content }}
14
- </main>
15
-
16
- {% include footer.html %}
17
-
9
+ <div class="site-container">
10
+ <header class="site-header">
11
+ {% include header.html %}
12
+ </header>
13
+
14
+ <div class="site-body wrapper">
15
+ <aside class="site-sidebar" id="site-sidebar">
16
+ {% include sidebar.html %}
17
+ </aside>
18
+ <main class="site-main" aria-label="Content">
19
+ {{ content }}
20
+ <footer class="site-footer">
21
+ {% include footer.html %}
22
+ </footer>
23
+ </main>
24
+ </div>
25
+ </div>
18
26
  </body>
19
27
 
20
28
  </html>
@@ -2,7 +2,7 @@
2
2
  layout: default
3
3
  ---
4
4
 
5
- <div class="home wrapper">
5
+ <div class="home">
6
6
 
7
7
  {{ content }}
8
8
 
@@ -5,15 +5,11 @@ layout: default
5
5
  <article class="post">
6
6
 
7
7
  <header class="post-header">
8
- <div class="wrapper">
9
- <h1 class="post-title">{{ page.title | escape }}</h1>
10
- </div>
8
+ <h1 class="post-title">{{ page.title | escape }}</h1>
11
9
  </header>
12
10
 
13
- <div class="wrapper">
14
- <div class="post-content">
15
- {{ content }}
16
- </div>
11
+ <div class="post-content">
12
+ {{ content }}
17
13
  </div>
18
14
 
19
15
  </article>
@@ -6,55 +6,48 @@ layout: default
6
6
 
7
7
  <header class="post-header">
8
8
 
9
- <div class="wrapper">
10
-
11
- <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1>
12
- <p class="post-meta">
13
- {%- assign date_format = site.date_format | default: "%b %-d, %Y" -%}
14
- <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
15
- {{ page.date | date: date_format }}
9
+ <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1>
10
+ <p class="post-meta">
11
+ {%- assign date_format = site.date_format | default: "%b %-d, %Y" -%}
12
+ <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
13
+ {{ page.date | date: date_format }}
14
+ </time>
15
+ {%- if page.modified_date -%}
16
+ ~
17
+ {%- assign mdate = page.modified_date | date_to_xmlschema -%}
18
+ <time class="dt-modified" datetime="{{ mdate }}" itemprop="dateModified">
19
+ {{ mdate | date: date_format }}
16
20
  </time>
17
- {%- if page.modified_date -%}
18
- ~
19
- {%- assign mdate = page.modified_date | date_to_xmlschema -%}
20
- <time class="dt-modified" datetime="{{ mdate }}" itemprop="dateModified">
21
- {{ mdate | date: date_format }}
22
- </time>
23
- {%- endif -%}
24
- {%- if page.author -%}
25
- • {% for author in page.author %}
26
- <span itemprop="author" itemscope itemtype="http://schema.org/Person">
27
- <span class="p-author h-card" itemprop="name">{{ author }}</span></span>
28
- {%- if forloop.last == false %}, {% endif -%}
29
- {% endfor %}
30
- {%- endif -%}
21
+ {%- endif -%}
22
+ {%- if page.author -%}
23
+ {% for author in page.author %}
24
+ <span itemprop="author" itemscope itemtype="http://schema.org/Person">
25
+ <span class="p-author h-card" itemprop="name">{{ author }}</span></span>
26
+ {%- if forloop.last == false %}, {% endif -%}
27
+ {% endfor %}
28
+ {%- endif -%}
29
+ </p>
30
+
31
+ {% if page.tags.size > 0 %}
32
+ <p class="post-meta post-tags">
33
+ {% assign tags = page.tags | sort %}
34
+ {% for tag in tags %}
35
+ <span class="post-tag">
36
+ {% assign slugified_tag = tag | slugify %}
37
+ <a href="{{ '/tags/#:tag' | replace: ':tag', slugified_tag | relative_url }}">#{{ slugified_tag }}</a>
38
+ </span>
39
+ {% endfor %}
31
40
  </p>
32
-
33
- {% if page.tags.size > 0 %}
34
- <p class="post-meta post-tags">
35
- {% assign tags = page.tags | sort %}
36
- {% for tag in tags %}
37
- <span class="post-tag">
38
- {% assign slugified_tag = tag | slugify %}
39
- <a href="{{ '/tags/#:tag' | replace: ':tag', slugified_tag | relative_url }}">#{{ slugified_tag }}</a>
40
- </span>
41
- {% endfor %}
42
- </p>
43
- {% endif %}
44
- </div>
41
+ {% endif %}
45
42
 
46
43
  </header>
47
44
 
48
- <div class="wrapper">
49
- <div class="post-content e-content" itemprop="articleBody">
50
- {% include toc.html html=content class="toc" %}
51
-
52
- {{ content }}
45
+ <div class="post-content e-content" itemprop="articleBody">
46
+ {{ content }}
53
47
 
54
- {% if page.comments != false and jekyll.environment == "production" %}
55
- {% include disqus.html %}
56
- {% endif %}
57
- </div>
48
+ {% if page.comments != false and jekyll.environment == "production" %}
49
+ {% include disqus.html %}
50
+ {% endif %}
58
51
  </div>
59
52
 
60
53
  </article>
@@ -17,7 +17,7 @@ dl, dd, ol, ul, figure {
17
17
  */
18
18
  h1, h2, h3, h4, h5, h6,
19
19
  p, blockquote, pre,
20
- ul, ol, dl, figure,
20
+ ul, ol, dl, figure, iframe,
21
21
  %vertical-rhythm {
22
22
  margin-bottom: $spacing-unit;
23
23
  }
@@ -123,7 +123,6 @@ code {
123
123
  }
124
124
 
125
125
  code {
126
- @include relative-font-size(0.9);
127
126
  padding: 1px 5px;
128
127
  }
129
128
 
@@ -132,7 +131,6 @@ pre {
132
131
  overflow-x: auto;
133
132
 
134
133
  > code {
135
- @include relative-font-size(0.7);
136
134
  line-height: $base-line-height * $base-font-size * 0.7;
137
135
  border: 0;
138
136
  padding-right: 0;
@@ -1,3 +1,14 @@
1
+ /**
2
+ * Site container
3
+ */
4
+ .site-container {
5
+ height: 100vh;
6
+ width: 100vw;
7
+ display: grid;
8
+ grid-template-columns: 1fr;
9
+ grid-template-rows: $base-font-size * 3 1fr;
10
+ }
11
+
1
12
  /**
2
13
  * Site header
3
14
  */
@@ -6,9 +17,28 @@
6
17
  border-bottom: 1px solid;
7
18
  min-height: $base-font-size * 3;
8
19
  line-height: $base-font-size * 3;
20
+ position: sticky;
21
+ top: 0;
22
+
23
+ @include media-query($on-small) {
24
+ display: flex;
25
+ }
26
+ }
27
+
28
+ .site-sidebar-button {
29
+ position: absolute;
30
+ top: -2px;
31
+ left: $spacing-unit / 2;
32
+
33
+ img {
34
+ width: $base-font-size * 2.5;
35
+ height: auto;
36
+ border-radius: 50%;
37
+ }
9
38
 
10
- // Positioning context for the mobile navigation icon
11
- position: relative;
39
+ @media screen and (min-width: $on-small) {
40
+ display: none;
41
+ }
12
42
  }
13
43
 
14
44
  .site-title {
@@ -18,8 +48,8 @@
18
48
  margin-bottom: 0;
19
49
  float: left;
20
50
 
21
- @include media-query($on-medium) {
22
- padding-right: 45px;
51
+ @include media-query($on-small) {
52
+ float: center;
23
53
  }
24
54
  }
25
55
 
@@ -68,16 +98,36 @@
68
98
  padding-bottom: 5px;
69
99
  }
70
100
 
71
- .page-link {
72
- line-height: $base-line-height * $base-font-size * 1.15;
73
- display: block;
74
- padding: 5px 5px;
101
+ ul.trigger {
102
+ list-style-type: none;
103
+ margin: 0;
104
+ padding: 0;
105
+ overflow: hidden;
106
+
107
+ li a {
108
+ line-height: $base-line-height * $base-font-size * 1.15;
109
+ display: inline;
110
+ padding: 5px 10px;
111
+ margin-left: auto;
112
+ }
113
+
114
+ .dropdown-content {
115
+ display: none;
116
+ position: absolute;
117
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
118
+ z-index: 1;
119
+ }
75
120
 
76
- // Gaps between nav items, but not on the last one
77
- &:not(:last-child) {
78
- margin-right: 0;
121
+ .dropdown-content a {
122
+ padding: 5px 10px;
123
+ display: inline-block;
124
+ text-align: right;
125
+ margin-left: auto;
126
+ }
127
+
128
+ .dropdown:hover .dropdown-content {
129
+ display: block;
79
130
  }
80
- margin-left: 10px;
81
131
  }
82
132
 
83
133
  .current-page {
@@ -102,18 +152,143 @@
102
152
  display: block;
103
153
  }
104
154
 
105
- .page-link {
106
- display: inline;
107
- padding: 0;
155
+ ul.trigger {
156
+ li {
157
+ float: left;
158
+ }
159
+
160
+ li a {
161
+ display: inline-block;
162
+ text-align: center;
163
+ padding: 5px 5px;
164
+
165
+ // Gaps between nav items, but not on the last one
166
+ &:not(:last-child) {
167
+ margin-right: 0;
168
+ }
169
+ margin-left: 10px;
170
+ }
108
171
 
109
- &:not(:last-child) {
110
- margin-right: 10px;
172
+ .dropdown-content a {
173
+ display: block;
174
+ text-align: left;
175
+ padding: 5px 15px 5px 5px;
176
+ margin-left: 10px;
111
177
  }
112
- margin-left: auto;
113
178
  }
114
179
  }
115
180
  }
116
181
 
182
+ /**
183
+ * Site body
184
+ */
185
+ .site-body {
186
+ display: grid;
187
+ grid-template-columns: calc(#{$content-width} * 0.2) 1fr;
188
+ overflow: hidden;
189
+
190
+ @include media-query($on-medium) {
191
+ grid-template-columns: calc(#{$content-width} * 0.15) 1fr;
192
+ }
193
+
194
+ @include media-query($on-small) {
195
+ grid-template-columns: 1fr;
196
+ }
197
+ }
198
+
199
+ /**
200
+ * Site sidebar
201
+ */
202
+ .site-sidebar {
203
+ padding: $spacing-unit / 2;
204
+ border-right: 1px solid;
205
+ @include relative-font-size(0.8);
206
+
207
+ @include media-query($on-medium) {
208
+ @include relative-font-size(0.6);
209
+ }
210
+
211
+ @include media-query($on-small) {
212
+ display: none;
213
+ border-right: none;
214
+ border-bottom: 1px solid;
215
+ }
216
+
217
+ @media screen and (min-width: $on-small) {
218
+ display: block !important;
219
+ }
220
+ }
221
+
222
+ .sidebar-section {
223
+ padding-bottom: $spacing-unit / 2;
224
+ border-bottom: 1px solid;
225
+ margin-bottom: $spacing-unit / 2;
226
+
227
+ &:last-child {
228
+ padding-bottom: 0;
229
+ border-bottom: 0;
230
+ margin-bottom: 0;
231
+ }
232
+ }
233
+
234
+ .sidebar-icon {
235
+ margin-right: 0.5em;
236
+ }
237
+
238
+ .feed-subscribe {
239
+ font-weight: bold;
240
+ text-align: left;
241
+ }
242
+
243
+ .contact-list {
244
+ list-style: none;
245
+ margin-left: 0;
246
+ margin-bottom: 0;
247
+ }
248
+
249
+ .social-icons {
250
+ list-style: none;
251
+ margin-left: 0;
252
+ margin-bottom: 0;
253
+ text-align: left;
254
+ display: flex;
255
+
256
+ .social-icon {
257
+ margin: 0.3em;
258
+ }
259
+ }
260
+
261
+ .author-avatar {
262
+ width: $base-font-size * 9;
263
+ height: auto;
264
+ border-radius: 50%;
265
+ }
266
+
267
+ /**
268
+ * Site main
269
+ */
270
+ .site-main {
271
+ flex: 1 0 auto;
272
+ overflow-y: scroll;
273
+
274
+ // Hide scrollbar for IE, Edge and Firefox
275
+ -ms-overflow-style: none; // IE and Edge
276
+ scrollbar-width: none; // Firefox
277
+
278
+ padding-left: $spacing-unit / 2;
279
+ padding-right: $spacing-unit / 2;
280
+
281
+ @include media-query($on-small) {
282
+ padding-left: 0;
283
+ padding-right: 0;
284
+ }
285
+ }
286
+
287
+ // Hide scrollbar for Chrome, Safari and Opera
288
+ .site-main::-webkit-scrollbar {
289
+ display: none;
290
+ }
291
+
117
292
  /**
118
293
  * Homepage
119
294
  */
@@ -180,19 +355,13 @@
180
355
  }
181
356
  }
182
357
 
183
- /**
184
- * Page content
185
- */
186
- .page-content {
187
- flex: 1 0 auto;
188
- }
189
-
190
358
  /**
191
359
  * Posts
192
360
  */
193
361
  .post-header {
194
- padding-top: $spacing-unit * 2.5;
195
- padding-bottom: $spacing-unit * 2.5;
362
+ padding-top: $spacing-unit * 2;
363
+ padding-bottom: $spacing-unit / 2;
364
+ border-bottom: 1px solid;
196
365
  margin-bottom: $spacing-unit * 2;
197
366
  text-align: center;
198
367
  }
@@ -293,7 +462,6 @@
293
462
  .post-list-by-taxonomy {
294
463
  time {
295
464
  font-family: $code-font-family;
296
- @include relative-font-size(0.9);
297
465
  }
298
466
  }
299
467
 
@@ -342,11 +510,12 @@ figcaption.align-center {
342
510
  * Site footer
343
511
  */
344
512
  .site-footer {
513
+ margin-top: $spacing-unit * 2;
345
514
  border-top: 1px solid;
346
515
  padding: $spacing-unit 0;
347
516
  @include relative-font-size(0.8);
348
517
 
349
- p {
518
+ p, ul {
350
519
  margin-bottom: $spacing-unit / 4;
351
520
  }
352
521
  }
@@ -371,25 +540,3 @@ figcaption.align-center {
371
540
  }
372
541
  }
373
542
  }
374
-
375
- .feed-subscribe {
376
- font-weight: bold;
377
- text-align: left;
378
- .feed-icon {
379
- margin-right: 0.3em;
380
- }
381
- }
382
-
383
- .contact-list {
384
- list-style: none;
385
- margin-left: 0;
386
- }
387
-
388
- .social-icons {
389
- text-align: center;
390
- margin-top: $spacing-unit / 2;
391
-
392
- .social-icon {
393
- margin: 0.3em;
394
- }
395
- }
@@ -63,10 +63,15 @@ table {
63
63
  ///////// Layout ///////////
64
64
 
65
65
  .site-header {
66
+ background-color: $background-color;
66
67
  border-top-color: $border-color-dark;
67
68
  border-bottom-color: $border-color-light;
68
69
  }
69
70
 
71
+ .site-sidebar {
72
+ border-color: $border-color-light;
73
+ }
74
+
70
75
  .site-title {
71
76
  color: $text-color;
72
77
 
@@ -85,9 +90,13 @@ table {
85
90
  }
86
91
  }
87
92
 
88
- .page-link {
93
+ li a {
89
94
  color: $text-color;
90
95
  }
96
+
97
+ .dropdown-content {
98
+ background-color: $border-color-light;
99
+ }
91
100
  }
92
101
 
93
102
  .post-list {
@@ -105,7 +114,7 @@ table {
105
114
  }
106
115
 
107
116
  .post-header {
108
- background-color: $border-color-light;
117
+ border-bottom-color: $border-color-light;
109
118
  }
110
119
 
111
120
  .post-meta {
@@ -139,6 +148,10 @@ table {
139
148
  border-top-color: $border-color-light;
140
149
  }
141
150
 
151
+ .sidebar-section {
152
+ border-bottom-color: $border-color-light;
153
+ }
154
+
142
155
  .feed-subscribe {
143
156
  a {
144
157
  color: $subscribe-color;
@@ -1,13 +1,13 @@
1
- $text-color: #fff !default;
2
- $text-color-light: #dbdbdb !default;
3
- $background-color: #2b2e33 !default;
1
+ $text-color: lightgrey !default;
2
+ $text-color-light: silver !default;
3
+ $background-color: #121212 !default;
4
4
  $code-background-color: #49483e !default;
5
5
 
6
- $border-color: mix(#fff, $background-color, 20%) !default;
6
+ $border-color: mix($text-color, $background-color, 22%) !default;
7
7
  $border-color-light: darken($border-color, 10%) !default;
8
8
  $border-color-dark: lighten($border-color, 10%) !default;
9
9
 
10
- $link-base-color: #00f8cf !default;
10
+ $link-base-color: #00b1c9 !default;
11
11
  $link-visited-color: darken($link-base-color, 5%) !default;
12
12
 
13
13
  $table-text-color: lighten($text-color, 18%) !default;
@@ -1,15 +1,15 @@
1
1
  // Fonts
2
- $base-font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !default;
3
- $title-font-family: "Brush Script MT", $base-font-family !default;
4
- $reading-font-family: "Georgia", $base-font-family !default;
5
- $code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;
2
+ $base-font-family: "Open Sans", "Noto Serif SC" !default;
3
+ $title-font-family: "Dancing Script" !default;
4
+ $reading-font-family: Roboto, "Noto Sans SC" !default;
5
+ $code-font-family: Inconsolata !default;
6
6
  $base-font-size: 18px !default;
7
7
  $base-line-height: 1.4 !default;
8
8
 
9
9
  // Layouts
10
10
  $spacing-unit: 2rem !default;
11
- $content-width: 900px !default;
11
+ $content-width: 1200px !default;
12
12
 
13
- $on-small: 500px !default;
14
- $on-medium: 750px !default;
15
- $on-large: 900px !default;
13
+ $on-small: 600px !default;
14
+ $on-medium: 900px !default;
15
+ $on-large: 1200px !default;
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: jekyll-theme-hamilton
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.1.0
4
+ version: 1.4.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Shangzhi Huang
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2020-05-21 00:00:00.000000000 Z
11
+ date: 2020-07-01 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -111,6 +111,7 @@ files:
111
111
  - _includes/header.html
112
112
  - _includes/image.html
113
113
  - _includes/mathjax.html
114
+ - _includes/sidebar.html
114
115
  - _layouts/archive-taxonomies.html
115
116
  - _layouts/archive-years.html
116
117
  - _layouts/default.html
@@ -155,8 +156,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
155
156
  - !ruby/object:Gem::Version
156
157
  version: '0'
157
158
  requirements: []
158
- rubygems_version: 3.0.1
159
+ rubygems_version: 3.0.3
159
160
  signing_key:
160
161
  specification_version: 4
161
- summary: Another minimal style of Jekyll theme for writers
162
+ summary: A minimal and beautiful Jekyll theme best for writing and note-taking.
162
163
  test_files: []