refactor(components): rewrite PostsList component

* remove NoResults component and move logic to Search page
* add a usePostsList hook
* remove Pagination from PostsList (it is only used if javascript is
disabled and not on every posts list)
* replace `byYear` prop with `sortByYear`
* replace `loadMore` prop with `onLoadMore`
* remove `showLoadMoreBtn` (we can use `loadMore` prop instead to
determine if we need to display the button)
* replace `titleLevel` prop with `headingLvl`
* add `firstNewResult` prop to handle focus on the new results when
loading more article (we should not focus a useless span but the item
directly)

2 files changed, 18 insertions, 6 deletions

diff --git a/src/styles/pages/blog.module.scss b/src/styles/pages/blog.module.scss
new file mode 100644
index 0000000..0fbde7c
--- /dev/null
+++ b/src/styles/pages/blog.module.scss
@@ -0,0 +1,18 @@
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
+
+.list {
+  @include mix.media("screen") {
+    @include mix.dimensions("md") {
+      --col1: #{fun.convert-px(100)};
+      --gap: var(--spacing-lg);
+
+      margin-left: calc((var(--col1) + var(--gap)) * -1);
+    }
+  }
+}
+
+.logo {
+  max-width: fun.convert-px(50);
+  margin: 0 var(--spacing-xs) 0 0;
+}
diff --git a/src/styles/pages/topic.module.scss b/src/styles/pages/topic.module.scss
deleted file mode 100644
index bec4ba2..0000000
--- a/src/styles/pages/topic.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@use "../abstracts/functions" as fun;
-
-.logo {
-  max-width: fun.convert-px(50);
-  margin: 0 var(--spacing-xs) 0 0;
-}