Skip to content

Commit

Permalink
Merge branch 'develop' into feature/SWED-2279-color_page_update
Browse files Browse the repository at this point in the history
  • Loading branch information
goldenraphti committed Oct 31, 2023
2 parents 9e1789e + e7de957 commit da854b9
Show file tree
Hide file tree
Showing 183 changed files with 2,150 additions and 78 deletions.
1 change: 1 addition & 0 deletions RELEASE_NOTES.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,3 +18,4 @@
## Design System website

- Update the Colors page for SwedbankPay side
- Add the Playbook section in Identity
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
101 changes: 54 additions & 47 deletions src/App/Home/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import Alert from "../components/Alert";

const basename = process.env.basename;
const brandTitle = process.env.brandTitle;
const isSwedbankPay = process.env.isSwedbankPay;

const Home = () => {
useEffect(() => {
Expand Down Expand Up @@ -39,61 +40,67 @@ const Home = () => {
</p>

<div className="row dg-cards-container mt-4">
{routes.map((route) => (
<React.Fragment key={route.title}>
<div
key={route.title}
className={
route.wideCard
? "w-100 order-5"
: "col-12 col-sm-6 col-lg-3 d-flex"
}
>
<Link
to={route.path}
className={`cards cards-primary${
route.wideCard ? " cards-wide m-3" : ""
}`}
{routes
.filter((route) =>
isSwedbankPay
? !route.title.toLowerCase().includes("patterns")
: !route.title.toLowerCase().includes("playbook")
)
.map((route) => (
<React.Fragment key={route.title}>
<div
key={route.title}
className={
route.wideCard
? "w-100 order-5"
: "col-12 col-sm-6 col-lg-3 d-flex"
}
>
{route.wideCard ? (
<div className="cards-content flex-row align-items-center m-0 w-100">
<i
className="material-icons material-icons-outlined mr-3 v-flip"
aria-hidden="true"
>
{route.icon.name}
</i>
<span className="h4 mb-0">{route.entryCardText}</span>
<i
className="material-icons material-icons-outlined ml-auto"
aria-hidden="true"
>
arrow_forward
</i>
</div>
) : (
<div>
<div className="cards-icon">
<Link
to={route.path}
className={`cards cards-primary${
route.wideCard ? " cards-wide m-3" : ""
}`}
>
{route.wideCard ? (
<div className="cards-content flex-row align-items-center m-0 w-100">
<i
className="material-icons-outlined"
className="material-icons material-icons-outlined mr-3 v-flip"
aria-hidden="true"
>
{route.icon.name}
</i>
<span className="h4 mb-0">{route.entryCardText}</span>
<i
className="material-icons material-icons-outlined ml-auto"
aria-hidden="true"
>
arrow_forward
</i>
</div>
<div className="cards-content">
<span className="h4">{route.title}</span>
<span>{route.entryCardText}</span>
) : (
<div>
<div className="cards-icon">
<i
className="material-icons-outlined"
aria-hidden="true"
>
{route.icon.name}
</i>
</div>
<div className="cards-content">
<span className="h4">{route.title}</span>
<span>{route.entryCardText}</span>
</div>
<i className="material-icons" aria-hidden="true">
arrow_forward
</i>
</div>
<i className="material-icons" aria-hidden="true">
arrow_forward
</i>
</div>
)}
</Link>
</div>
</React.Fragment>
))}
)}
</Link>
</div>
</React.Fragment>
))}
<div className="col-12 col-sm-6 col-lg-3 d-flex">
<Link to={"/utilities"} className="cards cards-primary">
<div className="cards-icon">
Expand Down
34 changes: 24 additions & 10 deletions src/App/Identity/identity/Typography/typography.e2e.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,30 @@ test("Typography page exist", async ({ page }) => {
name: "Identity Learn about our fundamental principles",
})
.click();
await expect(
page.getByRole("link", {
name: "Typography",
})
).toHaveCount(page.viewportSize().width < 991 ? 1 : 2);
await page
.getByRole("link", {
name: "Typography See our fronts and sizing arrow_forward",
})
.click();

if (page.viewportSize().width > 991) {
await expect(
page.getByRole("link", {
name: "Typography",
})
).toHaveCount(1);
await page.getByRole("link", { name: "Typography" }).click();
} else {
await expect(
page.getByRole("link", {
name: "Typography",
})
).toHaveCount(0);
await page.getByLabel("Open menu").click();
await page.getByRole("button", { name: "Identity" }).click();

await expect(
page.getByRole("link", {
name: "Typography",
})
).toHaveCount(1);
await page.getByRole("link", { name: "Typography" }).click();
}
});

const viewportsVariants = [
Expand Down
2 changes: 1 addition & 1 deletion src/App/Identity/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import React from "react";
import { RenderPage } from "../utils";

const Core = () => (
<RenderPage path="/identity" initPath="/identity/identity" />
<RenderPage path="/accessibility" initPath="/identity/accessibility" />
);

export default Core;
Loading

0 comments on commit da854b9

Please sign in to comment.