From f2e34f3fd656848917a7e313f092160f04d6a83c Mon Sep 17 00:00:00 2001
From: dobromirts <dobromir.ts@gmail.com>
Date: Mon, 15 Apr 2024 13:40:52 +0300
Subject: [PATCH] Update appbuilder theme font styles and fixes

---
 src/app/services/rendering/article.ts |  4 ++--
 src/styles/appbuilder/_variables.scss | 15 ++++++---------
 src/styles/appbuilder/main.scss       | 20 ++++++--------------
 3 files changed, 14 insertions(+), 25 deletions(-)

diff --git a/src/app/services/rendering/article.ts b/src/app/services/rendering/article.ts
index c6c882e..a3419a0 100644
--- a/src/app/services/rendering/article.ts
+++ b/src/app/services/rendering/article.ts
@@ -341,7 +341,7 @@ export class ArticleRenderingService extends RenderingService {
             imagePath = languageVersion === 'en' ? INDIGO_DESIGN_CTA_BANNER : JP_INDIGO_DESIGN_CTA_BANNER;
         } else if (productLink.includes("appbuilder")) {
             action = 'Learn More';
-            productLink = "https://www.infragistics.com/products/appbuilder";
+            productLink = "https://www.appbuilder.dev/help";
             imagePath = languageVersion === 'en' ? APP_BUILDER_CTA_BANNER : JP_APP_BUILDER_CTA_BANNER;
         } else if (productLink.includes("web-components")) {
             imagePath = languageVersion === 'en' ? WEB_COPONENTS_CTA_BANNER : JP_WEB_COPONENTS_CTA_BANNER;
@@ -360,7 +360,7 @@ export class ArticleRenderingService extends RenderingService {
 
             if ($(".article-container h2")[4]){
                 const builderImagePath = languageVersion === 'en' ? APP_BUILDER_CTA_BANNER : JP_APP_BUILDER_CTA_BANNER;
-                const аppbuilderLink = 'https://www.infragistics.com/products/appbuilder';
+                const аppbuilderLink = 'https://www.appbuilder.dev/help';
                 action = 'Learn More';
                 this.appendBanner(4, аppbuilderLink, builderImagePath, action, 'App Builder | CTA Banner');
             }
diff --git a/src/styles/appbuilder/_variables.scss b/src/styles/appbuilder/_variables.scss
index f54e6ce..e9a9e7a 100644
--- a/src/styles/appbuilder/_variables.scss
+++ b/src/styles/appbuilder/_variables.scss
@@ -15,23 +15,20 @@ $text-dim-light: #ddd;
 $black: #000;
 $text-dark: #222;
 $title-color: $text-base;
-  
-// Toc
-$toc-font-size: rem(14px);
 
 // h1
-$h1-f-family: "Figtree", sans-serif;
-$h1-f-size: 56px;
+$h2-f-family: "Figtree", sans-serif;
+$h1-f-size: 36px;
 $h1-f-weight: bold;
-$h1-l-height: 56px;
+$h1-l-height: 42px;
 $h1-m-top: 36px;
 $h1-m-bottom: 30px;
 
 // h2
 $h2-f-family: "Figtree", sans-serif;
-$h2-f-size: 48px;
+$h2-f-size: 28px;
 $h2-f-weight: bold;
-$h2-l-height: 55px;
+$h2-l-height: 36px;
 $h2-m-top: 36px;
 $h2-m-bottom: 16px;
 
@@ -49,5 +46,5 @@ $h6-f-family: "Figtree", sans-serif;
 $h6-f-weight: normal;
 
 // Paragraph
-$p-l-height: 30px;
+$p-l-height: 1.5rem;
 $p-m-bottom: 1.5rem;
\ No newline at end of file
diff --git a/src/styles/appbuilder/main.scss b/src/styles/appbuilder/main.scss
index 616cbdb..4f572e2 100644
--- a/src/styles/appbuilder/main.scss
+++ b/src/styles/appbuilder/main.scss
@@ -14,7 +14,7 @@
   }
 }
 
-@media only screen and (min-width: 1281px) {
+@media only screen and (min-width: 1200px) {
     .mega-sticky-wrapper{
       height: 120px !important;
     }
@@ -23,7 +23,7 @@
     }
 }
 
-@media only screen and (max-width: 1281px) {
+@media only screen and (max-width: 1200px) {
   .mega-sticky-wrapper{
     height: unset !important;
   }
@@ -32,7 +32,7 @@
   }
 }
 
-@media only screen and (max-width: 1281px) {
+@media only screen and (max-width: 1200px) {
   #main{
       padding-top: rem(16px);
   }
@@ -47,7 +47,7 @@
   margin-top: unset;
 }
 
-@media only screen and (max-width: 1281px) {
+@media only screen and (max-width: 1200px) {
   .w-m-100 {
     width: 100% !important;
     padding-left: rem(16px) !important;
@@ -55,15 +55,7 @@
   }
 }
 
-.anchorjs-link {
-  font-size: rem(26px);
-}
-
 .affix ul > li > a {
-	font-size: rem(14px) !important;
-}
-
-.sidenav__header {
   font-size: rem(14px) !important;
 }
 
@@ -91,6 +83,6 @@
   text-align: center !important;
 }
 
-p {
-  font-size: rem(20px); 
+p, article > ol, article > ul, article ul ul {
+  font-size: rem(16px);
 }