forked from nyancrimew/maia.crimew.gay
		
	blog: post layout improvements
This commit is contained in:
		
							parent
							
								
									10bfb88a0e
								
							
						
					
					
						commit
						bea3c64d0f
					
				
					 7 changed files with 88 additions and 9 deletions
				
			
		|  | @ -1,5 +1,6 @@ | |||
| const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight') | ||||
| const pluginRss = require('@11ty/eleventy-plugin-rss'); | ||||
| const timeToRead = require('eleventy-plugin-time-to-read'); | ||||
| 
 | ||||
| module.exports = function (eleventyConfig) { | ||||
|   const parseDate = (str) => { | ||||
|  | @ -12,8 +13,9 @@ module.exports = function (eleventyConfig) { | |||
|   const formatPart = (part, date) => | ||||
|   new Intl.DateTimeFormat("en", part).format(date); | ||||
| 
 | ||||
|   eleventyConfig.addPlugin(pluginRss) | ||||
|   eleventyConfig.addPlugin(syntaxHighlight) | ||||
|   eleventyConfig.addPlugin(pluginRss); | ||||
|   eleventyConfig.addPlugin(syntaxHighlight); | ||||
|   eleventyConfig.addPlugin(timeToRead); | ||||
| 
 | ||||
|   eleventyConfig.addPassthroughCopy({ "src/static": "/" }); | ||||
| 
 | ||||
|  |  | |||
							
								
								
									
										25
									
								
								package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										25
									
								
								package-lock.json
									
									
									
										generated
									
									
									
								
							|  | @ -10,7 +10,8 @@ | |||
|             "dependencies": { | ||||
|                 "@11ty/eleventy": "^v2.0.0-beta.1", | ||||
|                 "@11ty/eleventy-plugin-rss": "^1.2.0", | ||||
|                 "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0" | ||||
|                 "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0", | ||||
|                 "eleventy-plugin-time-to-read": "^1.3.0" | ||||
|             } | ||||
|         }, | ||||
|         "node_modules/@11ty/dependency-tree": { | ||||
|  | @ -705,6 +706,22 @@ | |||
|                 "node": ">=0.10.0" | ||||
|             } | ||||
|         }, | ||||
|         "node_modules/eleventy-plugin-time-to-read": { | ||||
|             "version": "1.3.0", | ||||
|             "resolved": "https://registry.npmjs.org/eleventy-plugin-time-to-read/-/eleventy-plugin-time-to-read-1.3.0.tgz", | ||||
|             "integrity": "sha512-EefxYZJviQbClwoQ+pXW0YsVoi3gzXJ3prJoOLO1g3n5dM17KyZh81/yyq5Inrdc2pxBz3CXsyo21kk43gK/Gg==", | ||||
|             "engines": { | ||||
|                 "node": ">=13.0.0" | ||||
|             }, | ||||
|             "peerDependencies": { | ||||
|                 "@11ty/eleventy": "*" | ||||
|             }, | ||||
|             "peerDependenciesMeta": { | ||||
|                 "@11ty/eleventy": { | ||||
|                     "optional": true | ||||
|                 } | ||||
|             } | ||||
|         }, | ||||
|         "node_modules/encodeurl": { | ||||
|             "version": "1.0.2", | ||||
|             "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", | ||||
|  | @ -2795,6 +2812,12 @@ | |||
|                 "jake": "^10.8.5" | ||||
|             } | ||||
|         }, | ||||
|         "eleventy-plugin-time-to-read": { | ||||
|             "version": "1.3.0", | ||||
|             "resolved": "https://registry.npmjs.org/eleventy-plugin-time-to-read/-/eleventy-plugin-time-to-read-1.3.0.tgz", | ||||
|             "integrity": "sha512-EefxYZJviQbClwoQ+pXW0YsVoi3gzXJ3prJoOLO1g3n5dM17KyZh81/yyq5Inrdc2pxBz3CXsyo21kk43gK/Gg==", | ||||
|             "requires": {} | ||||
|         }, | ||||
|         "encodeurl": { | ||||
|             "version": "1.0.2", | ||||
|             "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", | ||||
|  |  | |||
|  | @ -10,6 +10,7 @@ | |||
|     "dependencies": { | ||||
|         "@11ty/eleventy": "^v2.0.0-beta.1", | ||||
|         "@11ty/eleventy-plugin-rss": "^1.2.0", | ||||
|         "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0" | ||||
|         "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0", | ||||
|         "eleventy-plugin-time-to-read": "^1.3.0" | ||||
|     } | ||||
| } | ||||
|  |  | |||
|  | @ -13,7 +13,11 @@ subhead: blog | |||
|                 {% if changed_date %} | ||||
|                     <small class="updated">(updated <time datetime="{{changed_date | date_to_datetime }}">{{ changed_date | date_formatted }}</time>)</small> | ||||
|                 {% endif %} | ||||
|                 <span class="middot"></span> | ||||
|                 <span class="readtime">{{ content | timeToRead }} to read</span> | ||||
|                 <span class="middot"></span> | ||||
|                 <span>by <span class="author by" id="author">{{ site.name }}</span></span> | ||||
|                 <span class="middot"></span> | ||||
|                 {% if tags %} | ||||
|                     <span>in  | ||||
|                         {% for tag in tags %} | ||||
|  |  | |||
|  | @ -11,8 +11,27 @@ permalink: /posts/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumbe | |||
| {% block main %} | ||||
|   <ul> | ||||
|     {% for entry in pagination.items %} | ||||
|     <li> | ||||
|       <span><a href="{{ entry.url }}">{{ entry.data.title }}</a> on <span><time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time></span></span> | ||||
|     <li class="list-entry"> | ||||
|       <a href="{{ entry.url }}"><h2>{{ entry.data.title }}</h2></a> | ||||
|       <div class="byline"> | ||||
|         <time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time> | ||||
|         {% if entry.data.changed_date %} | ||||
|             <small class="updated">(updated <time datetime="{{ entry.data.changed_date | date_to_datetime }}">{{ entry.data.changed_date | date_formatted }}</time>)</small> | ||||
|         {% endif %} | ||||
|         <span class="middot"></span> | ||||
|         <span class="readtime">{{ entry.content | timeToRead }} to read</span> | ||||
|         <span class="middot"></span> | ||||
|         <span>by <span class="author by" id="author">{{ site.name }}</span></span> | ||||
|         <span class="middot"></span> | ||||
|         {% if entry.data.tags %} | ||||
|             <span>in  | ||||
|                 {% for tag in entry.data.tags %} | ||||
|                     <span class="tag"><a href="/posts/tagged/{{ tag | slugify }}/">{{ tag }}</a></span>{% if not loop.last %}, {% endif %} | ||||
|                 {% endfor %} | ||||
|             </span> | ||||
|         {% endif %} | ||||
|         </div> | ||||
|         <span class="lead"><strong>{{ entry.data.description }}</strong></span> | ||||
|     </li> | ||||
|     {% endfor %} | ||||
|   </ul> | ||||
|  |  | |||
|  | @ -41,6 +41,14 @@ footer, | |||
|   text-align: center; | ||||
| } | ||||
| 
 | ||||
| .list-entry { | ||||
|   list-style-type: none; | ||||
| } | ||||
| 
 | ||||
| .list-entry h2 { | ||||
|   margin-bottom: 0; | ||||
| } | ||||
| 
 | ||||
| #content { | ||||
|   max-width: 900px; | ||||
|   margin-left: auto; | ||||
|  | @ -53,6 +61,11 @@ footer, | |||
|   font-size: 0.75rem; | ||||
| } | ||||
| 
 | ||||
| .middot::after { | ||||
|   content: '\00B7'; | ||||
|   display: inline-block; | ||||
| } | ||||
| 
 | ||||
| time, | ||||
| .author, | ||||
| .updated { | ||||
|  |  | |||
|  | @ -20,9 +20,26 @@ date: git Last Modified | |||
|   <ul> | ||||
|     {% set taglist = collections[ tag ] %} | ||||
|     {% for entry in taglist | reverse %} | ||||
|     <li> | ||||
|       <span><a href="{{ entry.url }}">{{ entry.data.title }}</a> on <span><time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time></span></span> | ||||
|     </li> | ||||
|       <li class="list-entry"> | ||||
|           <a href="{{ entry.url }}"><h2>{{ entry.data.title }}</h2></a> | ||||
|           <div class="byline"> | ||||
|           <time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time> | ||||
|           {% if entry.data.changed_date %} | ||||
|               <small class="updated">(updated <time datetime="{{ entry.data.changed_date | date_to_datetime }}">{{ entry.data.changed_date | date_formatted }}</time>)</small> | ||||
|           {% endif %} | ||||
|           <span class="middot"></span> | ||||
|           <span>by <span class="author by" id="author">{{ site.name }}</span></span> | ||||
|           <span class="middot"></span> | ||||
|           {% if entry.data.tags %} | ||||
|               <span>in  | ||||
|                   {% for tag in entry.data.tags %} | ||||
|                       <span class="tag"><a href="/posts/tagged/{{ tag | slugify }}/">{{ tag }}</a></span>{% if not loop.last %}, {% endif %} | ||||
|                   {% endfor %} | ||||
|               </span> | ||||
|           {% endif %} | ||||
|           </div> | ||||
|           <span class="lead"><strong>{{ entry.data.description }}</strong></span> | ||||
|       </li> | ||||
|     {% endfor %} | ||||
|   </ul> | ||||
| {% endblock %} | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue