Docs review comments (#301)

* Add review comments

* Add review comments

docusaurus/src/components/HomepageFAQ/index.js

@@ -18,19 +18,19 @@ const items = [
   },
   {
     "heading": "How can I contribute or request features?",
-    "content": "We love and welcome community contributions! Here is a doc to get you started. To request features, add a “Feature request” using the New issue button in Github from this link, or join our feature-request Discord channel."
+    "content": "We love and welcome community contributions! Here is a <a href='https://github.com/airtai/fastkafka/blob/main/CONTRIBUTING.md' target='_blank'>doc</a> to get you started. To request features, add a “Feature request” using the New issue button in GitHub from <a href='https://github.com/airtai/fastkafka/issues' target='_blank'>this link</a>, or join our feature-request <a href='https://discord.gg/CJWmYpyFbc' target='_blank'>Discord channel</a>."
   },
   {
     "heading": "Do you support any streaming platforms other than Kafka?",
-    "content": "Slowly, but surely. We built the initial version for Kafka service and for our needs, but we reached out to the wider community to find out what to do next. We added support for Red panda, and also got requests for RabbitMQ and Pulsar that went to our backlog and we’ll support them in our future releases."
+    "content": "Slowly, but surely. We built the initial version for Kafka service and for our needs, but we reached out to the wider community to find out what to do next. We added support for Redpanda, and also got requests for RabbitMQ and Pulsar that went to our backlog and we’ll support them in our future releases."
   },
   {
     "heading": "Does FastKafka integrate with AsyncAPI in the way that FastAPi integrates with OpenAPI?",
-    "content": "Very much the same, but with a small difference due to dependancies of AsyncAPI. You write your code using decorators and you get AsyncAPI specification generated automatically as YAML file. You can convert that file to static HTML file ether by Python API call, CLI or github action. AsyncAPI requires Node.js, and you don’t necessarily want this in production."
+    "content": "Very much the same, but with a small difference due to dependencies of AsyncAPI. You write your code using decorators and you get AsyncAPI specification generated automatically as YAML file. You can convert that file to static HTML file ether by Python API call, CLI or github action. AsyncAPI requires Node.js, and you don’t necessarily want this in production."
   },
   {
     "heading": "Does it assume that Kafka messages are in JSON format? What if we want to use protobuf, for example?",
-    "content": "For the first implementation we just released uses with JSON encoded messages, but we can easily add additional formats/protocols. We’ve created an issue on github and will try to prioritize it for one of the next releases."
+    "content": "For the first implementation we just released uses with JSON encoded messages, but we can easily add additional formats/protocols. We’ve created an issue on GitHub and will try to prioritize it for one of the next releases."
   },
 ]
 
@@ -52,7 +52,7 @@ export default function HomepageFAQ() {
                       </AccordionItemButton>
                   </AccordionItemHeading>
                   <AccordionItemPanel>
-                    {item.content}
+                  <p className={styles.faqAnswer} dangerouslySetInnerHTML={{__html: item.content}} />
                   </AccordionItemPanel>
               </AccordionItem>
           ))}

docusaurus/src/components/HomepageFAQ/styles.module.css

@@ -60,6 +60,9 @@
 .href {
   text-decoration: underline;
 }
+.faqAnswer a {
+  text-decoration: underline;
+}
 
 /** Mobile view */
 @media screen and (max-width: 996px) {

docusaurus/src/css/custom.css

@@ -65,21 +65,55 @@
 }
 
 /* default settings for both tablet and desktop */
-
-.toggleButton_node_modules-\@docusaurus-theme-classic-lib-theme-ColorModeToggle-styles-module {
+.navbar.navbar--fixed-top .navbar__items > a.header-discord-link + div > button,
+.navbar-sidebar .navbar-sidebar__brand div > button {
   color: #fff;
 }
 .navbar.navbar--fixed-top
-  .toggleButton_node_modules-\@docusaurus-theme-classic-lib-theme-ColorModeToggle-styles-module:hover {
+  .navbar__items
+  > a.header-discord-link
+  + div
+  > button:hover,
+.navbar-sidebar .navbar-sidebar__brand div > button:hover {
   background: #8c9fae;
 }
 
 [data-theme="dark"]
   .navbar.navbar--fixed-top
-  .toggleButton_node_modules-\@docusaurus-theme-classic-lib-theme-ColorModeToggle-styles-module:hover {
+  .navbar__items
+  > a.header-discord-link
+  + div
+  > button:hover,
+.navbar-sidebar .navbar-sidebar__brand div > button:hover {
   background: #444950;
 }
 
+.navbar-sidebar .navbar-sidebar__items .navbar-sidebar__item > button,
+.navbar-sidebar .navbar-sidebar__items .navbar-sidebar__item > ul > li a {
+  color: #fff;
+}
+
+.menu__list-item--collapsed .menu__link--sublist-caret:after {
+  background: url("/static/img/icon-arrow-right-blue.svg") 50% / 2rem 2rem;
+  min-width: 1rem;
+  width: 1rem;
+  height: 1rem;
+  transform: rotateZ(0deg);
+  filter: none;
+}
+.menu__link--sublist-caret:after {
+  background: url("/static/img/icon-arrow-right-blue.svg") 50% / 2rem 2rem;
+  transform: rotate(90deg);
+  min-width: 1rem;
+  width: 1rem;
+  height: 1rem;
+  filter: none;
+}
+.navbar-sidebar__back,
+.menu__link--active:not(.menu__link--sublist) {
+  background: rgba(255, 255, 255, 0.05);
+}
+
 html.plugin-pages .navbar__items.navbar__items--right > a + div > button {
   display: none;
 }
@@ -118,9 +152,9 @@ html.plugin-pages
 }
 .navbar__title {
   color: #fff;
-  font-size: 3.4rem;
+  font-size: 2.74rem;
   position: absolute;
-  margin-top: 0.3rem;
+  margin-top: 0.7rem;
   margin-left: 2.4rem;
   font-family: var(--ifm-heading-font-family);
   font-weight: 100;
@@ -189,7 +223,7 @@ html.docs-doc-page .navbar.navbar--fixed-top .navbar__items--right {
 @media screen and (max-width: 996px) {
   .navbar__title {
     margin-top: 0;
-    margin-left: 1.8rem;
+    /* margin-left: 1.8rem; */
   }
   html.docs-doc-page .navbar__brand {
     margin-left: 1rem;
@@ -402,10 +436,10 @@ h3.anchor > code {
 }
 
 .accordion__item .accordion__panel {
-  padding: 20px;
+  padding: 2.5rem 2.5rem 1.5rem 2.5rem;
   animation: fadein 0.35s ease-in;
   color: #fff;
-  /* font-size: 1rem; */
+  font-size: 1.4rem;
   /* border: 1px solid #8bcae5; */
   /* border-top: none; */
 }
@@ -430,6 +464,10 @@ h3.anchor > code {
     font-size: 1.1rem;
     padding: 1rem;
   }
+  .accordion__item .accordion__panel {
+    font-size: 1.1rem;
+    padding: 1rem 1rem 0.3rem 1rem;
+  }
   .footer.footer--dark .footer__col {
     margin: 1rem auto 1rem;
     height: auto;
@@ -459,18 +497,19 @@ h3.anchor > code {
   .navbar__brand {
     margin-left: 1rem;
   }
-  .navbar__title {
-    font-size: 3rem;
-  }
   ul.menu__list li {
     margin-bottom: 10px;
   }
   .navbar__logo {
-    margin-top: 1rem;
-    width: 1.7rem;
+    margin-top: 0.5rem;
+    width: 1.6rem;
   }
   .navbar__title {
-    margin-top: 0;
-    margin-left: 1.8rem;
+    margin-top: 0.1rem;
+    margin-left: 2.2rem;
+    font-size: 1.95rem;
+  }
+  html.docs-doc-page .navbar__brand {
+    margin-left: 0rem;
   }
 }