From 23f1e74ce0bda38c55a3353282af50efd209c80e Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 13:59:18 -0700 Subject: [PATCH 01/17] update gatsby-plugin-meta-redirect link in package Signed-off-by: Randy Lau --- package-lock.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 119d9ebb88d0..f9c4054e10f2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12511,7 +12511,7 @@ }, "node_modules/gatsby-plugin-meta-redirect": { "version": "1.1.1", - "resolved": "git+ssh://git@github.com/layer5labs/gatsby-plugin-meta-redirect.git#612f8666156c5ca4e114a0c36f4acc9a7bd094e8", + "resolved": "git+ssh://git@github.com/layer5labs/gatsby-plugin-meta-redirect.git#290c331224f5c983d3945f72640ec3c2612c137a", "license": "MIT", "dependencies": { "fs-extra": "^7.0.0" @@ -35356,7 +35356,7 @@ } }, "gatsby-plugin-meta-redirect": { - "version": "git+ssh://git@github.com/layer5labs/gatsby-plugin-meta-redirect.git#612f8666156c5ca4e114a0c36f4acc9a7bd094e8", + "version": "git+ssh://git@github.com/layer5labs/gatsby-plugin-meta-redirect.git#290c331224f5c983d3945f72640ec3c2612c137a", "from": "gatsby-plugin-meta-redirect@github:layer5labs/gatsby-plugin-meta-redirect", "requires": { "fs-extra": "^7.0.0" From 8e0ffb1ad5389562501ecdb449be0d792b937113 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 14:00:32 -0700 Subject: [PATCH 02/17] clear MDXProvider warning ResourceWrapper Signed-off-by: Randy Lau --- .../articles/terraform-with-meshery/index.mdx | 43 +++++++++++++++---- 1 file changed, 35 insertions(+), 8 deletions(-) diff --git a/src/collections/resources/articles/terraform-with-meshery/index.mdx b/src/collections/resources/articles/terraform-with-meshery/index.mdx index c0fe716f6e2e..a2ea589bd47c 100644 --- a/src/collections/resources/articles/terraform-with-meshery/index.mdx +++ b/src/collections/resources/articles/terraform-with-meshery/index.mdx @@ -13,13 +13,13 @@ tags: featured: false published: true resource: true - --- + import { ResourcesWrapper } from "../../Resources.style.js"; import { Link } from "gatsby"; import Button from "../../../../reusecore/Button"; - +

Terraform is a powerful tool that helps users manage and provision infrastructure resources in a consistent and efficient manner. With Terraform, you can define your infrastructure as code, using human-readable configuration files that can be versioned, shared, and reused. This makes it easy to create, modify, and manage your infrastructure resources, whether they are cloud-based or on-premises.

@@ -30,23 +30,50 @@ import Button from "../../../../reusecore/Button";

- One way to further enhance your use of Terraform is by integrating it with Meshery. Meshery is a cloud-native management platform that provides a unified interface for managing and monitoring your infrastructure resources, including those managed by Terraform. By integrating Terraform with Meshery, you can leverage the power and flexibility of both tools to streamline your infrastructure management process. + One way to further enhance your use of Terraform is by integrating it with + Meshery. Meshery is a cloud-native management platform that provides a unified + interface for managing and monitoring your infrastructure resources, including + those managed by Terraform. By integrating Terraform with Meshery, you can + leverage the power and flexibility of both tools to streamline your + infrastructure management process.

- One of the key benefits of using Terraform with Meshery is the ability to manage and monitor your infrastructure resources in a consistent and centralized manner. With Meshery, you can view and manage all of your infrastructure resources, whether they are managed by Terraform or other tools, from a single dashboard. This allows you to quickly identify any issues or potential problems with your infrastructure, and take action to resolve them in a timely manner. + One of the key benefits of using Terraform with Meshery is the ability to + manage and monitor your infrastructure resources in a consistent and + centralized manner. With Meshery, you can view and manage all of your + infrastructure resources, whether they are managed by Terraform or other + tools, from a single dashboard. This allows you to quickly identify any issues + or potential problems with your infrastructure, and take action to resolve + them in a timely manner.

- Another benefit of using Terraform with Meshery is the ability to automate your infrastructure management process. With Meshery, you can create and manage automated pipelines for provisioning and managing your infrastructure resources. This can help to reduce the time and effort required to manage your infrastructure, and allow you to focus on other important tasks. + Another benefit of using Terraform with Meshery is the ability to automate + your infrastructure management process. With Meshery, you can create and + manage automated pipelines for provisioning and managing your infrastructure + resources. This can help to reduce the time and effort required to manage your + infrastructure, and allow you to focus on other important tasks.

- In addition to these benefits, using Terraform with Meshery also provides a number of other advantages. For example, Meshery integrates with a wide range of tools and platforms, allowing you to easily incorporate your existing infrastructure resources into your management process. This can help to reduce the complexity of managing your infrastructure, and make it easier to keep everything running smoothly. + In addition to these benefits, using Terraform with Meshery also provides a + number of other advantages. For example, Meshery integrates with a wide range + of tools and platforms, allowing you to easily incorporate your existing + infrastructure resources into your management process. This can help to reduce + the complexity of managing your infrastructure, and make it easier to keep + everything running smoothly.

-Overall, the use of Terraform with Meshery can help to streamline and improve your infrastructure management process. By integrating these two powerful tools, you can gain greater visibility and control over your infrastructure resources, and automate many of the tasks involved in managing them. This can help to reduce the time and effort required to manage your infrastructure, and allow you to focus on other important tasks. So, it is a good idea to use Terraform with Meshery to improve the efficiency and effectiveness of your infrastructure management process. + Overall, the use of Terraform with Meshery can help to streamline and improve + your infrastructure management process. By integrating these two powerful + tools, you can gain greater visibility and control over your infrastructure + resources, and automate many of the tasks involved in managing them. This can + help to reduce the time and effort required to manage your infrastructure, and + allow you to focus on other important tasks. So, it is a good idea to use + Terraform with Meshery to improve the efficiency and effectiveness of your + infrastructure management process.

- + From edea4add1eb84cd501f277a1770268cac6e87deb Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 14:13:23 -0700 Subject: [PATCH 03/17] clear MDXProvider warning ChapterStyle Signed-off-by: Randy Lau --- .../istio/getting-started.mdx | 31 ++++++++++++------- 1 file changed, 20 insertions(+), 11 deletions(-) diff --git a/content-learn/mastering-service-meshes-for-developers/introduction-to-service-meshes/istio/getting-started.mdx b/content-learn/mastering-service-meshes-for-developers/introduction-to-service-meshes/istio/getting-started.mdx index f657e8f0a5c1..144eb5f1ca75 100644 --- a/content-learn/mastering-service-meshes-for-developers/introduction-to-service-meshes/istio/getting-started.mdx +++ b/content-learn/mastering-service-meshes-for-developers/introduction-to-service-meshes/istio/getting-started.mdx @@ -6,13 +6,13 @@ videos: 4 lectures: 12 order: 1 --- - - - +import { ChapterStyle } from "../../../../src/components/Learn-Components/Chapters-Style/chapters.style.js"; +

Setup Istio

@@ -36,22 +36,31 @@ Optional (manual install of Istio): Using Meshery, select `Istio` from the `Lifecycle` menu. - In the Istio management page: 1. Type `istio-system` into the namespace field. 2. Click the (+) icon on the `Install` card and click on `Istio Service Mesh` to install latest version of Istio. - + - 3. Click the `Deploy` button on the confirmation modal. - - - +3. Click the `Deploy` button on the confirmation modal. + + {" "} + + + - +

Alternative:Manual installation

Perform the below steps if the above steps doesn't work for you. From c8e123ac56aee7d3679c25f1065fce1548dec1a6 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 14:14:56 -0700 Subject: [PATCH 04/17] added missing semicolons for svg colorMode1 fill Signed-off-by: Randy Lau --- src/sections/Partners/partner.style.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/sections/Partners/partner.style.js b/src/sections/Partners/partner.style.js index 367cbe7e6ca1..fa591f007ac8 100644 --- a/src/sections/Partners/partner.style.js +++ b/src/sections/Partners/partner.style.js @@ -85,12 +85,12 @@ const PartnerWrapper = styled.section` .vmware-colorMode_svg__colorMode1, .istio-colorMode_svg__colorMode1 { - fill: ${props => props.theme.whiteToBlack} + fill: ${props => props.theme.whiteToBlack}; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } .smi-colorMode_svg__colorMode1 { - fill: ${props => props.theme.whiteToBlue2A2DDE} + fill: ${props => props.theme.whiteToBlue2A2DDE}; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } } From 8eec0ec7d44411816890b842886900d079cde540 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 14:38:32 -0700 Subject: [PATCH 05/17] add theme responsive Citrix svg Signed-off-by: Randy Lau --- .../images/partners/citrix-colorMode.svg | 46 +++++++++++++++++++ src/sections/Partners/partner.style.js | 6 +++ src/sections/Partners/partners.js | 10 +--- 3 files changed, 54 insertions(+), 8 deletions(-) create mode 100644 src/assets/images/partners/citrix-colorMode.svg diff --git a/src/assets/images/partners/citrix-colorMode.svg b/src/assets/images/partners/citrix-colorMode.svg new file mode 100644 index 000000000000..4945f7d1795f --- /dev/null +++ b/src/assets/images/partners/citrix-colorMode.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/sections/Partners/partner.style.js b/src/sections/Partners/partner.style.js index fa591f007ac8..d5023e750e44 100644 --- a/src/sections/Partners/partner.style.js +++ b/src/sections/Partners/partner.style.js @@ -76,6 +76,7 @@ const PartnerWrapper = styled.section` } svg{ + .citrix-colorMode_svg__colorMode2, .cncf-stacked-colorMode_svg__colorMode1, .hashicorp_vertical-colorMode_svg__colorMode1, .hpe_side-colorMode_svg__colorMode1, @@ -89,6 +90,11 @@ const PartnerWrapper = styled.section` transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } + .citrix-colorMode_svg__colorMode1 { + fill: ${props => props.theme.blackToWhite}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); + } + .smi-colorMode_svg__colorMode1 { fill: ${props => props.theme.whiteToBlue2A2DDE}; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); diff --git a/src/sections/Partners/partners.js b/src/sections/Partners/partners.js index a55504d8b196..88227e0a0cc0 100644 --- a/src/sections/Partners/partners.js +++ b/src/sections/Partners/partners.js @@ -2,9 +2,8 @@ import React from "react"; import partner1 from "../../assets/images/partners/University_of_Texas_at_Austin_seal.png"; import partner2 from "../../assets/images/partners/gsoc.svg"; import partner3 from "../../assets/images/partners/UEM_Logo.jpg"; -import partner4 from "../../assets/images/partners/citrix.svg"; +import { ReactComponent as Partner4 } from "../../assets/images/partners/citrix-colorMode.svg"; import { ReactComponent as Partner5 } from "../../assets/images/partners/cncf-stacked-colorMode.svg"; -import { ReactComponent as Partner5DarkMode } from "../../assets/images/partners/cncf/stacked/white/cncf-stacked-white.svg"; import { ReactComponent as Partner6 } from "../../assets/images/partners/hashicorp_vertical-colorMode.svg"; import { ReactComponent as Partner7 } from "../../assets/images/partners/hpe_side-colorMode.svg"; import { ReactComponent as Partner8 } from "../../assets/images/partners/microsoft-colorMode.svg"; @@ -21,7 +20,6 @@ export const partners = [ //link: "http://www.ece.utexas.edu/speakers/lee-calcote", type: "academic", imageLink: partner1, - darkimageLink: partner1, partnerId: "utaustin", //imageRoute: "http://www.ece.utexas.edu/speakers/lee-calcote", moreInfo: "In partnership with faculty of the Cockrell School of Engineering at The University of Texas at Austin, graduate students engage in research on the affects of hardware architectures and the performance of software-based networking.Ph.D. candidates leverage Meshery in research and analysis of affect and overhead service mesh architectures have on when running distributed systems. Learn more about our collaborative research" @@ -32,7 +30,6 @@ export const partners = [ //link: "/programs", type: "academic", imageLink: partner2, - darkimageLink: partner2, imageRoute: "https://layer5.io/programs/gsoc", moreInfo: "Google Summer of Code is a global program focused on bringing more student developers into open source software development. Students work with an open source organization on a 3 month programming project during their break from school. Learn more about our mentoring", }, { @@ -41,7 +38,6 @@ export const partners = [ //link: "/careers/internships", type: "academic", imageLink: partner3, - darkimageLink: partner3, partnerId: "uem", //imageRoute: "https://uem.edu.in/blog/what-is-open-source/", moreInfo: "We have officially partnered with the University of Engineering & Management (UEM), Jaipur. We thank the faculty of UEM Jaipur for partnering with us. As part of the partnership program we have a wide variety of interns from the university participating in our open source projects. The interns have the opportunity to work on a variety of cloud native technologies.Based on the area of their individual interest they can choose the technologies they want to learn or sharpen their skills. Learn more about Layer5's internships", @@ -50,8 +46,7 @@ export const partners = [ desc: "Citrix ADC is an application delivery and load balancing solution that provides a high-quality user experience for your web, traditional, and cloud-native applications regardless of where they are hosted. It comes in a wide variety of form factors and deployment options without locking you into a single cloud. Pooled capacity licensing enables the movement of capacity among cloud deployments.", //link: null, type: "technology", - imageLink: partner4, - darkimageLink: partner4, + imageLink: , partnerId: "Citrix", //imageRoute: "https://www.citrix.com/products/citrix-adc/", moreInfo: "Citrix ADC is an application delivery and load balancing solution that provides a high-quality user experience for your web, traditional, and cloud-native applications regardless of where they are hosted. It comes in a wide variety of form factors and deployment options without locking you into a single cloud. Pooled capacity licensing enables the movement of capacity among cloud deployments.", @@ -61,7 +56,6 @@ export const partners = [ //link: null, type: "technology", imageLink: , - darkimageLink: , imageRoute: "https://landscape.cncf.io/card-mode?category=cncf-members&grouping=category&selected=layer5-member&embed=yes&style=logo", moreInfo: "The Cloud Native Computing Foundation (CNCF) hosts critical components of the global technology infrastructure. CNCF brings together the world’s top developers, end users, and vendors and runs the largest open source developer conferences. CNCF is part of the nonprofit Linux Foundation.", }, { From 872da42d2858779afa6e6c8ad958ac7c72a6ecd1 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Sat, 20 May 2023 18:15:28 -0700 Subject: [PATCH 06/17] pr#3286 fix for accordian faq items Signed-off-by: Randy Lau --- src/reusecore/Accordion/accordion.style.js | 31 +++++++++++++++++++--- src/sections/General/Faq/index.js | 23 ++++++++++------ 2 files changed, 43 insertions(+), 11 deletions(-) diff --git a/src/reusecore/Accordion/accordion.style.js b/src/reusecore/Accordion/accordion.style.js index abe07d24ccd4..dadc80240c3b 100644 --- a/src/reusecore/Accordion/accordion.style.js +++ b/src/reusecore/Accordion/accordion.style.js @@ -43,6 +43,7 @@ export const AccordionTitleWrapper = styled(AccordionItemHeading)` } &[aria-expanded='true'] { background: ${props => props.theme.grey8C8C8CToGreen1E2117}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } } @@ -56,11 +57,35 @@ export const AccordionTitleWrapper = styled(AccordionItemHeading)` export const AccordionItemButtonWrapper = styled(AccordionItemButton)` padding: 0.625rem 1.5rem 0.625rem 1.5rem; `; + export const AccordionBodyWrapper = styled(AccordionItemPanel)` - animation: 0.35s ${fadeIn} ease-in; - &.accordion__body--hidden { - animation: 0.35s ${fadeIn} ease-in; + overflow: hidden; + display: grid; + grid-template-rows: 1fr; + transition: grid-template-rows ease 1.0s; + + > .inner { + min-height: 0; + visibility: visible; + opacity: 1; + transition: opacity 0.35s; + } + + &[hidden] { + grid-template-rows: 0fr; + + > .inner { + visibility: hidden; + opacity: 0; + transition: opacity 0.35s, visibility 0s 0.35s; + } } + + // animation: 0.35s ${fadeIn} ease-in; + // &.accordion__body--hidden { + // animation: 0.35s ${fadeIn} ease-in; + // } + `; export const IconWrapper = styled.div` diff --git a/src/sections/General/Faq/index.js b/src/sections/General/Faq/index.js index fcc21dd6378e..6aa3aeb7afc0 100644 --- a/src/sections/General/Faq/index.js +++ b/src/sections/General/Faq/index.js @@ -68,8 +68,8 @@ const Faq = (props) => { */} - {faq_keys.map((key) => ( - <> + {faq_keys.map((key, index) => ( +

{key}

{faqs[key].map((faq, index) => ( @@ -85,16 +85,23 @@ const Faq = (props) => { - { - faq.answer.length >= 1 ?
    {faq.answer.map((ans, id) => (

  • {ans}

    • ))}
:
- } -
- {faq.link &&
+ } ))} - + ))}
From 21c20ba93fea5df570f3de3045aec09c7e11d8c1 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Thu, 25 May 2023 01:02:52 -0700 Subject: [PATCH 07/17] PR3663, selection color for dark and light mode Signed-off-by: Randy Lau --- src/sections/app.style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sections/app.style.js b/src/sections/app.style.js index 3a4ab4c900de..9c05e9df6275 100644 --- a/src/sections/app.style.js +++ b/src/sections/app.style.js @@ -3,7 +3,7 @@ import { createGlobalStyle } from "styled-components"; const GlobalStyle = createGlobalStyle` ::selection { - background: ${(props) => props.theme.selectionColor}; + background: rgba(0, 50, 0, 0.99); color: #ffffff; } From d32260bcd4b843fe0220fc8ea737c15d00c2ed70 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Thu, 25 May 2023 13:25:04 -0700 Subject: [PATCH 08/17] update metabit to keep consistent use of svg Signed-off-by: Randy Lau --- .../metabit-trading-logo-colorMode.svg | 113 ++++++++++++++++++ src/sections/Partners/partner.style.js | 19 +++ src/sections/Partners/partners.js | 15 ++- 3 files changed, 146 insertions(+), 1 deletion(-) create mode 100644 src/assets/images/partners/metabit-trading-logo-colorMode.svg diff --git a/src/assets/images/partners/metabit-trading-logo-colorMode.svg b/src/assets/images/partners/metabit-trading-logo-colorMode.svg new file mode 100644 index 000000000000..28b10743b3e3 --- /dev/null +++ b/src/assets/images/partners/metabit-trading-logo-colorMode.svg @@ -0,0 +1,113 @@ + + + + + + + + + + + + + + + + + + + + + + Metabit Trading + \ No newline at end of file diff --git a/src/sections/Partners/partner.style.js b/src/sections/Partners/partner.style.js index d5023e750e44..2e57e46a6261 100644 --- a/src/sections/Partners/partner.style.js +++ b/src/sections/Partners/partner.style.js @@ -85,6 +85,7 @@ const PartnerWrapper = styled.section` .intel-colorMode_svg__colorMode1, .vmware-colorMode_svg__colorMode1, .istio-colorMode_svg__colorMode1 + .metabit-trading-logo-colorMode_svg__colorMode1 { fill: ${props => props.theme.whiteToBlack}; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); @@ -99,6 +100,24 @@ const PartnerWrapper = styled.section` fill: ${props => props.theme.whiteToBlue2A2DDE}; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } + + .metabit-trading-logo-colorMode_svg__colorMode2, + .metabit-trading-logo-colorMode_svg__colorMode3, + .metabit-trading-logo-colorMode_svg__colorMode4 { + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); + } + + .metabit-trading-logo-colorMode_svg__colorMode2 { + fill: ${props => props.theme.whiteToBlack}; + } + + .metabit-trading-logo-colorMode_svg__colorMode3 { + fill: ${props => props.theme.whiteToBlack}; + } + + .metabit-trading-logo-colorMode_svg__colorMode4 { + fill: ${props => props.theme.whiteToBlack}; + } } } diff --git a/src/sections/Partners/partners.js b/src/sections/Partners/partners.js index 88227e0a0cc0..6e0493c21583 100644 --- a/src/sections/Partners/partners.js +++ b/src/sections/Partners/partners.js @@ -13,6 +13,9 @@ import { ReactComponent as Partner11 } from "../../assets/images/partners/intel- import { ReactComponent as PartnerIstio } from "../../assets/images/partners/istio-colorMode.svg"; import { ReactComponent as Partner12 } from "../../assets/images/partners/vmware-colorMode.svg"; +import { ReactComponent as Partner14 } from "../../assets/images/partners/metabit-trading-logo-colorMode.svg"; + + export const partners = [ { name: "The University of Texas at Austin", @@ -128,7 +131,17 @@ export const partners = [ //imageRoute: "https://www.vmware.com/", moreInfo: "Layer5 enhances the Tanzu Service Mesh experience with Meshery as an application and infrastructure management platform that accelerates the adoption of open-source and cloud-native technologies by eliminating complexity with its intuitive, efficient, and flexible solution. Using Layer5's solutions along with Tanzu, engineers can self-service while enterprise IT teams offer Kubernetes as a Service to their application service teams.", + }, { + name: "Metabit Trading", + desc: "Metabit Trading is a technology-driven quantitative investment firm harnessing the power of artificial intelligence and machine learning.", + //link: null, + type: "technology", + imageLink: , + partnerId: "metabittrading", + //imageRoute: "https://www.metabit-trading.com/home", + moreInfo: + "Metabit Trading is a technology-driven quantitative investment firm harnessing the power of artificial intelligence and machine learning.", } -]; \ No newline at end of file +]; From abb9025e73d6fa24c56b9c4376b48f8938a0c870 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Thu, 25 May 2023 14:51:19 -0700 Subject: [PATCH 09/17] smooth out transitions for Catalog Page Signed-off-by: Randy Lau --- .../Blockquote-image/blockquote-image.style.js | 6 ++++++ src/reusecore/Blockquote/blockquote.style.js | 3 +++ src/sections/Cloud-Native-Catalog/catalog.js | 13 ++++++------- src/sections/Cloud-Native-Catalog/header.js | 1 + src/sections/Cloud-Native-Catalog/new-catalog.js | 2 ++ src/sections/Pricing/review-slider.js | 1 + 6 files changed, 19 insertions(+), 7 deletions(-) diff --git a/src/reusecore/Blockquote/Blockquote-image/blockquote-image.style.js b/src/reusecore/Blockquote/Blockquote-image/blockquote-image.style.js index c83ae9cad472..7f1186623ccb 100644 --- a/src/reusecore/Blockquote/Blockquote-image/blockquote-image.style.js +++ b/src/reusecore/Blockquote/Blockquote-image/blockquote-image.style.js @@ -8,6 +8,12 @@ blockquote { margin: 0; } +.type-one-text, +.type-two-quote-text { + color: ${props => props.theme.greyEEEEEEToBlack}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); +} + section.bq-section { padding: 30px; margin-bottom: 60px; diff --git a/src/reusecore/Blockquote/blockquote.style.js b/src/reusecore/Blockquote/blockquote.style.js index f22d29109549..32257b266bef 100644 --- a/src/reusecore/Blockquote/blockquote.style.js +++ b/src/reusecore/Blockquote/blockquote.style.js @@ -26,6 +26,7 @@ const BlockquoteStyle = styled.div` border: 2px solid ${props => props.theme.primaryLightColorTwo}; border-radius:20px; padding: 20px; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); } /* Blockquote right double quotes */ @@ -33,6 +34,7 @@ const BlockquoteStyle = styled.div` content:""; position: absolute; border: 2px solid ${props => props.theme.primaryLightColorTwo}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); border-radius: 0 50px 0 0; width: 60px; height: 60px; @@ -48,6 +50,7 @@ const BlockquoteStyle = styled.div` position: absolute; width: 80px; border: 6px solid ${props => props.theme.body}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); bottom: -3px; left: 50px; z-index: 2; diff --git a/src/sections/Cloud-Native-Catalog/catalog.js b/src/sections/Cloud-Native-Catalog/catalog.js index d70775e9892d..c4acf623b2df 100644 --- a/src/sections/Cloud-Native-Catalog/catalog.js +++ b/src/sections/Cloud-Native-Catalog/catalog.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from "react"; +import React from "react"; import styled from "styled-components"; import Wasm from "../../assets/images/webassembly/webssembly_icon.svg"; import Patterns from "../../assets/images/service-mesh-patterns/service-mesh-pattern.svg"; @@ -13,6 +13,7 @@ const CatalogWrapper = styled.div` min-height: fit-content; border-width: 2px 2px 2px 2px; background-color: ${(props) => props.theme.body}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); padding-top: 100px; padding-bottom: 100px; @media (max-width: 468px) { @@ -63,6 +64,7 @@ const CatalogWrapper = styled.div` font-size: 3.125rem; line-height: 3.813rem; color: ${(props) => props.theme.tertiaryColor}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); margin-bottom: 2rem; @media (max-width: 992px) { font-size: 2.8rem; @@ -86,6 +88,7 @@ const CatalogWrapper = styled.div` font-size: 1.563rem; line-height: 2rem; color: ${(props) => props.theme.tertiaryColor}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); opacity: 0.8; @media (max-width: 767px) { font-size: 1rem; @@ -124,12 +127,8 @@ const CatalogWrapper = styled.div` `; const Catalog = () => { - const [img, setImg] = useState(CatalogsLight); - const { isDark } = useStyledDarkMode(); - useEffect(() => { - isDark ? setImg(CatalogsDark) : setImg(CatalogsLight); - }, [isDark]); + const { isDark } = useStyledDarkMode(); return ( @@ -137,7 +136,7 @@ const Catalog = () => {
- +
diff --git a/src/sections/Cloud-Native-Catalog/header.js b/src/sections/Cloud-Native-Catalog/header.js index 9c2d73a47ef8..614e9cc452aa 100644 --- a/src/sections/Cloud-Native-Catalog/header.js +++ b/src/sections/Cloud-Native-Catalog/header.js @@ -24,6 +24,7 @@ const CatalogHeaderWrapper = styled.div` } .header__title_description { color: ${(props) => props.theme.tertiaryColor}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); font-weight: 400; font-size: 1.438rem; line-height: 2rem; diff --git a/src/sections/Cloud-Native-Catalog/new-catalog.js b/src/sections/Cloud-Native-Catalog/new-catalog.js index d2a6adaeb238..936e5aa7f931 100644 --- a/src/sections/Cloud-Native-Catalog/new-catalog.js +++ b/src/sections/Cloud-Native-Catalog/new-catalog.js @@ -6,6 +6,7 @@ import Button from "../../reusecore/Button"; const NewCatalogWrapper = styled.div` min-height: 500px; background-color: ${({ theme }) => theme.whiteOneToGreyF0F0F0}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); .container { min-height: 500px; display: flex; @@ -16,6 +17,7 @@ const NewCatalogWrapper = styled.div` .new-catalog__title { text-align: center; color: ${(props) => props.theme.tertiaryColor}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); font-weight: 600; font-size: 3.125rem; line-height: 3.813rem; diff --git a/src/sections/Pricing/review-slider.js b/src/sections/Pricing/review-slider.js index 886263b8a4a2..cb6ef6b93d6d 100644 --- a/src/sections/Pricing/review-slider.js +++ b/src/sections/Pricing/review-slider.js @@ -63,6 +63,7 @@ max-width: 100%; overflow: hidden; padding: 2rem 0 0.5rem; background: ${props => props.theme.secondaryLightColor}; + transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); h2{ text-align: center; padding: 0 0 2rem; From ee9bf0030a45546468c877f43b0e4c9bfed89b6c Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Thu, 25 May 2023 14:55:21 -0700 Subject: [PATCH 10/17] fix metabit svg logo css transition Signed-off-by: Randy Lau --- src/sections/Partners/partner.style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sections/Partners/partner.style.js b/src/sections/Partners/partner.style.js index 2e57e46a6261..fafb958eca53 100644 --- a/src/sections/Partners/partner.style.js +++ b/src/sections/Partners/partner.style.js @@ -84,7 +84,7 @@ const PartnerWrapper = styled.section` .redhat-colorMode_svg__colorMode1, .intel-colorMode_svg__colorMode1, .vmware-colorMode_svg__colorMode1, - .istio-colorMode_svg__colorMode1 + .istio-colorMode_svg__colorMode1, .metabit-trading-logo-colorMode_svg__colorMode1 { fill: ${props => props.theme.whiteToBlack}; From 7b6d23fa4625966ee9df8fe7b7f5cb12ce785142 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Thu, 25 May 2023 15:09:46 -0700 Subject: [PATCH 11/17] more dark mode transition fixes for partner page Signed-off-by: Randy Lau --- src/sections/Partners/index.js | 4 ++-- src/sections/Partners/partner.style.js | 7 +++++++ 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/sections/Partners/index.js b/src/sections/Partners/index.js index 48ecaed2e626..8bd954dd1506 100644 --- a/src/sections/Partners/index.js +++ b/src/sections/Partners/index.js @@ -39,7 +39,7 @@ const Partner = () => {
-

Layer5 is dedicated to partnering with leading educational institutions, technology vendors, solution providers and industry experts to drive the adoption of cloud native technologies focused on the evolution of how developers write modern applications, how operators run infrastructure and how product owners manage service offerings.

+ Layer5 is dedicated to partnering with leading educational institutions, technology vendors, solution providers and industry experts to drive the adoption of cloud native technologies focused on the evolution of how developers write modern applications, how operators run infrastructure and how product owners manage service offerings.
From 481e59cb6aa75ded80c24c096d535a071d0aa015 Mon Sep 17 00:00:00 2001 From: Randy Lau Date: Mon, 5 Jun 2023 14:59:49 -0700 Subject: [PATCH 16/17] resolve build merge conflict file issue. Signed-off-by: Randy Lau --- src/sections/Partners/partners.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/sections/Partners/partners.js b/src/sections/Partners/partners.js index 6d511a80547a..96de49921d4a 100644 --- a/src/sections/Partners/partners.js +++ b/src/sections/Partners/partners.js @@ -1,7 +1,7 @@ import React from "react"; import partner1 from "../../assets/images/partners/University_of_Texas_at_Austin_seal.webp"; import partner2 from "../../assets/images/partners/gsoc.svg"; -import partner3 from "../../assets/images/partners/UEM_Logo.jpg"; +import partner3 from "../../assets/images/partners/UEM_Logo.webp"; import { ReactComponent as Partner4 } from "../../assets/images/partners/citrix-colorMode.svg"; import { ReactComponent as Partner5 } from "../../assets/images/partners/cncf-stacked-colorMode.svg"; import { ReactComponent as Partner6 } from "../../assets/images/partners/hashicorp_vertical-colorMode.svg"; From 9842c88ff780c9d8de27e98c4cbe46415e8ea8cd Mon Sep 17 00:00:00 2001 From: Shivam Sood Date: Sun, 18 Jun 2023 10:35:17 +0530 Subject: [PATCH 17/17] removed line breaks Signed-off-by: Shivam Sood --- .../articles/terraform-with-meshery/index.mdx | 37 +++---------------- 1 file changed, 5 insertions(+), 32 deletions(-) diff --git a/src/collections/resources/articles/terraform-with-meshery/index.mdx b/src/collections/resources/articles/terraform-with-meshery/index.mdx index a2ea589bd47c..b60ae3038167 100644 --- a/src/collections/resources/articles/terraform-with-meshery/index.mdx +++ b/src/collections/resources/articles/terraform-with-meshery/index.mdx @@ -30,50 +30,23 @@ import Button from "../../../../reusecore/Button";

- One way to further enhance your use of Terraform is by integrating it with - Meshery. Meshery is a cloud-native management platform that provides a unified - interface for managing and monitoring your infrastructure resources, including - those managed by Terraform. By integrating Terraform with Meshery, you can - leverage the power and flexibility of both tools to streamline your - infrastructure management process. + One way to further enhance your use of Terraform is by integrating it with Meshery. Meshery is a cloud-native management platform that provides a unified interface for managing and monitoring your infrastructure resources, including those managed by Terraform. By integrating Terraform with Meshery, you can leverage the power and flexibility of both tools to streamline your infrastructure management process.

- One of the key benefits of using Terraform with Meshery is the ability to - manage and monitor your infrastructure resources in a consistent and - centralized manner. With Meshery, you can view and manage all of your - infrastructure resources, whether they are managed by Terraform or other - tools, from a single dashboard. This allows you to quickly identify any issues - or potential problems with your infrastructure, and take action to resolve - them in a timely manner. + One of the key benefits of using Terraform with Meshery is the ability to manage and monitor infrastructure resources in a consistent and centralized manner. With Meshery, you can view and manage all of your infrastructure resources, whether they are managed by Terraform or other tools, from a single dashboard. This allows you to quickly identify any issues or potential problems with your infrastructure, and take action to resolve them in a timely manner.

- Another benefit of using Terraform with Meshery is the ability to automate - your infrastructure management process. With Meshery, you can create and - manage automated pipelines for provisioning and managing your infrastructure - resources. This can help to reduce the time and effort required to manage your - infrastructure, and allow you to focus on other important tasks. + Another benefit of using Terraform with Meshery is the ability to automate your infrastructure management process. With Meshery, you can create and manage automated pipelines for provisioning and managing your infrastructure resources. This can help to reduce the time and effort required to manage your infrastructure, and allow you to focus on other important tasks.

- In addition to these benefits, using Terraform with Meshery also provides a - number of other advantages. For example, Meshery integrates with a wide range - of tools and platforms, allowing you to easily incorporate your existing - infrastructure resources into your management process. This can help to reduce - the complexity of managing your infrastructure, and make it easier to keep - everything running smoothly. + In addition to these benefits, using Terraform with Meshery also provides a number of other advantages. For example, Meshery integrates with a wide range of tools and platforms, allowing you to easily incorporate your existing infrastructure resources into your management process. This can help to reduce the complexity of managing your infrastructure, and make it easier to keep everything running smoothly.

- Overall, the use of Terraform with Meshery can help to streamline and improve - your infrastructure management process. By integrating these two powerful - tools, you can gain greater visibility and control over your infrastructure - resources, and automate many of the tasks involved in managing them. This can - help to reduce the time and effort required to manage your infrastructure, and - allow you to focus on other important tasks. So, it is a good idea to use - Terraform with Meshery to improve the efficiency and effectiveness of your - infrastructure management process. + Overall, the use of Terraform with Meshery can help to streamline and improve your infrastructure management process. By integrating these two powerful tools, you can gain greater visibility and control over your infrastructure resources, and automate many of the tasks involved in managing them. This can help to reduce the time and effort required to manage your infrastructure, and allow you to focus on other important tasks. So, it is a good idea to use Terraform with Meshery to improve the efficiency and effectiveness of your infrastructure management process.