Merge branch 'master' into fix-label

Author: vishalvivekm

.github/workflows/slack.yml

@@ -2,6 +2,8 @@ name: Slack Notify
 on: 
   watch:
     types: [started]
+  issues:
+    types: [labeled]
 jobs:
   star-notify:
     if: github.event_name == 'watch'

assets/icons/puzzle-pieces.svg

@@ -214,7 +214,8 @@
 
 .logo-container {
   width: 50px;
-  margin-right: 8px;
+  margin: auto;
+  margin-right: .65rem;
 }
 
 @media screen and (max-width: 768px) {

assets/scss/_landing_project.scss

@@ -23,7 +23,7 @@
 
   background: $primary;
   min-height: 4rem;
-  margin: 0;
+  margin: auto;
   z-index: 32;
 
   .navbar-brand {
@@ -70,12 +70,11 @@
     .td-navbar-nav-scroll {
       max-width: fit-content;
       height: 3.5rem;
-      overflow: hidden;
       font-size: 0.9rem;
     }
 
     .navbar-brand {
-      margin-right: 0;
+      // margin-right: 0;
     }
 
     .navbar-nav {

assets/scss/_nav.scss

@@ -8,9 +8,9 @@
 @import "_navbar_project.scss";
 @import "tax_project.scss";
 @import "search_project.scss";
-@import "videos.scss";
+@import "_videos_project.scss";
 @import "subscription.scss";
-@import "video-landing.scss";
+@import "_video-landing_project.scss";
 
 .navbar-dark {
   min-height: 5rem;
@@ -456,26 +456,66 @@ a:not([href]):not([class]):hover {
   }
 }
 
-figure {
+figure,
+figure[style*="width"] {
+  width: max-content !important;
+  max-width: 70% !important;
+  margin: 0 auto 2rem auto;
+
   display: flex;
   flex-direction: column;
+  align-items: center;
 
-  > img:hover { cursor: pointer; }
   > img {
-    margin: 0 auto; // Center the image
-    margin-bottom: 0px !important;
+    width: auto !important;
+    max-width: 100% !important;
+    height: auto;
+    object-fit: contain !important;
+    display: block;
+    margin: 0 auto;
     border-radius: .5rem .5rem 0rem 0rem !important;
     box-shadow: 0 0 0.5rem rgba(0, 179, 159, 0.4) !important;
+
+    &:hover {
+      cursor: pointer;
+    }
   }
-  figcaption {
-    color: $dark;
-    background-color: rgba($lightslategray, 1);
-    // font-style:italic;
+
+  > figcaption {
+    width: 100% !important;
     text-align: center;
-    margin: 0rem;
-    padding: 0 0.45 0.45 0.45rem;
+    padding: 0.5rem 1rem;
+    background-color: rgba($lightslategray, 1);
+    color: $dark;
     border-radius: 0 0 .5rem .5rem;
-    box-sizing: border-box; // Include padding in width calculation
+    box-sizing: border-box;
+  }
+}
+
+// Mobile: override for full-width content alignment
+@media (max-width: 600px) {
+  figure,
+  figure[style*="width"] {
+    max-width: 100% !important;
+    box-sizing: border-box;
+  }
+}
+
+.md__image img,
+img.md-image-responsive {
+  width: auto;
+  max-width: 70%;
+  max-height: 80vh;
+  height: auto;
+  display: block;
+  margin: 0 auto;
+  object-fit: contain;
+
+  @media (max-width: 600px) {
+    width: auto;
+    max-width: 100%;
+    padding: 0 1rem;
+    box-sizing: border-box;
   }
 }
 

assets/scss/_styles_project.scss

@@ -32,6 +32,11 @@ $body-bg: #010101;
 
 // Buttons
 $btn-line-height: 3rem;
+$btn-close-color: $white;
+// $btn-close-opacity: 1;
+// $btn-close-hover-opacity: .75;
+// $btn-close-focus-opacity: .5;
+
 
 // Lefthand sidebar with inter-page docs menu
 

assets/scss/_variables_project.scss

@@ -14,7 +14,7 @@
         border: none;
     }
     nav.scrolled {
-        background-color: #121212 !important;
+        background-color: $dark !important;
         border: 1px solid #333 !important;
     }
 }
@@ -63,6 +63,16 @@
     width: 90%;
     margin: 0 auto;
 }
+a#videoPageLink {
+    padding: 0rem;
+    color: $lightslategray;
+}
+a#videoPageLink:hover {
+    color: $casper;
+}
+a#videoPageLink:focus {
+    color: $white;
+}
 
 .hero-video-container {
     border-radius: 12px;
@@ -86,7 +96,6 @@
     align-items: center;
     justify-content: center;
     box-shadow: 0 10px 30px rgba(0, 179, 159, 0.4);
-    cursor: pointer;
     transition: all 0.3s ease;
     position: absolute;
     top: 50%;
@@ -95,25 +104,17 @@
 }
 
 .video-btn-wrapper svg {
-    width: 40px;
-    height: 40px;
+    margin-left:5px;
+    width: 50px;
+    height: 50px;
 }
 
 .play-icon-svg-path {
-    fill: #00b39f;
+    fill: $primary;
     transition: fill 0.3s ease;
 }
 
-.video-btn-wrapper:hover {
-    background-color: #00b39f;
-    .play-icon-svg-path {
-        fill: #fff;
-    }
-}
 
-.video-btn-wrapper:hover .play-icon-path {
-    fill: #fff;
-}
 
 .video-tabs-container {
     background: linear-gradient(to right top, #3d3d3d, #343434, #2b2b2b, #222222, #1a1a1a, #181818, #161616, #141414, #181818, #1c1c1c, #212121, #252525);
@@ -160,7 +161,7 @@
     display: flex;
     align-items: center;
     gap: 0.75rem;
-    flex: 0 0 auto;
+    flex: 1 0 auto;
     white-space: nowrap;
     text-decoration: none;
     display: flex;
@@ -193,12 +194,12 @@
 
 .category-tab.active {
    border-radius: 0;
-   border-bottom: 2px solid  #00b39f;
+   border-bottom: 2px solid  $primary;
    color: #fff;
 }
 
 .category-tab.active .tab-icon {
-    background-color: #00b39f;
+    background-color: $primary;
 }
 
 .category-tab.active .tab-icon i {
@@ -229,7 +230,7 @@
 }
 
 .subcategory-btn.active {
-    background-color: #00b39f;
+    background-color: $primary;
     color: #fff;
 }
 
@@ -251,6 +252,12 @@
     transform: translateY(-5px);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
     cursor: pointer;
+    .video-info h3 {
+        color: #fff;
+    }
+    p.video-description{
+        color: $casper;
+    }
 }
 
 .video-thumbnail {
@@ -316,16 +323,17 @@
     margin-bottom: 0.5rem;
     font-size: 1.1rem;
     font-weight: 600;
+    color: $casper;
 }
 
 .video-duration {
-    color: #00b39f;
+    color: $primary;
     font-size: 0.875rem;
     margin-bottom: 0.45rem;
 }
 
 .video-description {
-    color: #666;
+    color: $lightslategray;
     font-size: 0.9375rem;
     line-height: 1.5;
     margin-bottom: 0;
@@ -344,6 +352,16 @@
     z-index: 2;
 }
 
+.video-overlay:hover{
+    cursor: pointer;
+    .video-btn-wrapper {
+      background-color: $primary;
+      .play-icon-svg-path {
+          fill: #fff;
+       }
+    }  
+}
+
 .video-iframe-container {
     z-index: 1;
     display: none;

assets/scss/video-landing.scss renamed to assets/scss/_video-landing_project.scss

@@ -46,7 +46,7 @@
     margin-top: .5rem;
     font-style: italic;
   }
-  related-videos {
+  .related-videos {
     margin: 2rem 0;
 }
 .carousel-item {
@@ -77,4 +77,22 @@
 .carousel-indicators button.active {
     background-color: #fff;
     opacity: 1;
+}
+
+.yt-embed-container {
+    position: relative;
+    padding-bottom: 56.25%;
+    height: 0;
+    overflow: hidden;
+    margin: 2rem 0;
+
+    iframe {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border:0;
+    }
+
 }

assets/scss/_videos.scss renamed to assets/scss/_videos_project.scss

@@ -1 +1 @@
-v0.8.211
+v0.8.213

build/meshery-cloud.version

@@ -1 +1 @@
-v0.8.66-1
+v0.8.74-1

build/meshery-extensions.version

@@ -47,6 +47,26 @@ entries:
     - charts/kratos-0.39.1.tgz
     version: 0.39.1
   layer5-cloud:
+  - apiVersion: v2
+    appVersion: v0.8.213
+    created: "2025-05-06T15:46:54.200583596Z"
+    dependencies:
+    - condition: kratos.enabled
+      name: kratos
+      repository: '@ory'
+      version: 0.39.1
+    - condition: ory/hydra.enabled
+      name: hydra
+      repository: '@ory'
+      version: 0.24.2
+    description: Layer5 Cloud is a collection of services that can be deployed on-premises.
+    digest: 9f05174f3f0336b0ec3b77173bd7e81274df451db828a50d6042fd9157fdba25
+    icon: data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNDEuNzMgMTQxLjczIj48dGl0bGU+NS1saWdodC1iZzwvdGl0bGU+PHJlY3QgaWQ9Il9QYXRoXyIgZGF0YS1uYW1lPSImbHQ7UGF0aCZndDsiIHg9Ijc5LjYzIiB5PSIyMy45NyIgd2lkdGg9IjM2LjkzIiBoZWlnaHQ9IjE3Ljc5IiBzdHlsZT0iZmlsbDojMDBiMzlmIi8+PHBhdGggaWQ9Il9QYXRoXzIiIGRhdGEtbmFtZT0iJmx0O1BhdGgmZ3Q7IiBkPSJNMTE5LjkyLDgzLjlWNzYuNTNjMC04LjQ5LTcuMTQtMTUuMzctMTUuOTQtMTUuMzdINDQuMzhWNTYuMzFIMjIuNTZ2MjFIOTguMVY4My45WiIgc3R5bGU9ImZpbGw6IzAwYjM5ZiIvPjxwb2x5Z29uIGlkPSJfUGF0aF8zIiBkYXRhLW5hbWU9IiZsdDtQYXRoJmd0OyIgcG9pbnRzPSI0NC4zOCA1MC41IDQ0LjM4IDQxLjc2IDczLjYgNDEuNzYgNzMuNiAyMy45NyAyMi41NiAyMy45NyAyMi41NiA1MC41IDQ0LjM4IDUwLjUiIHN0eWxlPSJmaWxsOiMwMGQzYTkiLz48cGF0aCBpZD0iX1BhdGhfNCIgZGF0YS1uYW1lPSImbHQ7UGF0aCZndDsiIGQ9Ik05OC4xLDg5LjYyVjEwMEg2OC44OHYxNy43OWgzNmExNC43NywxNC43NywwLDAsMCwxNS0xNC40OVY4OS42MloiIHN0eWxlPSJmaWxsOiMwMGQzYTkiLz48cGF0aCBpZD0iX1BhdGhfNSIgZGF0YS1uYW1lPSImbHQ7UGF0aCZndDsiIGQ9Ik00Mi42Myw5MC41OFYxMDBINjIuODV2MTcuNzloLTI2YTE0Ljc3LDE0Ljc3LDAsMCwxLTE1LTE0LjQ5VjkwLjU4WiIgc3R5bGU9ImZpbGw6IzAwYjM5ZiIvPjwvc3ZnPg==
+    name: layer5-cloud
+    type: application
+    urls:
+    - https://docs.layer5.io/charts/layer5-cloud-v0.8.213.tgz
+    version: v0.8.213
   - apiVersion: v2
     appVersion: v0.8.210
     created: "2025-04-30T03:24:31.30744298Z"
@@ -5307,4 +5327,4 @@ entries:
     urls:
     - https://docs.layer5.io/charts/layer5-cloud-0.1.0.tgz
     version: 0.1.0
-generated: "2025-04-30T03:24:31.298980961Z"
+generated: "2025-05-06T15:46:54.194293429Z"

charts/index.yaml

@@ -21,8 +21,8 @@ onmouseover="changeImage('layer5', 'images/logos/layer5-light.svg')" onmouseout=
     <i class="fas fa-arrow-alt-circle-right ms-2"></i>
 </a>
 <a class="btn btn-lg btn-primary me-3 mb-4 l5btn" href="/kanvas" aria-label="Kanvas Docs"
-onmouseover="changeImage('Kanvas', 'images/logos/kanvas-light.svg')" onmouseout="restoreImage('Kanvas', 'images/logos/kanvas-alt.svg')">
-    <img id="Kanvas" src="images/logos/kanvas-alt.svg" alt="Layer5 Kanvas Docs Logo" />
+onmouseover="changeImage('Kanvas', 'images/logos/kanvas-light.svg')" onmouseout="restoreImage('Kanvas', 'images/logos/kanvas-icon-color.svg')">
+    <img id="Kanvas" src="images/logos/kanvas-icon-color.svg" alt="Layer5 Kanvas Docs Logo" />
     Kanvas Docs
     <i class="fas fa-arrow-alt-circle-right ms-2"></i>
 </a>