x
1
2
3
4
5
6
7
8
9
10
11
12
13
<div data-view-component="true" class="op-ee-banner"> <div style="grid-area: icon-container" data-view-component="true" class="op-ee-banner--icon-container"> <div class="op-ee-banner--shield"><svg aria-hidden="true" height="24" viewBox="0 0 16 16" version="1.1" width="24" data-view-component="true" class="octicon octicon-op-enterprise-addons op-ee-banner--icon"> <path d="M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16ZM6.343 7.14c-.109 0-.186.114-.152.226L7.84 12.88c.048.16.258.16.306 0l1.649-5.514c.034-.112-.043-.226-.152-.226Zm-3.182 0c-.133 0-.208.163-.128.277l3.684 5.224c.108.153.332.031.281-.153L5.569 7.264a.161.161 0 0 0-.153-.124Zm7.383 0a.162.162 0 0 0-.154.124l-1.429 5.224c-.05.184.174.306.281.153l3.684-5.224c.081-.114.005-.277-.127-.277ZM6.96 4a.162.162 0 0 0-.152.119l-.616 2.016c-.034.112.043.227.153.227h3.291c.111 0 .188-.118.151-.231l-.661-2.016A.162.162 0 0 0 8.975 4ZM4.345 4a.157.157 0 0 0-.138.086L3.112 6.102c-.062.115.015.26.138.26h2.171a.161.161 0 0 0 .151-.117l.639-2.016C6.246 4.117 6.169 4 6.059 4Zm5.664 0c-.11 0-.188.118-.151.23l.662 2.017a.16.16 0 0 0 .151.115h2.169c.124 0 .201-.146.137-.262L11.86 4.084A.16.16 0 0 0 11.722 4Z"></path> </svg></div> </div> <div style="grid-area: title-container" data-view-component="true" class="op-ee-banner--title-container"><span data-view-component="true">Enterprise add-on</span></div> <div style="grid-area: description-container" data-view-component="true" class="op-ee-banner--description-container"><span data-view-component="true">Create and organize different project stages and gates than the ones provided by PM2 project cycle planning.</span></div> <div style="grid-area: link-container" data-view-component="true" class="op-ee-banner--link-container"><a href="https://www.openproject.org/enterprise-edition" data-view-component="true" class="Link"><span data-view-component="true" class="Link-content">More information <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg></span></a></div></div>
The easiest way to render the banner component is to provide a feature key and have the assorted data structures match the expectations. The text will be fetched from the i18n files:
en: ee: # Title used unless it is overwritten for the specific feature title: "Enterprise add-on" # Title of the link used unless it is overwritten for the specific feature link_title: "More information" upsale: [feature_key]: # Title used for this feature only. If this is missing, the default title is used. title: "A splendid feature" # Could also be description_html if necessary description: "This is a splendid feature that you should use. It just might transform your life." # Title of the link used for this feature only. If this is missing, the default link title is used. title_link: "Even more information"
The href is inferred from OpenProject::Static::Links.enterprise_docs[feature_key][:href]
.
The value of EnterpriseToken.show_banners?
is used to determine whether the banner should be shown. For this
example, that value is overwritten as the banner might otherwise not show up in the preview.
1
2
3
4
5
render( ::EnterpriseEdition::BannerComponent .new(:customize_life_cycle, skip_render: false))
No params configured.