Docs styles updates (#1618)

* admonition refresh (3 out of 5 variants)

* docs home page wip

* docs home wip

* add links/contribute section

* fix admonition types

* add blog plugin; add blog section;

* update languages

* fix layout/seo issues

* admonition update

* update links; fix sidebar style

* clean up

* fix languages layout and borders

* remove dead code

* get rid of magic numbers in tooltip code

* snap language cards on mobile

---------

Co-authored-by: Jason <[email protected]>

docs/home.mdx

@@ -9,21 +9,44 @@ custom_edit_url: null
 authors: null
 ---
 
-import Header from "@site/src/components/DocsHome/Header";
-import Contribute from "@site/src/components/DocsHome/Contribute";
-import Tutorials from "@site/src/components/DocsHome/Tutorials";
-import DevGuides from "@site/src/components/DocsHome/DevGuides";
-import Languages from "@site/src/components/DocsHome/Languages";
+import DocsHomePage from "@site/src/components/DocsHome/";
 import { css } from "@site/src/utils/dummy-css";
 
 <style>{css`
   .main-wrapper {
     overflow: hidden;
   }
+  .container {
+    max-width: none;
+    padding-bottom: 0 !important;
+  }
+  .main-wrapper main {
+    max-width: none;
+  }
+
+  .theme-doc-footer {
+    display: none;
+  }
+
+  .pagination-nav {
+    display: none;
+  }
+
+  .main-wrapper main .row .col {
+    padding: 0 16px;
+  }
+
+  @media (min-width: 641px) {
+    .main-wrapper main .row .col {
+      padding: 0 32px;
+    }
+  }
+
+  @media (min-width: 997px) {
+    .main-wrapper main .row .col {
+      padding: 0 50px;
+    }
+  }
 `}</style>
 
-<Header />
-<Tutorials />
-<DevGuides />
-<Languages />
-<Contribute />
+<DocsHomePage />

docusaurus.config.js

@@ -18,6 +18,7 @@ const matomoPlugin = require("./plugins/matomo");
 const customWebpack = require("./plugins/custom-webpack");
 const liveSessionsPlugin = require("./plugins/live-sessions");
 const roadmapDataPlugin = require("./plugins/roadmap-data");
+const blogPostsPlugin = require("./plugins/blog-posts");
 const whatIsIcpDataPlugin = require("./plugins/what-is-the-ic-cards");
 const howItWorksCardsPlugin = require("./plugins/howitworks-cards");
 const howItWorksArticlesPlugin = require("./plugins/howitworks-articles");
@@ -404,6 +405,7 @@ const config = {
     roadmapDataPlugin,
     whatIsIcpDataPlugin,
     matomoPlugin,
+    blogPostsPlugin,
     [
       "@docusaurus/plugin-client-redirects",
       {