created posts block

ifahrentholz · Feb 2, 2024 · ef3a4f3 · ef3a4f3
1 parent d1404e2
commit ef3a4f3
Show file tree

Hide file tree

Showing 5 changed files with 81 additions and 0 deletions.
diff --git a/dist/posts/posts.js b/dist/posts/posts.js
diff --git a/dist/posts/posts.js.map b/dist/posts/posts.js.map
diff --git a/src/blocks/posts/posts.ts b/src/blocks/posts/posts.ts
@@ -0,0 +1,76 @@
+import { html, render } from 'lit';
+
+const template = () => {
+  return html` <article>
+      <a href="#" class="image"><img src="images/pic01.jpg" alt="" /></a>
+      <h3>Interdum aenean</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>
+    <article>
+      <a href="#" class="image"><img src="images/pic02.jpg" alt="" /></a>
+      <h3>Nulla amet dolore</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>
+    <article>
+      <a href="#" class="image"><img src="images/pic03.jpg" alt="" /></a>
+      <h3>Tempus ullamcorper</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>
+    <article>
+      <a href="#" class="image"><img src="images/pic04.jpg" alt="" /></a>
+      <h3>Sed etiam facilis</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>
+    <article>
+      <a href="#" class="image"><img src="images/pic05.jpg" alt="" /></a>
+      <h3>Feugiat lorem aenean</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>
+    <article>
+      <a href="#" class="image"><img src="images/pic06.jpg" alt="" /></a>
+      <h3>Amet varius aliquam</h3>
+      <p>
+        Aenean ornare velit lacus, ac varius enim lorem ullamcorper dolore. Proin aliquam facilisis ante interdum. Sed
+        nulla amet lorem feugiat tempus aliquam.
+      </p>
+      <ul class="actions">
+        <li><a href="#" class="button">More</a></li>
+      </ul>
+    </article>`;
+};
+export default function (block: HTMLElement) {
+  block.innerHTML = '';
+
+  block.style.removeProperty('display');
+  render(template(), block);
+}
diff --git a/types/blocks/posts/posts.d.ts b/types/blocks/posts/posts.d.ts
@@ -0,0 +1 @@
+export default function (block: HTMLElement): void;
diff --git a/vite.config.ts b/vite.config.ts
@@ -27,6 +27,7 @@ export default defineConfig(({ command, mode }) => {
           counter: resolve(__dirname, 'src/blocks/counter/counter.ts'),
           banner: resolve(__dirname, 'src/blocks/banner/banner.ts'),
           features: resolve(__dirname, 'src/blocks/features/features.ts'),
+          posts: resolve(__dirname, 'src/blocks/posts/posts.ts'),
         },
         output: {
           dir: 'dist',
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export default function (block: HTMLElement): void;