From a23881e62ccca84ce0d334b9812fc32aa5594f40 Mon Sep 17 00:00:00 2001
From: hunicus <93150691+hunicus@users.noreply.github.com>
Date: Fri, 11 Aug 2023 17:11:05 +0900
Subject: [PATCH] Implement enterprise cta in docs [desktop]

---
 .../docs/api-docs/api-docs-nav.component.html    |  4 ++++
 .../docs/api-docs/api-docs-nav.component.scss    | 16 ++++++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/frontend/src/app/docs/api-docs/api-docs-nav.component.html b/frontend/src/app/docs/api-docs/api-docs-nav.component.html
index ec1cde38f..8d17faf4e 100644
--- a/frontend/src/app/docs/api-docs/api-docs-nav.component.html
+++ b/frontend/src/app/docs/api-docs/api-docs-nav.component.html
@@ -1,3 +1,7 @@
+<div id="enterprise-cta-desktop">
+  <p>Get higher API limits with Mempool Enterprise</p>
+  <a class="btn btn-small btn-purple" href="/enterprise">More Info <fa-icon [icon]="['fas', 'angle-right']" [styles]="{'font-size': '12px'}"></fa-icon></a>
+</div>
 <div *ngFor="let item of tabData">
   <p *ngIf="( item.type === 'category' ) && ( item.showConditions.indexOf(network.val) > -1 )">{{ item.title }}</p>
   <a *ngIf="( item.type !== 'category' ) && ( item.showConditions.indexOf(network.val) > -1 ) && ( !item.hasOwnProperty('options') || ( item.hasOwnProperty('options') && item.options.hasOwnProperty('officialOnly') && item.options.officialOnly && officialMempoolInstance ) || ( item.hasOwnProperty('options') && item.options.hasOwnProperty('auditOnly') && item.options.auditOnly && auditEnabled ) )" [routerLink]="['./']" fragment="{{ item.fragment }}" (click)="navLinkClick($event)">{{ item.title }}</a>
diff --git a/frontend/src/app/docs/api-docs/api-docs-nav.component.scss b/frontend/src/app/docs/api-docs/api-docs-nav.component.scss
index 3d1b17324..cee9cba14 100644
--- a/frontend/src/app/docs/api-docs/api-docs-nav.component.scss
+++ b/frontend/src/app/docs/api-docs/api-docs-nav.component.scss
@@ -11,3 +11,19 @@ a {
   display: block;
   margin: 5px 0;
 }
+
+#enterprise-cta-desktop {
+  text-align: center;
+  padding: 20px;
+  margin: 20px 20px 20px 0;
+  background-color: #1d1f31;
+  border-radius: 12px;
+}
+
+#enterprise-cta-desktop p {
+  margin: 0 auto 20px auto;
+}
+
+#enterprise-cta-desktop a {
+  display: inline-block;
+}