Merge branch 'master' into M-DEV-1/replace-images-on-colors-page

Author: Vivek Vishal

src/collections/integrations/azure-app-service/icons/white/azure-app-service-white.svg

@@ -86,11 +86,10 @@ table {
 		}
 	}
 	
-	th, tr{
-		&:hover{
+	td:hover{
 			box-shadow: 0px 0px 15px -10px ${props => props.theme.whiteToBlack};
 			transform: translateY(0px);
 		}
 	}
   }
-`;
+`;

src/collections/integrations/azure-architecture/icons/color/azure-architecture-color.svg

@@ -15,5 +15,5 @@ export default ArchitectureDiagramPage;
 export const Head = () => {
   return <SEO title="Design Architecture Diagram | Layer5"
     description="Create architecture diagram for AWS, GCP or Kubernetes"
-    image="/images/meshery-logo-dark-text.webp" />;
+    image="/images/solutions-collaborate.png" />;
 };

src/collections/integrations/azure-architecture/icons/white/azure-architecture-white.svg

@@ -14,5 +14,5 @@ export default Meshery;
 export const Head = () => {
   return  <SEO title="GitOps with Meshery"
     description="GitOps, lifecycle, performance, and configuration management for cloud native infrastructure as code. Manage your Kubernetes clusters visually. Use the catalog of patterns and best practices."
-    image="/images/meshery-logo-dark-text.png" />;
+    image="/images/solutions-gitops.png" />;
 };

src/components/SMI-Table/SMITable.style.js

@@ -106,7 +106,7 @@ const ViewsSectionWrapper = styled.div`
       /* max-width: 90%; */
       padding-bottom: 2%;
     }
-  }
+  
 
   h4 {
       max-width: 90%;
@@ -215,7 +215,8 @@ const ViewsSectionWrapper = styled.div`
       height:150px;
       padding: 2rem;
       box-sizing: border-box;
-      background-color: ${(props) => props.theme.backgroundColor}; 
+      background-color: ${(props) => props.theme.backgroundColor};
+      color: ${(props) => props.theme.whiteEightToBlack}; 
       margin-bottom: 1rem; 
       border-radius: 1rem;
       //box-shadow: ${(props) => props.theme.boxShadowGreen00D3A9ToBlackTwoFive};
@@ -233,6 +234,7 @@ const ViewsSectionWrapper = styled.div`
     .box .boxText {
       margin-top: 1rem;
       text-align: center;
+      color: ${(props) => props.theme.whiteEightToBlack};
     }
 
     @media only screen and (max-width: 700px) {