diff --git a/src/components/data/dummy-data.js b/src/components/data/dummy-data.js
index a99510c4..19509237 100644
--- a/src/components/data/dummy-data.js
+++ b/src/components/data/dummy-data.js
@@ -56,24 +56,8 @@ const solutionGuideData = [
whiteIcon: "assets/icons/white/jsm-integration-icon.svg",
link: "/",
},
- {
- title: "Software License Management",
- icon: "assets/icons/purple/slm-icon.svg",
- whiteIcon: "assets/icons/white/slm-icon.svg",
- link: "/",
- },
- {
- title: "Cloud Management",
- icon: "assets/icons/purple/cloud-mgmt-icon.svg",
- whiteIcon: "assets/icons/white/cloud-mgmt-icon.svg",
- link: "/",
- },
- {
- title: "ADM",
- icon: "assets/icons/purple/adm-icon.svg",
- whiteIcon: "assets/icons/white/adm-icon.svg",
- link: "/",
- },
+
+
{
title: "Advanced Reporting/DOQL",
icon: "assets/icons/purple/advanced-reporting-icon.svg",
diff --git a/src/pages/index.js b/src/pages/index.js
index fd0bb977..8b982210 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -40,10 +40,10 @@ export default function Home() {
))}
-
+
Solution Guides
-
+
{solutionGuideData.map((card, idx) => (
))}
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 6c852fb6..1c013fa2 100644
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -3,6 +3,8 @@
* and scoped locally.
*/
+
+
.mainSection {
display: flex;
flex-flow: column nowrap;
@@ -76,7 +78,7 @@
background-color: rgba(0, 0, 0, 0.4);
}
.helpSection h2 {
- font-weight: 500;
+ font-weight: 600;
font-size: 1.8rem;
line-height: 2rem;
margin-bottom: 1rem;
@@ -86,10 +88,10 @@
display: flex;
flex-direction: row;
align-items: center;
- justify-content: space-between;
+ justify-content: space-between;
margin: 1.6rem 0;
- width: 100%;
- padding: 0 46px;
+ width: 80%;
+ padding: 0 46px 30px;
}
.cardContainer {
background-color: white;
@@ -99,28 +101,50 @@
text-align: center;
}
+.cardContainerSolution{
+ background-color: white;
+ width: 48%;
+ border: 1px solid #200264;
+ padding: 24px;
+ text-align: center;
+
+}
+
[data-theme="dark"] .cardContainer {
border: 1px solid white;
background-color: rgba(0, 0, 0, 0.4);
}
+
+[data-theme="dark"] .cardContainerSolution {
+ border: 1px solid white;
+ background-color: rgba(0, 0, 0, 0.4);
+}
+
+.cardsContainerSolution {
+ display: grid;
+ grid-template-columns: 2fr 2fr;
+ grid-gap: 1rem;
+}
.cardsContainer {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 1rem;
}
.cardContainer h2 {
- font-weight: 500;
+ font-weight: 600;
font-size: 1.6rem;
line-height: 2rem;
margin-bottom: 1.9rem;
- color: black;
+ color: #1E0068;
}
.solutionsGuidesSeeMore {
+
display: flex;
justify-content: center;
align-items: center;
- color: black;
- grid-column: 2 / span 3;
+ /*color: black;8*/
+ color: transparent !important;
+ /*grid-column: 2 / span 3;*/
font-size: 1.3rem;
min-height: 102px;
}
@@ -129,16 +153,32 @@
color: white;
}
+[data-theme="dark"] .solutionsGuidesSeeMore {
+ color: transparent;
+}
+
@media screen and (max-width: 768px) {
.contentCard {
grid-template-columns: 1fr;
}
+
+ .productsSection {
+ width: 100%;
+ }
}
@media only screen and (max-width: 1100px) and (max-width: 1200px) {
.cardsContainer {
grid-template-columns: 1fr 1fr;
}
+
+ .cardsContainerSolution {
+ grid-template-columns: 1fr 1fr;
+ }
+
+ .cardsContainerSolution {
+ grid-template-columns: 1fr 1fr;
+ }
.solutionsGuidesSeeMore {
grid-column: 1 / span 2;
}
@@ -151,11 +191,16 @@
margin-bottom: 24px;
}
+ .cardContainerSolution {
+ width: 100%;
+ margin-bottom: 24px;
+ }
.cardsContainer_src-pages-index-module{
display: block;
}
.productsSection {
flex-direction: column;
+ width: 100%;
}
}