tecitheme 0.0.21 → 0.0.24

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.
@@ -3,6 +3,7 @@
3
3
  export let description
4
4
  export let image
5
5
  export let url
6
+ export let host
6
7
 
7
8
  function imageURL(str)
8
9
  {
@@ -15,13 +16,13 @@
15
16
  </script>
16
17
 
17
18
  <meta property="og:type" content="website">
18
- <meta property="og:url" content="{url.href}">
19
+ <meta property="og:url" content="{url}">
19
20
  <meta name="og:title" content={title} >
20
21
  <meta name="og:description" content={description} >
21
22
  {#if imageURL(image)}
22
23
  <meta name="og:image" content="{image}" >
23
24
  {:else}
24
- <meta name="og:image" content="https://{url.hostname}{image}" >
25
+ <meta name="og:image" content="https://{host}/{image}" >
25
26
  {/if}
26
27
  <meta name="twitter:card" content="summary_large_image">
27
28
  <meta name="twitter:site" content="@thunderheadeng">
@@ -6,6 +6,7 @@ export default class MetaSocial extends SvelteComponentTyped<{
6
6
  description: any;
7
7
  image: any;
8
8
  url: any;
9
+ host: any;
9
10
  }, {
10
11
  [evt: string]: CustomEvent<any>;
11
12
  }, {}> {
@@ -20,6 +21,7 @@ declare const __propDef: {
20
21
  description: any;
21
22
  image: any;
22
23
  url: any;
24
+ host: any;
23
25
  };
24
26
  events: {
25
27
  [evt: string]: CustomEvent<any>;
@@ -2,6 +2,7 @@
2
2
  import { DateTime } from 'luxon';
3
3
  import { getContext } from 'svelte';
4
4
  import { paginate, PaginationNav } from 'svelte-paginate';
5
+ import Icon from './Icon.svelte'
5
6
 
6
7
  export let data;
7
8
 
@@ -13,9 +14,13 @@
13
14
  let pageSize = data.pageSize;
14
15
 
15
16
  function termExists(arr, terms) {
16
- return terms.some((value) => {
17
- return arr.includes(value);
18
- });
17
+ if (arr) {
18
+ return terms.some((term) => {
19
+ return arr.includes(term);
20
+ });
21
+ } else {
22
+ return false
23
+ }
19
24
  }
20
25
 
21
26
  function filterPosts(arr, terms) {
@@ -38,7 +43,7 @@
38
43
  $: paginatedItems = paginate({ items, pageSize, currentPage });
39
44
  </script>
40
45
 
41
- <div class="relative mx-auto w-full">
46
+ <div class="relative w-full mx-auto">
42
47
  <div
43
48
  class="flex flex-col justify-between space-y-4 border-b-2 border-gray-200 pb-4 sm:flex-row sm:items-end sm:space-y-0"
44
49
  >
@@ -67,6 +72,7 @@
67
72
  >
68
73
  </div>
69
74
  </div>
75
+ {#if (items.length > 0)}
70
76
  <div class="paginator mx-auto flex justify-center pt-4">
71
77
  <PaginationNav
72
78
  totalItems="{items.length}"
@@ -81,34 +87,47 @@
81
87
  class="grid gap-16 pt-8 md:grid-cols-2 lg:grid-cols-3 lg:gap-x-5 lg:gap-y-12"
82
88
  >
83
89
  {#each paginatedItems as post}
84
- <a class="block h-full" href="{post.path}">
85
- <div class="flex h-full flex-col items-stretch">
86
- <time
87
- class="mb-1 block text-sm text-gray-500"
88
- datetime="{post.meta.date}"
89
- >{DateTime.fromISO(post.meta.date).toLocaleString()}</time
90
- >
91
- <p class="mb-2 text-xl font-semibold text-gray-900">
92
- {post.meta.title}
90
+ <div class="h-full">
91
+ <div class="h-full flex flex-col items-stretch ">
92
+ <time
93
+ class="mb-1 block text-sm text-gray-500"
94
+ datetime="{post.meta.date}"
95
+ >{DateTime.fromISO(post.meta.date).toLocaleString()}</time
96
+ >
97
+ <h2 class="mb-2 text-xl font-semibold text-gray-900">
98
+ <a href="/{post.path}">
99
+ {post.meta.title}
100
+ </a>
101
+ </h2>
102
+ {#if post.meta.summary}
103
+ <p class="mb-2 flex-1 text-base text-gray-500">
104
+ <a href="/{post.path}">
105
+ {post.meta.summary.length > 190
106
+ ? post.meta.summary.substring(0, 190) + ' ...'
107
+ : post.meta.summary}
108
+ </a>
93
109
  </p>
94
- {#if post.meta.summary}
95
- <p class="mb-2 flex-1 text-base text-gray-500">
96
- {post.meta.summary.length > 190
97
- ? post.meta.summary.substring(0, 190) + ' ...'
98
- : post.meta.summary}
99
- </p>
100
- {:else}
101
- <p class="mb-2 flex-1 text-base text-red-500">
102
- Missing Summary Text
103
- </p>
104
- {/if}
105
- <p
106
- class="text-sm font-semibold text-teci-blue-light hover:text-teci-blue-dark"
107
- >
108
- Read full article<span aria-hidden="true">&nbsp;→</span>
110
+ {:else}
111
+ <p class="mb-2 flex-1 text-base text-red-500">
112
+ Missing Summary Text
109
113
  </p>
114
+ {/if}
115
+ {#if post.meta.categories}
116
+ <div class="w-full text-sm flex flex-wrap">
117
+ {#each (post.meta.categories.sort()) as term}
118
+ <a class="inline-block mr-2 mb-2" href="/news/{term}" rel="external">
119
+ <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs bg-teci-blue-dark text-white">{term}</span>
120
+ </a>
121
+ {/each}
110
122
  </div>
111
- </a>
123
+ {/if}
124
+ <p class="text-sm font-semibold text-teci-blue-light hover:text-teci-blue-dark">
125
+ <a href="/{post.path}">
126
+ Read full article<span aria-hidden="true">&nbsp;→</span>
127
+ </a>
128
+ </p>
129
+ </div>
130
+ </div>
112
131
  {/each}
113
132
  </div>
114
133
  <div class="paginator mx-auto flex justify-center pt-8">
@@ -121,4 +140,12 @@
121
140
  on:setPage="{(e) => (currentPage = e.detail.page)}"
122
141
  />
123
142
  </div>
143
+ {:else}
144
+ <div class="prose">
145
+ <p class="pt-8">
146
+ Sorry, there isn't any news for you to see here.<br>
147
+ Please visit the <a rel="external" href="/news">All News</a> page for an updated list.
148
+ </p>
149
+ </div>
150
+ {/if}
124
151
  </div>
@@ -1,5 +1,6 @@
1
1
  <script>
2
- import {page} from "$app/stores"
2
+ import { browser } from '$app/env';
3
+ import { getContext } from 'svelte';
3
4
 
4
5
  import CTA from '../components/CTA.svelte';
5
6
  import HeadingCentered from '../components/HeadingCentered.svelte';
@@ -33,6 +34,11 @@
33
34
  export let page_sections;
34
35
 
35
36
  let featuredImage;
37
+ let url;
38
+ let host;
39
+
40
+ url = getContext('currentURL');
41
+ host = getContext('currentHost');
36
42
 
37
43
  if (images.length > 0) {
38
44
  featuredImage = images[0]
@@ -44,7 +50,9 @@
44
50
  <svelte:head>
45
51
  <title>{title} | Thunderhead Engineering</title>
46
52
  <meta name="description" content={summary}>
47
- <MetaSocial title={title} description={summary} image={featuredImage} url={$page.url} />
53
+ {#if browser}
54
+ <MetaSocial title={title} description={summary} image={featuredImage} {url} {host} />
55
+ {/if}
48
56
  </svelte:head>
49
57
 
50
58
  <article class="flex flex-col space-y-12 {layout}">
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "tecitheme",
3
- "version": "0.0.21",
3
+ "version": "0.0.24",
4
4
  "svelte": true,
5
5
  "devDependencies": {
6
6
  "@jsdevtools/rehype-toc": "^3.0.2",
7
7
  "@sveltejs/adapter-netlify": "next",
8
8
  "@sveltejs/kit": "next",
9
- "@tailwindcss/forms": "^0.5.1",
9
+ "@tailwindcss/forms": "^0.5.2",
10
10
  "@tailwindcss/typography": "^0.5.2",
11
11
  "@types/cookie": "^0.5.1",
12
12
  "@typescript-eslint/eslint-plugin": "^5.27.0",
@@ -14,7 +14,7 @@
14
14
  "autoprefixer": "^10.4.7",
15
15
  "dotenv": "^16.0.1",
16
16
  "encoding": "^0.1.13",
17
- "eslint": "^8.16.0",
17
+ "eslint": "^8.17.0",
18
18
  "eslint-config-prettier": "^8.5.0",
19
19
  "eslint-plugin-svelte3": "^4.0.0",
20
20
  "luxon": "^2.4.0",
@@ -27,14 +27,15 @@
27
27
  "rehype-stringify": "^9.0.3",
28
28
  "stream": "^0.0.2",
29
29
  "svelte": "^3.48.0",
30
- "svelte-check": "^2.7.1",
30
+ "svelte-check": "^2.7.2",
31
31
  "svelte-paginate": "^0.0.1",
32
- "svelte-preprocess": "^4.10.6",
32
+ "svelte-preprocess": "^4.10.7",
33
33
  "svelte2tsx": "^0.5.10",
34
- "tailwindcss": "^3.0.24",
34
+ "tailwindcss": "^3.1.1",
35
35
  "tslib": "^2.4.0",
36
- "typescript": "^4.7.2",
37
- "vite": "^2.9.9",
36
+ "typescript": "^4.7.3",
37
+ "uuid-by-string": "^3.0.7",
38
+ "vite": "^2.9.10",
38
39
  "vite-plugin-autoimport": "^1.6.6"
39
40
  },
40
41
  "type": "module",