393 lines
20 KiB
HTML
393 lines
20 KiB
HTML
<section class="content cloud-overview">
|
|
<p>{{ .Params.description }}</p>
|
|
|
|
<section class="get-started">
|
|
<div class="col">
|
|
{{ $get_started_guide := .Params.get_started_guide }}
|
|
<a href="{{ $get_started_guide.link }}">
|
|
<div class="card get-started-card">
|
|
<div class="heading">
|
|
{{ if eq $get_started_guide.icon "azure" }}
|
|
<div class="icon icon-78-24 icon-get-started {{ $get_started_guide.icon }}-78-24"></div>
|
|
{{ else }}
|
|
<div class="icon icon-35-35 icon-get-started {{ $get_started_guide.icon }}-35-35"></div>
|
|
{{ end }}
|
|
<p>Get started</p>
|
|
</div>
|
|
<div class="icon icon-24-24 icon-get-started-arrow right-arrow-gray"></div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="providers">
|
|
<div class="col">
|
|
<h2 id="providers">Providers</h2>
|
|
<p>{{ .Params.providers.description }}</p>
|
|
<div class="row cols-2">
|
|
{{ $num_of_providers := .Params.providers.provider_list }}
|
|
{{ range $index, $provider := $num_of_providers }}
|
|
{{ $card_background := "" }}
|
|
{{ if eq $index 0 }}
|
|
{{ $card_background = "card-gradient" }}
|
|
{{ end }}
|
|
<div class="card provider-card col {{ $card_background }}">
|
|
<div class="heading provider-heading">
|
|
{{ $display_name := $provider.display_name }}
|
|
{{ $first_half_name := $provider.display_name }}
|
|
{{ $second_half_name := "" }}
|
|
{{ if strings.Contains $display_name "Classic" }}
|
|
{{ $first_half_name = strings.TrimRight "Classic" $display_name }}
|
|
{{ $second_half_name = "Classic" }}
|
|
{{ else if strings.Contains $display_name "Native" }}
|
|
{{ $first_half_name = strings.TrimRight "Native" $display_name }}
|
|
{{ $second_half_name = " Native" }}
|
|
{{ end }}
|
|
<p>{{ $first_half_name }}<strong>{{ $second_half_name }}</strong></p>
|
|
{{ if $provider.public_preview }}
|
|
<p class="provider-label preview">Preview</p>
|
|
{{ else if $provider.recommended }}
|
|
<p class="provider-label recommended">Recommended</p>
|
|
{{ end }}
|
|
</div>
|
|
{{ if ge (len $num_of_providers) 2 }}
|
|
<div class="col">
|
|
{{ range $content_link := $provider.content_links }}
|
|
<a href="/registry/packages/{{ $content_link.url }}">
|
|
<div class="card content-link">
|
|
<div class="heading">
|
|
<div class="icon icon-18-18 icon-left-of-card-label {{ $content_link.icon }}"></div>
|
|
<p class="content-name">{{ $content_link.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
{{ end }}
|
|
</div>
|
|
{{ else }}
|
|
<div class="flex">
|
|
{{ range $content_link := $provider.content_links }}
|
|
<div class="flex-2-col">
|
|
<a href="/registry/packages/{{ $content_link.url }}">
|
|
<div class="card content-link">
|
|
<div class="heading">
|
|
<div class="icon icon-18-18 icon-left-of-card-label {{ $content_link.icon }}"></div>
|
|
<p class="content-name">{{ $content_link.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="templates card-outer card-gradient">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="templates">Templates</h2>
|
|
<div class="icon icon-24-24 icon-right-of-heading ruler-triangle-gray"></div>
|
|
</div>
|
|
<p>
|
|
Pulumi templates are the fastest way to deploy infrastructure. After deploying, you can easily modify the infrastructure by updating the code in your language of
|
|
choice.
|
|
</p>
|
|
<div class="flex">
|
|
{{ range $index, $template := .Params.templates }}
|
|
{{ if le $index 3 }}
|
|
<div class="flex-2-col">
|
|
<a href="/templates/{{ $template.url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $template.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ if ge (len .Params.templates) 5 }}
|
|
<div id="accordion-templates" class="accordion flex-1-col">
|
|
<div>
|
|
<input type="checkbox" id="accordion-checkbox-templates" />
|
|
<div class="accordion-content flex">
|
|
{{ range $index, $template := .Params.templates }}
|
|
{{ if ge $index 4 }}
|
|
<div class="flex-2-col">
|
|
{{ $url := print "/templates/" $template.url }}
|
|
<a href="{{ $url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $template.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
<label for="accordion-checkbox-templates" class="show">
|
|
Show {{ sub (len .Params.templates) 4 }} more
|
|
<div class="icon icon-16-16 keyboard-arrow-down-gray"></div>
|
|
</label>
|
|
<label for="accordion-checkbox-templates" class="hide">
|
|
Show {{ sub (len .Params.templates) 4 }} less
|
|
<div class="icon icon-16-16 keyboard-arrow-up-gray"></div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
<section class="components card-outer card-gradient">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="components">Components</h2>
|
|
<div class="icon icon-24-24 icon-right-of-heading puzzle-piece-gray"></div>
|
|
</div>
|
|
<p>Components support all languages and group a set of resources together.</p>
|
|
<div class="flex">
|
|
{{ range $index, $component := .Params.components }}
|
|
{{ if le $index 3 }}
|
|
<div class="flex-2-col">
|
|
{{ $url := print "/registry/packages/" $component.url }}
|
|
{{ if $component.external_link }}
|
|
{{ $url = $component.url }}
|
|
{{ end }}
|
|
<a href="{{ $url }}">
|
|
<div class="card-inner col">
|
|
<p>{{ $component.display_name }}</p>
|
|
{{ if $component.description }}
|
|
<p class="inner-card-description">{{ $component.description }}</p>
|
|
{{ end }}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ if ge (len .Params.components) 5 }}
|
|
<div id="accordion-components" class="accordion flex-1-col">
|
|
<div>
|
|
<input type="checkbox" id="accordion-checkbox-components" />
|
|
<div class="accordion-content flex">
|
|
{{ range $index, $component := .Params.components }}
|
|
{{ if ge $index 4 }}
|
|
<div class="flex-2-col">
|
|
{{ $url := print "/registry/packages/" $component.url }}
|
|
{{ if $component.link_outside_registry }}
|
|
{{ $url = $component.url }}
|
|
{{ end }}
|
|
<a href="{{ $url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $component.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
<label for="accordion-checkbox-components" class="show">
|
|
Show {{ sub (len .Params.components) 4 }} more
|
|
<div class="icon icon-16-16 keyboard-arrow-down-gray"></div>
|
|
</label>
|
|
<label for="accordion-checkbox-components" class="hide">
|
|
Show {{ sub (len .Params.components) 4 }} less
|
|
<div class="icon icon-16-16 keyboard-arrow-up-gray"></div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
|
|
{{ if .Params.convert }}
|
|
{{ range $convert := .Params.convert }}
|
|
{{ $tools := $convert.tools }}
|
|
{{ if not $tools }}
|
|
<a href="{{ $convert.url }}">
|
|
<section class="convert card-outer card-outer-hover">
|
|
<div class="card-heading card-heading-2">
|
|
<div class="heading">
|
|
<div class="icon icon-21-21 icon-left-of-heading recycle-gray-21-21"></div>
|
|
<h2 id="{{ urlize $convert.heading }}">{{ $convert.heading }}</h2>
|
|
</div>
|
|
<div class="icon icon-24-24 icon-right-of-heading right-arrow-gray"></div>
|
|
</div>
|
|
<p>
|
|
{{ $convert.description }}
|
|
</p>
|
|
</section>
|
|
</a>
|
|
{{ else }}
|
|
<section class="converters card-outer">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="{{ urlize $convert.heading }}">{{ $convert.heading }}</h2>
|
|
<div class="icon icon-24-24 icon-right-of-heading recycle-gray-24-24"></div>
|
|
</div>
|
|
<p>{{ $convert.description }}</p>
|
|
<div class="flex">
|
|
{{ range $converter := $tools }}
|
|
<div class="flex-2-col">
|
|
<a href="{{ $converter.url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $converter.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ end }}
|
|
|
|
{{ $guides := .Params.guides }}
|
|
{{ if $guides }}
|
|
<section class="guides card-outer card-gradient">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="guides">Guides</h2>
|
|
<div class="icon icon-24-24 icon-right-of-heading question-medium-gray"></div>
|
|
</div>
|
|
<p>
|
|
{{ $guides.description }}
|
|
</p>
|
|
<div class="col">
|
|
{{ range $index, $guide := $guides.guides_list }}
|
|
{{ if le $index 3 }}
|
|
<div class="row">
|
|
<a href="{{ $guide.url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $guide.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ if ge (len $guides.guides_list ) 5 }}
|
|
<div id="accordion-guides" class="accordion flex-1-col">
|
|
<div>
|
|
<input type="checkbox" id="accordion-checkbox-guides" />
|
|
<div class="accordion-content flex">
|
|
{{ range $index, $guide := $guides.guides_list }}
|
|
{{ if ge $index 4 }}
|
|
<div class="flex-1-col">
|
|
<a href="{{ $guide.url }}">
|
|
<div class="card-inner">
|
|
<div>
|
|
<p>{{ $guide.display_name }}</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
<label for="accordion-checkbox-guides" class="show">
|
|
Show {{ sub (len $guides.guides_list) 4 }} more
|
|
<div class="icon icon-16-16 keyboard-arrow-down-gray"></div>
|
|
</label>
|
|
<label for="accordion-checkbox-guides" class="hide">
|
|
Show {{ sub (len $guides.guides_list) 4 }} less
|
|
<div class="icon icon-16-16 keyboard-arrow-up-gray"></div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
{{ end }}
|
|
|
|
{{ $policy := .Params.policy }}
|
|
{{ if $policy }}
|
|
<a href="/docs/using-pulumi/crossguard/{{ $policy.url }}">
|
|
<section class="policies card-outer card-outer-hover">
|
|
<div class="card-heading card-heading-2">
|
|
<div class="heading">
|
|
<div class="icon icon-21-21 icon-left-of-heading badge-gray"></div>
|
|
<h2 id="policies">Policies</h2>
|
|
</div>
|
|
<div class="icon icon-24-24 icon-right-of-heading right-arrow-gray"></div>
|
|
</div>
|
|
<p>
|
|
{{ $policy.description }}
|
|
</p>
|
|
</section>
|
|
</a>
|
|
{{ end }}
|
|
|
|
{{ $cluster_management := .Params.kubernetes_cluster_management }}
|
|
{{ if $cluster_management }}
|
|
<section class="card-outer">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="{{ urlize $cluster_management.heading }}">{{ $cluster_management.heading }}</h2>
|
|
</div>
|
|
<p>{{ $cluster_management.description }}</p>
|
|
<div class="flex">
|
|
{{ range $link := $cluster_management.links }}
|
|
<div class="flex-2-col">
|
|
{{ $link_target := "" }}
|
|
{{ if $link.external_link }}
|
|
{{ $link_target = "_blank" }}
|
|
{{ end }}
|
|
<a href="{{ $link.url }}" target="{{ $link_target }}">
|
|
<div class="card-inner">
|
|
<div class="card-inner-content-1">
|
|
{{ if eq $link.icon "azure" }}
|
|
<div class="icon icon-52-16 icon-left-of-card-label {{ $link.icon }}-52-16"></div>
|
|
{{ else }}
|
|
<div class="icon icon-18-18 icon-left-of-card-label {{ $link.icon }}-18-18"></div>
|
|
{{ end }}
|
|
<p>{{ $link.display_name }}</p>
|
|
</div>
|
|
{{ if $link.has_arrow }}
|
|
<div class="icon icon-24-24 icon-right-of-heading right-arrow-gray"></div>
|
|
{{ end }}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
{{ end }}
|
|
|
|
{{ $operator := .Params.kubernetes_operator }}
|
|
{{ if $operator }}
|
|
<section class="card-outer">
|
|
<div class="card-heading card-heading-1">
|
|
<h2 id="{{ urlize $operator.heading }}">{{ $operator.heading }}</h2>
|
|
</div>
|
|
<p>{{ $operator.description_1 }}</p>
|
|
<p>{{ $operator.description_2 }}</p>
|
|
<div class="col">
|
|
{{ range $link := $operator.links }}
|
|
<div class="row">
|
|
{{ $link_target := "" }}
|
|
{{ if $link.external_link }}
|
|
{{ $link_target = "_blank" }}
|
|
{{ end }}
|
|
|
|
|
|
<a href="{{ $link.url }}" target="{{ $link_target }}">
|
|
<div class="card-inner">
|
|
<div class="card-inner-content-1">
|
|
<div class="icon icon-18-18 icon-left-of-card-label {{ $link.icon }}"></div>
|
|
<p>{{ $link.display_name }}</p>
|
|
</div>
|
|
{{ if $link.has_arrow }}
|
|
<div class="icon icon-24-24 icon-right-of-heading right-arrow-gray"></div>
|
|
{{ end }}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
{{ end }}
|
|
</section>
|