Skip to content

Commit

Permalink
Add kubestash product menu
Browse files Browse the repository at this point in the history 
Signed-off-by: mohin7 <mohin@appscode.com>
  • Loading branch information
@mohin7
mohin7 committed Jan 6, 2025
1 parent faaee1a commit 2047b1a
Show file tree
Hide file tree
Showing 7 changed files with 23,343 additions and 4,387 deletions.
11 changes: 7 additions & 4 deletions data/config.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,14 +54,17 @@
"productMenu": {
"c0": [
"kubedb",
"stash"
"kubestash"
],
"c1": [
"kubevault",
"voyager"
"stash",
"kubevault"
],
"c2": [
"configsyncer",
"voyager",
"configsyncer"
],
"c3": [
"guard"
]
},
Expand Down
1 change: 1 addition & 0 deletions hugo_stats.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -287,6 +287,7 @@
"is-paddingless-desktop",
"is-primary",
"is-pulled-right",
"is-relative",
"is-require",
"is-rounded",
"is-select-box",
Expand Down
58 changes: 57 additions & 1 deletion layouts/partials/header/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,11 @@
<img src="{{ $p.icon.src }}" alt="{{ $p.icon.alt }}" loading="lazy">
</div>
<div class="product-info">
<h2 class="is-size-6">{{ $p.name }}</h2>
<h2 class="is-size-6 is-flex">{{ $p.name }}
{{ if eq ($p.name) "KubeStash" }}
<span class="whats-new is-relative is-block" style="right: -2px; top: -12px;">New</span>
{{ end }}
</h2>
<p>{{ $p.tagline | plainify }}</p>
</div>
<div class="navigate-icon">
Expand Down Expand Up @@ -131,6 +135,27 @@ <h2 class="is-size-6">{{ $p.name }}</h2>
</a>
<!-- single product end -->
{{ end }}

{{ range $item := $.Site.Data.config.productMenu.c3 }}
{{ $p := (index $.Site.Data.products $item) }}
<!-- single product start -->
<a class="single-product"
href="{{ index $.Site.Params $p.website.domainKey}}{{ $p.website.path }}">
<div class="product-logo">
<img src="{{ $p.icon.src }}" alt="{{ $p.icon.alt }}" loading="lazy">
</div>
<div class="product-info">
<h2 class="is-size-6">{{ $p.name }}</h2>
<p>{{ $p.tagline | plainify }}</p>
</div>
<div class="navigate-icon">
<span class="icon">
<iconify-icon icon="heroicons:arrow-up-right" width="1.2rem" height="1.2rem"></iconify-icon>
</span>
</div>
</a>
<!-- single product end -->
{{ end }}
</div>
<!-- product end -->

Expand Down Expand Up @@ -205,6 +230,37 @@ <h2 class="is-size-6">{{ $p.name }}</h2>
</div>


<p>{{ $p.summary | safeHTML }}</p>

<ul class="features">
{{ range $index, $item := $p.features }}
{{ if lt $index 8 }}
<li>
<span class="icon">
<img src="/assets/images/products/appscode/icons/global/check-box.webp" alt="check-box" loading="lazy">
</span>
<span>{{ $item.title }}</span>
</li>
{{ end }}
{{ end }}
</ul>
<!-- <a href="{{ index $.Site.Params $p.website.domainKey}}{{ $p.website.path }}"
class="button ac-button inline-button">Learn More <span
class="material-icons">arrow_forward</span></a> -->
</div>
<!-- single product description end -->
{{ end }}
<!-- product description end -->

{{ range $item := $.Site.Data.config.productMenu.c3 }}
{{ $p := (index $.Site.Data.products $item) }}
<!-- single product description start -->
<div class="product-description">
<div class="brand">
<img src="{{ $p.logo.src }}" alt="{{ $p.logo.alt }}" loading="lazy">
</div>


<p>{{ $p.summary | safeHTML }}</p>

<ul class="features">
Expand Down
6 changes: 3 additions & 3 deletions layouts/partials/helpers/style-bundle.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" media="print" onload="this.media='all'">

<!-- Load custom CSS asynchronously -->
<!-- <link rel="stylesheet" href="/assets/sass/main.css"> -->
<link rel="stylesheet" href="/assets/sass/main.css">

{{ with $style := resources.Get "/assets/sass/main.css" | resources.PostCSS | resources.Minify | resources.Fingerprint }}
<!-- {{ with $style := resources.Get "/assets/sass/main.css" | resources.PostCSS | resources.Minify | resources.Fingerprint }}
<link rel="stylesheet" href="{{ $style.RelPermalink }}" />
{{ end }}
{{ end }} -->
103 changes: 51 additions & 52 deletions static/assets/sass/components/_navbar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -217,66 +217,65 @@
transition: 0.3s ease-in-out;
margin-left: 0.625rem;
}
}
}
}
}

.whats-new {
position: absolute;
z-index: 1;
top: -10px;
right: -30px;
font-size: 0.8rem;
color: $ac-white;
padding: 0.2rem 0.3rem;
line-height: 1.2;
display: none;
.whats-new {
position: absolute;
z-index: 1;
top: -10px;
right: -30px;
font-size: 0.8rem;
color: $ac-white;
padding: 0.2rem 0.3rem;
line-height: 1.2;
display: none;

&:before {
content: "";
position: absolute;
z-index: -1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 2rem;
height: 1rem;
background: $ac-primary;
border-radius: 2px;
animation: pulse-border 1500ms ease-out infinite;
}
&:before {
content: "";
position: absolute;
z-index: -1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 2rem;
height: 1rem;
background: $ac-primary;
border-radius: 2px;
animation: pulse-border 1500ms ease-out infinite;
}

&:after {
content: "";
position: absolute;
z-index: -1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 2rem;
height: 1rem;
background: $ac-primary;
transition: all 200ms;
}
&:after {
content: "";
position: absolute;
z-index: -1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 2rem;
height: 1rem;
background: $ac-primary;
transition: all 200ms;
}

@keyframes pulse-border {
0% {
transform: translateX(-50%) translateY(-50%) translateZ(0)
scale(1);
opacity: 1;
}
@keyframes pulse-border {
0% {
transform: translateX(-50%) translateY(-50%) translateZ(0)
scale(1);
opacity: 1;
}

100% {
transform: translateX(-50%) translateY(-50%) translateZ(0)
scale(1.5);
opacity: 0;
}
}
}
}
100% {
transform: translateX(-50%) translateY(-50%) translateZ(0)
scale(1.5);
opacity: 0;
}
}
}

.ac-grid-container {
max-width: 1344px;
margin: 0 auto;
Expand Down
Loading

0 comments on commit 2047b1a

Please sign in to comment.