Merge pull request #424 from amplication/docs/typography-and-colors

Docs: Typography and Color Improvements

Author: yuval-hazaz

docusaurus.config.js

@@ -8,6 +8,9 @@ module.exports = {
   organizationName: "amplication", // Usually your GitHub org/user name.
   projectName: "amplication", // Usually your repo name.
   trailingSlash: true,
+  stylesheets: [
+    "https://fonts.googleapis.com/css?family=Poppins"
+  ],
   themeConfig: {
     metadata: [
       { name: "twitter:card", content: "summary_large_image" },
@@ -177,6 +180,7 @@ module.exports = {
           editUrl: "https://github.com/amplication/docs/edit/main/",
           showLastUpdateAuthor: true,
           showLastUpdateTime: true,
+          breadcrumbs: false
         },
         blog: false,
         theme: {

src/css/custom.css

@@ -222,3 +222,115 @@ article > header {
     display: none; 
   }
 }
+
+.menu__link {
+  color: #B7BAC7;
+  font-size: 14px;
+}
+
+.menu__link.menu__link--active,
+.menu__link.menu__link--sublist.menu__link--active {
+  color: #FFF;
+}
+
+.markdown a, .markdown a:hover {
+  color: #53DBEE;
+}
+
+.navbar__link:hover, .navbar__link--active {
+  color: #53DBEE;
+}
+
+.markdown .alert a {
+  text-decoration-color: #53DBEE;
+}
+
+.theme-edit-this-page {
+  color: #53DBEE;
+}
+
+.pagination-nav__link:hover {
+  border-color: #53DBEE;
+}
+
+.pagination-nav__label {
+  color: #53DBEE;
+}
+
+.navbar__link {
+  font-size: 14px;
+}
+
+.navbar__logo img {
+  height: 82%;
+}
+
+@media only screen and (max-width: 995px) {
+  .navbar__logo img {
+    height: 90%;
+  }
+}
+
+.table-of-contents__link {
+  color: #B7BAC7;
+  font-size: 12px;
+}
+
+.table-of-contents__link.toc-highlight.table-of-contents__link--active,
+.table-of-contents__link:hover {
+  color: #FFF;
+}
+
+.breadcrumbs__link > svg > path {
+  fill: #B7BAC7;
+}
+
+.markdown h1:first-child {
+  font-size: 32px;
+  font-weight: 600;
+  line-height: 1.25rem;
+  margin-top: 1rem;
+}
+
+.markdown > h2 {
+  font-size: 18px;
+  font-weight: 600;
+  line-height: 1.25rem;
+}
+
+.markdown > pre,
+.markdown > ul,
+.markdown > ol,
+.markdown > p {
+  color: #D3D4DC;
+  font-size: 14px;
+  line-height: 1.25rem;
+}
+
+.markdown .theme-admonition {
+  font-size: 14px;
+}
+
+.markdown .theme-admonition a {
+  text-decoration: none;
+}
+
+.markdown .theme-admonition a:hover {
+  text-decoration: underline;
+}
+
+.menu__link--sublist-caret:after {
+  background: var(--ifm-menu-link-sublist-icon) 50% / 1.5rem 1.5rem
+}
+
+.menu__caret:before {
+  background: var(--ifm-menu-link-sublist-icon) 50% / 1.5rem 1.5rem
+}
+
+.menu::-webkit-scrollbar-track {
+  background-color: #15192C;
+}
+
+.menu::-webkit-scrollbar-thumb {
+  background-color: #373D57;
+}