diff --git a/app/_assets/stylesheets/sidebar.less b/app/_assets/stylesheets/sidebar.less index 213c5a9fcd23..920dac3408d9 100644 --- a/app/_assets/stylesheets/sidebar.less +++ b/app/_assets/stylesheets/sidebar.less @@ -228,3 +228,31 @@ } } } + +.sidebar-button { + flex-shrink: 0; + height: auto; + padding: 8px 16px; + border: 1px solid #1155cb; + background: none; + box-sizing: border-box; + border-radius: 4px; + font-family: Roboto; + font-weight: 500; + font-size: 16px; + line-height: 22px; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out; + color: #1155cb; + display: block; + width: 100%; + text-align: center; +} + +.sidebar-button#konnect-cta { + margin-top: 20px; + &:hover { + background-color: #1155cb; + border-color: #fff; + color: #fff; + } +} \ No newline at end of file diff --git a/app/_includes/plugins/sidebar.html b/app/_includes/plugins/sidebar.html index 628046205247..860050bccf08 100644 --- a/app/_includes/plugins/sidebar.html +++ b/app/_includes/plugins/sidebar.html @@ -13,5 +13,13 @@ {% for item in include.sidenav.nav_items %} {% include_cached sidebar/item.html item=item id=forloop.index %} {% endfor %} + {% if page.extn_publisher == "kong-inc" %} +
  • + + Try it in {{site.konnect_short_name}} + +
  • + {% endif %} + diff --git a/app/_layouts/extension.html b/app/_layouts/extension.html index 397f1f1e352f..298d8e3b63b5 100644 --- a/app/_layouts/extension.html +++ b/app/_layouts/extension.html @@ -13,19 +13,6 @@ {% endunless %} -{% unless page.free %} - {% if page.extn_publisher == "kong-inc" %} - {% if page.paid or page.premium %} - - {% endif %} - {% endif %} -{% endunless %} - - {% unless page.extn_publisher == "kong-inc" %} {% if page.techpartner %}
    diff --git a/spec/templates/plugin_with_versions_spec.rb b/spec/templates/plugin_with_versions_spec.rb index 9cbd06cec56e..55edb49afb49 100644 --- a/spec/templates/plugin_with_versions_spec.rb +++ b/spec/templates/plugin_with_versions_spec.rb @@ -54,10 +54,8 @@ expect(nested_how_tos).to have_css('.sidebar-item', text: 'Nested Tutorial Nav title with Min and Max') end - context 'plugins that are `paid` or `premium`' do - it 'renders a banner for using the plugins in Konnect' do - expect(html).to have_css('blockquote', text: 'Did you know that you can try this plugin without talking to anyone') - end + it 'renders a Konnect CTA button' do + expect(html).to have_css('.sidebar-button', text: 'Try it in Konnect') end end end