diff --git a/packages/webawesome/docs/_includes/_dialog-wa-launch.njk b/packages/webawesome/docs/_includes/_dialog-wa-launch.njk new file mode 100644 index 000000000..8ecb35a4e --- /dev/null +++ b/packages/webawesome/docs/_includes/_dialog-wa-launch.njk @@ -0,0 +1,97 @@ + + +
+ + +
+ +
+

Celebrate our official launch with a 20% discount on a Web Awesome Pro plan…for life! But hurry, this lifetime discount is only available for a limited time.

+ + +
+
+ + + diff --git a/packages/webawesome/docs/_includes/base.njk b/packages/webawesome/docs/_includes/base.njk index ebab009ef..96b6f1094 100644 --- a/packages/webawesome/docs/_includes/base.njk +++ b/packages/webawesome/docs/_includes/base.njk @@ -1,6 +1,7 @@ {% if hasAnchors == undefined %}{% set hasAnchors = true %}{% endif %} {% if hasBanner == undefined %}{% set hasBanner = true %}{% endif %} +{% if hasSiteDialog == undefined %}{% set hasSiteDialog = true %}{% endif %} {% if hasGeneratedTitle == undefined %}{% set hasGeneratedTitle = true %}{% endif %} @@ -136,6 +137,15 @@ {% include 'search.njk' %} + {#- Site-Wide Dialog -#} + {% if hasSiteDialog %} + {% raw %} + {%- if not currentUser.hasPro -%} + {% include "_dialog-wa-launch.njk" ignore missing %} + {%- endif -%} + {% endraw %} + {% endif %} + {# Footer #} {% block pageFooter %}{% endblock %} diff --git a/packages/webawesome/docs/assets/styles/docs.css b/packages/webawesome/docs/assets/styles/docs.css index 43b7e60ae..914a77783 100644 --- a/packages/webawesome/docs/assets/styles/docs.css +++ b/packages/webawesome/docs/assets/styles/docs.css @@ -64,6 +64,24 @@ wa-page > [slot='banner'] { } } +/* Site-Wide Dialog */ +#dialog-site { + /* custom brand colors carrried over from theme-site for the banner */ + --wa-color-brand-95: #fef0ec; + --wa-color-brand-90: #fce0d8; + --wa-color-brand-80: #f8bcac; + --wa-color-brand-70: #fa9378; + --wa-color-brand-60: #f46a45; + --wa-color-brand-50: #cb4b27; + --wa-color-brand-40: #9d371a; + --wa-color-brand-30: #7c2a13; + --wa-color-brand-20: #5d1d0b; + --wa-color-brand-10: #3b0f05; + --wa-color-brand-05: #270802; + --wa-color-brand: var(--wa-color-brand-60); + --wa-color-brand-on: var(--wa-color-brand-10); +} + /* Header */ wa-page::part(header) { background-color: var(--wa-color-surface-default);