leecalcote/blog/v08 announcement

.ruby-version

@@ -1 +1 @@
-3.2.2
+3.2.6

Gemfile.lock

@@ -10,15 +10,28 @@ GEM
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
+    ffi (1.17.0)
+    ffi (1.17.0-aarch64-linux-gnu)
+    ffi (1.17.0-aarch64-linux-musl)
+    ffi (1.17.0-arm-linux-gnu)
+    ffi (1.17.0-arm-linux-musl)
     ffi (1.17.0-arm64-darwin)
-    ffi (1.17.0-x64-mingw-ucrt)
+    ffi (1.17.0-x86-linux-gnu)
+    ffi (1.17.0-x86-linux-musl)
     ffi (1.17.0-x86_64-darwin)
     ffi (1.17.0-x86_64-linux-gnu)
+    ffi (1.17.0-x86_64-linux-musl)
     forwardable-extended (2.6.0)
+    google-protobuf (4.29.1)
+      bigdecimal
+      rake (>= 13)
+    google-protobuf (4.29.1-aarch64-linux)
+      bigdecimal
+      rake (>= 13)
     google-protobuf (4.29.1-arm64-darwin)
       bigdecimal
       rake (>= 13)
-    google-protobuf (4.29.1-x64-mingw-ucrt)
+    google-protobuf (4.29.1-x86-linux)
       bigdecimal
       rake (>= 13)
     google-protobuf (4.29.1-x86_64-darwin)
@@ -80,33 +93,90 @@ GEM
     rb-fsevent (0.11.2)
     rb-inotify (0.11.1)
       ffi (~> 1.0)
-    rexml (3.3.9)
+    rexml (3.4.0)
     rouge (4.5.1)
     safe_yaml (1.0.5)
-    sass-embedded (1.82.0-arm64-darwin)
+    sass-embedded (1.83.0)
+      google-protobuf (~> 4.28)
+      rake (>= 13)
+    sass-embedded (1.83.0-aarch64-linux-android)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-aarch64-linux-gnu)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-aarch64-linux-musl)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-aarch64-mingw-ucrt)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-arm-linux-androideabi)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-arm-linux-gnueabihf)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-arm-linux-musleabihf)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-arm64-darwin)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-riscv64-linux-android)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-riscv64-linux-gnu)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-riscv64-linux-musl)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86-cygwin)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86-linux-android)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86-linux-gnu)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86-linux-musl)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86-mingw-ucrt)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86_64-cygwin)
+      google-protobuf (~> 4.28)
+    sass-embedded (1.83.0-x86_64-darwin)
       google-protobuf (~> 4.28)
-    sass-embedded (1.82.0-x64-mingw-ucrt)
+    sass-embedded (1.83.0-x86_64-linux-android)
       google-protobuf (~> 4.28)
-    sass-embedded (1.82.0-x86_64-darwin)
+    sass-embedded (1.83.0-x86_64-linux-gnu)
       google-protobuf (~> 4.28)
-    sass-embedded (1.82.0-x86_64-linux-gnu)
+    sass-embedded (1.83.0-x86_64-linux-musl)
       google-protobuf (~> 4.28)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
-    tzinfo-data (1.2024.1)
-      tzinfo (>= 1.0.0)
     unicode-display_width (2.6.0)
     wdm (0.2.0)
     webrick (1.9.1)
 
 PLATFORMS
-  arm64-darwin-22
-  arm64-darwin-23
-  x64-mingw-ucrt
-  x86_64-darwin-23
+  aarch64-linux
+  aarch64-linux-android
+  aarch64-linux-gnu
+  aarch64-linux-musl
+  aarch64-mingw-ucrt
+  arm-linux-androideabi
+  arm-linux-gnu
+  arm-linux-gnueabihf
+  arm-linux-musl
+  arm-linux-musleabihf
+  arm64-darwin
+  riscv64-linux-android
+  riscv64-linux-gnu
+  riscv64-linux-musl
+  ruby
+  x86-cygwin
+  x86-linux
+  x86-linux-android
+  x86-linux-gnu
+  x86-linux-musl
+  x86-mingw-ucrt
+  x86_64-cygwin
+  x86_64-darwin
   x86_64-linux
+  x86_64-linux-android
+  x86_64-linux-gnu
+  x86_64-linux-musl
 
 DEPENDENCIES
   eventmachine (= 1.2.7)
@@ -122,4 +192,4 @@ DEPENDENCIES
   wdm (>= 0.1.0)
 
 BUNDLED WITH
-   2.4.21
+   2.6.0

_config.yml

@@ -74,7 +74,7 @@ collections:
 #   sort_field: "date"
 #   sort_reverse: true
 pagination:
-  per_page: 2
+  per_page: 6
   permalink: "/page:num"
 
 #   # Site-wide kill switch, disabled here it doesn't run at all

_config_dev.yml

@@ -73,7 +73,7 @@ collections:
 #   sort_field: "date"
 #   sort_reverse: true
 pagination:
-  per_page: 2
+  per_page: 6
   permalink: "/page:num"
 
 #   # Site-wide kill switch, disabled here it doesn't run at all

_layouts/post.html

@@ -21,31 +21,5 @@
       >
       {% endif %}
     </div>
-
-    {% if site.disqus_shortname and page.comments %}
-    <div id="disqus_thread"></div>
-    <script>
-      var disqus_shortname = "{{ site.disqus_shortname }}";
-      var disqus_config = function () {
-        this.page.url = "{{ page.url | prepend: site.url }}";
-        this.page.identifier = "{{ page.id }}";
-      };
-
-      (function () {
-        // DON'T EDIT BELOW THIS LINE
-        var d = document,
-          s = d.createElement("script");
-        s.src = "//" + disqus_shortname + ".disqus.com/embed.js";
-        s.setAttribute("data-timestamp", +new Date());
-        (d.head || d.body).appendChild(s);
-      })();
-    </script>
-    <noscript
-      >Please enable JavaScript to view the
-      <a href="https://disqus.com/?ref_noscript" rel="nofollow"
-        >comments powered by Disqus.</a
-      ></noscript
-    >
-    {% endif %}
   </div>
 </div>

_layouts/single-page-extension.html

@@ -0,0 +1,79 @@
+---
+layout: page
+pagination: 
+  enabled: true
+  collection: extensions
+---
+<div class="blog-post text-container">
+
+	<div class="post-content">
+
+        <style>
+			.modal-image {
+			  display: flex;
+			  flex-direction: column;
+			  align-items: center;
+			  justify-content: flex-start;
+			}
+			.modal-image > img {
+			  width: 100%;
+			  object-fit: contain;
+			}
+		  </style>
+			  <div class="modal-content" style="margin-top:2rem;">
+				<div class="modal-image">
+				  <img class="image-class"  
+				  data-snapshot-light="{{page.colorImage}}"
+				  data-snapshot-dark="{{page.whiteImage}}"
+				  src="{{page.colorImage}}"
+				  onerror="this.src='/assets/images/meshery-color.svg'" loading="lazy" onclick="toggleFullScreenImage('{{ page.colorImage }}', 'extension')" />
+				</div>
+				<br />
+				<div class="vertical-line"></div>
+				<div class="modal-info">
+
+				  <h3 class="modal-h3">Description</h3>
+				  <p class="content-toggle contentdata pre-white-space">{{page.extensionInfo | url_decode | replace: '\\n', '<br/>' | replace: '\n', '<br/>' }}</p>
+				  <!-- <span class="read-more" href="read-more.html">{% include expand.html %}</span> -->
+
+				  <h3 class="modal-h3">Features</h3>
+				  <p class="content-toggle contentdata pre-white-space">{{page.extensionCaveats | url_decode | replace: '\\n', '<br/>' | replace: '\n', '<br/>' }}</p>
+				  <!-- <span class="read-more" href="read-more.html">{% include expand.html %}</span> -->
+				  <div id="copy-url">
+					<div class="btn-class">
+					  <div class="vertical-center" id="{{type.name}}">
+						<div class="btn-grp">
+						  {% if {{page.docsURL}} %}
+						  <a href="{{page.docsURL}}">
+							<button class="import-secondary" style="width: 7rem;">Learn More</button></a>
+						  {% endif %}
+						  <div class="btn-tooltip-grp">
+						  {% if {{page.URL}} %}
+							<a href="{{page.URL}}">
+							  <button class="import" style="width: 7rem;">Visit</button></a>
+						  {% endif %}
+						  </div>
+						</div>
+					  </div>
+					</div>
+				  </div>
+
+				</div>
+			  </div>
+
+		   <script src="{{ site.baseurl }}/assets/js/catalog-modal.js"></script>
+		   <script src="{{ site.baseurl }}/assets/js/thumbnail-clickable.js"></script>
+
+
+	   <div class="blog-navigation" style="margin-bottom: 2rem;">
+		<div style="justify-content:space-between; display: flex; width:100%;">
+			{% if page.previous.url %}
+				<a href="{% include relative-src.html src=page.previous.url %}">&laquo; {{ page.previous.name }}</a>
+			{% endif %}
+			{% if page.next.url %}
+				<a  href="{% include relative-src.html src=page.next.url %}">{{ page.next.name }} &raquo;</a>
+			{% endif %}
+		</div>
+		</div>
+	</div>
+</div>

_sass/blog.scss

@@ -36,8 +36,8 @@
   }
 
   h3 {
-    margin: 0;
-    font-size: 1rem;
+    margin: 1rem 0;
+    font-size: 1.75rem;
     a {
       color: var(--color-secondary-medium);
       text-decoration: none;
@@ -48,6 +48,13 @@
 
   h2 {
     text-align: left;
+    text-transform: none; 
+    a {
+      color: var(--color-secondary-medium);
+    }
+  }
+  h4 {
+    font-size: 1.45rem;
   }
 
   .blog-navigation {

_sass/elements.scss

@@ -82,7 +82,7 @@ h2.sub-text{
 }
 
 h3 {
-	font-size: 2em;
+	font-size: 2rem;
 	margin: 20px 0 10px 0;
 	color: var(--color-secondary-dark);
 	font-family: "Qanelas Soft", "Open Sans", sans-serif;
@@ -147,4 +147,73 @@ li.heading{
 		opacity: 1;
 		transform: skewX(0deg);
 	}
-  }
+  }
+
+  // SUMMARY AND DETAILS //////////////////////////////////////////
+details {
+  width: 100%;
+  margin: 0 auto ;
+  background-color: var( --color-details-background);
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+  box-shadow: 0 .1rem 1rem -.5rem rgba(0,0,0,.4);
+  border-radius: 5px;
+  overflow: hidden;
+  font-size: 1rem;
+  padding: 0rem 1.5rem 0rem 1.5rem;
+  & > h6 { color: var(--color-primary-blonde)};
+  & > p { color: var(--color-secondary-dark)};
+}
+
+summary {
+  padding: .25rem 0rem;
+  margin-right: -1.5rem;
+  margin-left: -1.5rem;
+  display: block;
+  background-color: var(--color-summary-background);
+  color: var(--color-secondary-medium);
+  padding-left: 2.2rem;
+  position: relative;
+  cursor: pointer;
+  font-size: 1.1rem;
+  font-weight: normal;
+}
+
+summary:before {
+  content: '';
+  border-width: .4rem;
+  border-style: solid;
+  border-color: transparent transparent transparent var( --color-secondary-dark);
+  position: absolute;
+  left: 1rem;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  height: .02rem;
+  margin: auto;
+  transform: rotate(0);
+  transform-origin: .2rem 50%;
+  transition: .25s transform ease;
+}
+
+/* THE MAGIC 🧙‍♀️ */
+details[open] > summary:before {
+  transform: rotate(90deg);
+
+}
+
+details summary::-webkit-details-marker {
+  display:none;
+}
+
+details > ul {
+  line-height: .75rem;
+  padding: 1rem auto;
+  margin-bottom: 0;
+}
+
+details > ol {
+  line-height: .75rem;
+  padding: 1rem auto;
+  margin-bottom: 0;
+}

_sass/layout.scss

@@ -182,9 +182,8 @@ section {
 }
 
 .page h2 {
-    // text-align: center;
     margin: 2.5rem 0;
-    text-transform: capitalize; 
+    text-transform: normal; 
 }
 
 blockquote {