asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

docs: Adds new index page and design tweaks (#833)

Browse Source
This commit is contained in:
Oliver Windall Juhl
2021-11-22 17:01:18 +01:00
committed by GitHub
parent f387b4919f
commit 0380cdf0b2
17 changed files with 305 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/content/guides/carts-in-medusa.md
View File

@@ -1,8 +1,8 @@
---
title: Carts in Medusa
title: Carts
---
# Carts in Medusa
# Carts
In Medusa a Cart serves the purpose of collecting the information needed to create an Order, including what products to purchase, what address to send the products to and which payment method the purchase will be processed by.

2
docs/content/how-to/plugins.md → docs/content/guides/plugins.md
View File

@@ -1,5 +1,5 @@
---
title: Plugins in Medusa
title: Plugins
---
# Plugins

89
docs/content/homepage.mdx Normal file
View File

@@ -0,0 +1,89 @@
---
id: homepage
title: Introduction
description: 'What is Medusa?'
slug: /
hide_table_of_contents: true
---
import useBaseUrl from '@docusaurus/useBaseUrl'
import Link from '@docusaurus/Link'
import Tabs from '@theme/Tabs'
import TabItem from '@theme/TabItem'
Medusa is an open-source Shopify alternative.
It provides you with the primitives to create amazing digital commerce experiences.
<div class="container" style={{ padding: 0 }}>
<div class="row is-multiline">
<div class="col col--6">
<Link class="card" to="/tutorial/set-up-your-development-environment" style={{ height: '100%' }}>
<div class="card__body">
<h4>Tutorial</h4>
<p>Set up your local development environment</p>
</div>
</Link>
</div>
<div class="col col--6">
<Link class="card" to="/tutorial/adding-custom-functionality" style={{ height: '100%' }}>
<div class="card__body">
<h4>Make it your own</h4>
<p>Create custom endpoints, services, or subscribers.</p>
</div>
</Link>
</div>
<div class="col col--6">
<Link class="card" to="/guides/plugins" style={{ height: '100%' }}>
<div class="card__body">
<h4>Plugins</h4>
<p>Add or build a plugin to make your engine more powerful.</p>
</div>
</Link>
</div>
<div class="col col--6">
<Link class="card" to="/how-to/deploying-on-heroku" style={{ height: '100%' }}>
<div class="card__body">
<h4>Deploy in seconds</h4>
<p>Use one of our guides to deploy your Medusa project in seconds.</p>
</div>
</Link>
</div>
</div>
</div>
## Quickstart
Visit our [Quickstart](https://github.com/medusajs/medusa#-quickstart) to get up and running in minutes with only a couple of commands.
## What you'll find here
<div class="container" style={{ padding: 0 }}>
<div class="row is-multiline">
<div class="col col--4">
<Link class="card" to="/quickstart/quick-start" style={{ height: '100%' }}>
<div class="card__body">
<h4>Quickstart</h4>
<p>A short guide to get you quickly started.</p>
</div>
</Link>
</div>
<div class="col col--4">
<Link class="card" to="/how-to/notification-api" style={{ height: '100%' }}>
<div class="card__body">
<h4>How-to and guides</h4>
<p>Guides and walkthroughs of concepts, tools, deployment and APIs.</p>
</div>
</Link>
</div>
{/* Ref */}
<div class="col col--4">
<a class="card" href="https://docs.medusa-commerce.com/api/store" target="_blank" style={{ height: '100%' }}>
<div class="card__body">
<h4>Reference</h4>
<p>Technical documentation of the Medusa API.</p>
</div>
</a>
</div>
</div>
</div>

46
docs/content/tutorial/2-adding-custom-functionality.md
View File

@@ -19,11 +19,11 @@ The custom functionality will do a number of things:
We will begin our custom implementation by adding a custom service. In you project create a new file at `/src/services/welcome.js`. Open the newly created file and add a class:
```javascript
import { BaseService } from "medusa-interfaces";
import { BaseService } from "medusa-interfaces"
class WelcomeService extends BaseService {
constructor({}) {
super();
super()
}
async registerOptin(cartId, optin) {}
@@ -31,7 +31,7 @@ class WelcomeService extends BaseService {
async sendWelcome(orderId) {}
}
export default WelcomeService;
export default WelcomeService
```
We will be filling out each of the methods in turn, but before we get to that it should be noted that placing files in `/src/services` has a special meaning in Medusa projects. When Medusa starts up it will look for files in this folder and register exports from these files to the global container. The global container holds all services and repositories in your Medusa project allowing for dependency injection. Dependency injection is a software development technique in which objects only receive other objects that it depends upon.
@@ -126,18 +126,18 @@ Similarly to the `/src/services` directory, the `/src/api` directory has a speci
Create a new file at `/src/api/index.js` and add the following controller:
```javascript
import { Router } from "express";
import bodyParser from "body-parser";
import { Router } from "express"
import bodyParser from "body-parser"
export default () => {
const app = Router();
const app = Router()
app.post("/welcome/:cart_id", bodyParser.json(), async (req, res) => {
// TODO
});
})
return app;
};
return app
}
```
### Controller implementation
@@ -146,33 +146,33 @@ Our endpoint controller's implementation will be very simple. It will extract th
```javascript
app.post("/welcome/:cart_id", bodyParser.json(), async (req, res) => {
const { cart_id } = req.params;
const { optin } = req.body;
const { cart_id } = req.params
const { optin } = req.body
// Validate that the optin value was provided.
// If not respond with a Bad Request status
if (typeof optin !== "boolean") {
res.status(400).json({
message: "You must provide an boolean optin value in the request body",
});
return;
})
return
}
const welcomeService = req.scope.resolve("welcomeService");
const welcomeService = req.scope.resolve("welcomeService")
try {
await welcomeService.registerOptin(cart_id, optin);
await welcomeService.registerOptin(cart_id, optin)
res.status(200).json({
success: true,
});
})
} catch (err) {
// This is not supposed to happen.
res.status(500).json({
message: "Something unexpected happened.",
});
})
}
});
})
```
In the implementation above we are first validating that the request body is structured correctly so that we can proceed with our opt-in registration. If the validation fails we respond with 400 Bad Request which is an HTTP code that indicates that the client that sent the request has not provided the correct values.
@@ -223,17 +223,17 @@ The final thing that we will add in this part of the tutorial is the subscriber
```javascript
class WelcomeSubscriber {
constructor({ welcomeService, eventBusService }) {
this.welcomeService_ = welcomeService;
this.welcomeService_ = welcomeService
eventBusService.subscribe("order.placed", this.handleWelcome);
eventBusService.subscribe("order.placed", this.handleWelcome)
}
handleWelcome = async (data) => {
return await this.welcomeService_.sendWelcome(data.id);
};
return await this.welcomeService_.sendWelcome(data.id)
}
}
export default WelcomeSubscriber;
export default WelcomeSubscriber
```
The implementation above is all that is needed to automate the `sendWelcome` function to be called every time a new order is created. The subscriber class here delegates all of the business logic to the `sendWelcome` function, where we are checking for opt-in and first time buyers.

49
integration-tests/api/__tests__/admin/customer.js
View File

@@ -132,6 +132,55 @@ describe("/admin/customers", () => {
})
})
describe("POST /admin/customers", () => {
beforeEach(async () => {
try {
await adminSeeder(dbConnection)
} catch (err) {
console.log(err)
throw err
}
})
afterEach(async () => {
const db = useDb()
await db.teardown()
})
it("Correctly creates customer", async () => {
const api = useApi()
const response = await api
.post(
"/admin/customers",
{
first_name: "newf",
last_name: "newl",
email: "new@email.com",
password: "newpassword",
metadata: { foo: "bar" },
},
{
headers: {
Authorization: "Bearer test_token",
},
}
)
.catch((err) => {
console.log(err)
})
expect(response.status).toEqual(201)
expect(response.data.customer).toEqual(
expect.objectContaining({
first_name: "newf",
last_name: "newl",
email: "new@email.com",
metadata: { foo: "bar" },
})
)
})
})
describe("POST /admin/customers/:id", () => {
beforeEach(async () => {
try {

2
packages/medusa/src/api/routes/admin/customers/create-customer.ts
View File

@@ -27,7 +27,7 @@ import { validator } from "../../../../utils/validator"
* $ref: "#/components/schemas/customer"
*/
export default async (req, res) => {
const validated = await validator(AdminPostCustomersReq, req.bodyn)
const validated = await validator(AdminPostCustomersReq, req.body)
const customerService: CustomerService = req.scope.resolve("customerService")
const customer = await customerService.create(validated)

27
www/docs/docusaurus.config.js
View File

@@ -1,6 +1,3 @@
const lightCodeTheme = require("prism-react-renderer/themes/github")
const darkCodeTheme = require("prism-react-renderer/themes/dracula")
const path = require("path")
const docsPath = path.join(__dirname, "../../docs/content")
@@ -35,6 +32,12 @@ module.exports = {
placeholder: "Search docs...",
appId: algoliaAppId,
},
prism: {
defaultLanguage: "js",
plugins: ["line-numbers", "show-language"],
theme: require("@kiwicopple/prism-react-renderer/themes/vsDark"),
darkTheme: require("@kiwicopple/prism-react-renderer/themes/vsDark"),
},
navbar: {
hideOnScroll: true,
logo: {
@@ -44,30 +47,31 @@ module.exports = {
},
items: [
{
type: "search",
position: "left",
href: "https://docs.medusa-commerce.com",
label: "Overview",
},
{
type: "doc",
docId: "tutorial/set-up-your-development-environment",
position: "right",
label: "Tutorial",
},
{
href: `https://docs.medusa-commerce.com/api/store`,
target: "_self",
position: "right",
label: "API Reference",
label: "Reference",
},
{
href: "https://github.com/medusajs/medusa",
className: "navbar-github-link",
href: "https://github.com/medusajs/medusa/",
position: "right",
},
{
type: "search",
position: "right",
},
],
},
footer: {
style: "dark",
links: [
{
title: "Docs",
@@ -115,9 +119,6 @@ module.exports = {
],
copyright: `© ${new Date().getFullYear()} Medusa Commerce`,
},
prism: {
theme: darkCodeTheme,
},
},
presets: [
[

3
www/docs/package.json
View File

@@ -17,6 +17,7 @@
"@docusaurus/core": "2.0.0-beta.3",
"@docusaurus/preset-classic": "2.0.0-beta.3",
"@docusaurus/theme-search-algolia": "^2.0.0-beta.3",
"@kiwicopple/prism-react-renderer": "github:kiwicopple/prism-react-renderer",
"@mdx-js/react": "^1.6.21",
"@svgr/webpack": "^5.5.0",
"clsx": "^1.1.1",
@@ -43,4 +44,4 @@
"devDependencies": {
"prettier": "^2.3.2"
}
}
}

29
www/docs/sidebars.js
View File

@@ -11,25 +11,20 @@
module.exports = {
tutorialSidebar: [
{
type: "doc",
id: "homepage",
label: "Overview",
},
{
type: "doc",
id: "quickstart/quick-start",
label: "Quickstart",
},
// {
// type: 'category',
// label: 'Quickstart',
// items: [
// {
// type: 'doc',
// id: 'quickstart/quick-start-docker',
// label: 'Quickstart w. Docker (Coming soon!)',
// },
// ],
// },
{
type: "category",
label: "Tutorials",
collapsed: false,
items: [
{
type: "doc",
@@ -43,20 +38,12 @@ module.exports = {
type: "doc",
id: "tutorial/adding-custom-functionality",
},
// {
// type: "doc",
// id: "tutorial/linking-your-local-project-with-medusa-cloud",
// },
],
},
{
type: "category",
label: "How to",
items: [
{
type: "doc",
id: "how-to/plugins",
},
{
type: "doc",
id: "how-to/notification-api",
@@ -101,6 +88,10 @@ module.exports = {
type: "doc",
id: "guides/fulfillment-api",
},
{
type: "doc",
id: "guides/plugins",
},
{
type: "doc",
id: "guides/checkouts",

87
www/docs/src/css/custom.css
View File

@@ -20,14 +20,14 @@
--ifm-medusa-gray: #f0f0f0;
/* Fonts */
--ifm-code-font-size: 90%;
--ifm-font-family-base: "Open Sans";
--ifm-code-font-size: 80%;
--ifm-font-family-base: "custom-font",BlinkMacSystemFont,-apple-system,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif;
/* Sidebar */
--doc-sidebar-width: 350px !important;
/* Docs Page */
--ifm-docs-page-max-width: 700px;
--ifm-docs-page-max-width: 850px;
/* Toc */
--ifm-toc-border-color: #f0f0f0;
@@ -48,6 +48,18 @@ html[data-theme="dark"] {
--ifm-toc-border-color: #333;
}
h1 {
font-size: 2.5em;
}
h1, h2, h3 {
font-weight: normal;
}
p {
font-weight: 450;
}
/* DocSearch */
html[data-theme="light"] .DocSearch-Button {
@@ -73,6 +85,16 @@ html[data-theme="dark"] .docusaurus-highlight-code-line {
background-color: rgba(0, 0, 0, 0.3);
}
.navbar {
z-index: 1000;
font-size: 14px;
}
/* Medusa logo */
.navbar__brand {
width: 100px;
}
.navbar-github-link:before {
content: "";
width: 24px;
@@ -90,8 +112,14 @@ html[data-theme="dark"] .docusaurus-highlight-code-line {
article {
max-width: var(--ifm-docs-page-max-width);
margin-left: auto;
margin-right: auto;
}
@media screen and (min-width: 966px) {
article {
margin-left: 50px;
margin-right: 50px;
max-width: none
}
}
.docusaurus-highlight-code-line {
@@ -129,8 +157,14 @@ article {
}
.sidebar-bg {
background: var(--ifm-medusa-gray);
height: 100%;
font-size: 14px;
font-weight: 400;
}
/* Medusa logo */
.sidebar-bg img {
width: 100px;
}
.padding-top--md {
@@ -138,8 +172,16 @@ article {
}
a.menu__link.menu__link--active.active {
border-left: 4px solid var(--ifm-color-primary);
padding-left: 12px;
padding-left: 16px;
}
a.menu__link--sublist::after {
background: var(--ifm-menu-link-sublist-icon) 50% / 1rem 2rem;
}
.menu__list-item > a {
font-weight: 450;
color: #1f1f1f;
}
/* Pagination */
@@ -181,10 +223,35 @@ footer .footer__title {
width: 150px;
}
.footer--dark {
--ifm-footer-background-color: #333;
footer {
background-color: #ffffff !important;
border-top: 1px solid var(--ifm-toc-border-color);
}
.react-toggle {
display: none;
}
/* Cards */
.card {
border: 1px solid #1f1f1f;
border-radius: 8px;
}
.col {
margin-top: 10px !important;
margin-bottom: 10px !important;
}
.prism-code {
background-color: none;
word-break: break-word;
font-size: 0.8rem;
outline: none !important;
}
.prism-code div,
.prism-code div:focus,
.prism-code div:active {
outline: none !important;
}

20
www/docs/src/pages/index.js
View File

@@ -1,20 +0,0 @@
import React from "react"
import { Banner } from "../components/Banner/"
import { Intro } from "../components/Intro/"
import { Layout } from "../components/Layout/"
import styles from "./index.module.css"
export default function Home() {
return (
<Layout title={`Docs`} description="some description...">
<div className={styles.container}>
<Banner />
<Intro
title="Explore and learn how to use Medusa."
desc="Get up and running within 5 minutes."
/>
{/* <TabsPanel items={CARDS_DATA} /> */}
</div>
</Layout>
)
}

28
www/docs/src/theme/SearchBar/index.js
View File

@@ -5,17 +5,17 @@
* LICENSE file in the root directory of this source tree.
*/
import React, { useState, useRef, useCallback, useMemo } from "react"
import { createPortal } from "react-dom"
import useDocusaurusContext from "@docusaurus/useDocusaurusContext"
import { useHistory } from "@docusaurus/router"
import { useBaseUrlUtils } from "@docusaurus/useBaseUrl"
import Link from "@docusaurus/Link"
import Head from "@docusaurus/Head"
import useSearchQuery from "@theme/hooks/useSearchQuery"
import { DocSearchButton, useDocSearchKeyboardEvents } from "@docsearch/react"
import useAlgoliaContextualFacetFilters from "@theme/hooks/useAlgoliaContextualFacetFilters"
import Head from "@docusaurus/Head"
import Link from "@docusaurus/Link"
import { useHistory } from "@docusaurus/router"
import { translate } from "@docusaurus/Translate"
import { useBaseUrlUtils } from "@docusaurus/useBaseUrl"
import useDocusaurusContext from "@docusaurus/useDocusaurusContext"
import useAlgoliaContextualFacetFilters from "@theme/hooks/useAlgoliaContextualFacetFilters"
import useSearchQuery from "@theme/hooks/useSearchQuery"
import React, { useCallback, useMemo, useRef, useState } from "react"
import { createPortal } from "react-dom"
import styles from "./styles.module.css"
let DocSearchModal = null
@@ -46,7 +46,7 @@ const replaceUrl = (item) => {
function Hit({ hit, children }) {
if (hit.url.includes("/api/store") || hit.url.includes("/api/admin")) {
let url = replaceUrl(hit)
const url = replaceUrl(hit)
return <a href={url}>{children}</a>
}
@@ -131,13 +131,13 @@ function DocSearch({ contextualSearch, ...props }) {
const navigator = useRef({
navigate({ item }) {
let url = replaceUrl(item)
//Need to type out the entire URL to prevent it from attempting to open the page
//as part of the docusaurus project. Which will fail.
const url = replaceUrl(item)
// Need to type out the entire URL to prevent it from attempting to open the page
// as part of the docusaurus project. Which will fail.
window.location = `https://docs.medusa-commerce.com${url}`
},
navigateNewTab({ item }) {
let url = replaceUrl(item)
const url = replaceUrl(item)
const windowReference = window.open(url, "_blank", "noopener")
if (windowReference) {

3
www/docs/src/theme/SearchBar/styles.css
View File

@@ -15,6 +15,9 @@
transition: all var(--ifm-transition-fast)
var(--ifm-transition-timing-default);
width: 100%;
max-width: 175px;
border-radius: 8px;
background-color: #f5f6f7;
}
.DocSearch-Container {

2
www/docs/src/theme/SearchBar/styles.module.css
View File

@@ -17,8 +17,6 @@
padding: var(--ifm-navbar-item-padding-vertical)
var(--ifm-navbar-item-padding-horizontal);
flex: 1;
margin-left: 200px;
padding-right: 100px;
}
.searchBox button {

BIN
www/docs/static/img/logo.png vendored
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 83 KiB

22
www/docs/static/img/logo.svg vendored
View File

@@ -1,14 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371.2226 96">
<title>medusa-logo-one-colour-rgb</title>
<g id="black-rgb">
<path id="logoMark" d="M77.8271,15.6225,56.08,3.0664a22.8877,22.8877,0,0,0-22.8877,0L11.4438,15.6225A22.8877,22.8877,0,0,0,0,35.4438V60.5562A22.8877,22.8877,0,0,0,11.4438,80.3775L33.1919,92.9336a22.8877,22.8877,0,0,0,22.8877,0L77.8271,80.3775A22.8876,22.8876,0,0,0,89.271,60.5562V35.4438A22.8876,22.8876,0,0,0,77.8271,15.6225ZM44.6357,70.3178A22.3178,22.3178,0,1,1,66.9531,48,22.3176,22.3176,0,0,1,44.6357,70.3178Z" style="fill: #0a3149"/>
<g id="type">
<path id="type_CompoundPathItem_" data-name="type &lt;CompoundPathItem&gt;" d="M163.5361,22.6571h14.1416V71.662H169.206V30.078L155.625,71.662h-8.8907l-13.581-41.0948V71.662h-8.4707V22.6571h14.2109l12.3906,39.2734Z" style="fill: #0a3149"/>
<path id="type_CompoundPathItem_2" data-name="type &lt;CompoundPathItem&gt;" d="M220.4453,60.6c-2.03,7.3516-8.2608,12.042-17.0118,12.042-10.9209,0-17.8525-7.3515-17.8525-18.4824s7.001-18.4814,18.0625-18.4814c12.3213,0,18.6914,9.24,15.332,20.7216H194.0517c.7012,5.8106,3.9209,9.2413,9.5215,9.2413,3.92,0,7.001-1.82,8.1914-5.0411Zm-26.253-9.871H211.414c.49-5.04-2.38-8.33-7.9111-8.33C198.2529,42.3993,195.0322,45.34,194.1923,50.7294Z" style="fill: #0a3149"/>
<path id="type_CompoundPathItem_3" data-name="type &lt;CompoundPathItem&gt;" d="M252.5742,22.6571h7.9814V71.662h-7.9814V66.4813a13.8489,13.8489,0,0,1-11.9014,6.1611c-9.24,0-15.752-7.3515-15.752-18.4824,0-11.06,6.4415-18.4814,15.752-18.4814a13.85,13.85,0,0,1,11.9014,6.16Zm.3506,31.5029c0-6.9306-3.9209-11.4814-9.8018-11.4814-5.95,0-9.87,4.5508-9.87,11.4814s3.92,11.4815,9.87,11.4815C249.0039,65.6415,252.9248,61.0907,252.9248,54.16Z" style="fill: #0a3149"/>
<path id="type_CompoundPathItem_4" data-name="type &lt;CompoundPathItem&gt;" d="M290.2333,36.6581h7.9805V71.662h-7.9805V65.3612c-2.4511,4.69-6.4414,7.1406-11.3417,7.1406-9.7305,0-11.2715-9.6611-11.2715-15.8916V36.6581h7.98V56.5409c0,4.62,1.0508,9.03,6.0918,9.03,5.18,0,8.541-4.62,8.541-11.0605Z" style="fill: #0a3149"/>
<path id="type_CompoundPathItem_5" data-name="type &lt;CompoundPathItem&gt;" d="M304.0888,59.1307H311.79c-.49,4.3408,2.7305,7.07,8.1914,7.07,4.2695,0,7.1406-1.68,7.1406-4.2,0-7.0009-22.5429-1.96-22.5429-15.0517,0-7,6.5107-11.27,14.9824-11.27,9.3808,0,16.1709,5.25,14.7011,13.1611h-7.7714c.98-3.99-2.17-6.7207-7-6.7207-4.0606,0-6.7207,1.82-6.7207,4.34,0,7.0713,22.6123,1.6807,22.6123,14.9825,0,7.07-6.3711,11.2011-15.4717,11.2011C310.04,72.6424,303.5292,67.6014,304.0888,59.1307Z" style="fill: #0a3149"/>
<path id="type_CompoundPathItem_6" data-name="type &lt;CompoundPathItem&gt;" d="M371.2226,51.78V71.662H363.872V65.5711a13.7856,13.7856,0,0,1-12.6015,7.0713c-7.42,0-12.0411-4.3408-12.0411-10.4316,0-7.07,6.16-11.3408,16.0313-11.3408a36.6377,36.6377,0,0,1,7.9814.91c0-5.3213-1.8906-9.1709-7.4912-9.1709-4.2,0-6.791,2.1-5.95,6.02H341.749c-1.89-7.77,4.9707-12.9511,14.0722-12.9511C366.0419,35.6786,371.2226,42.0487,371.2226,51.78Zm-7.7,6.0909a25.2,25.2,0,0,0-7.6308-1.19c-5.7413,0-8.5411,2.1006-8.5411,5.32,0,2.8008,2.1,4.27,5.53,4.27A10.8339,10.8339,0,0,0,363.5224,57.871Z" style="fill: #0a3149"/>
</g>
</g>
<svg width="336" height="87" viewBox="0 0 336 87" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M80.8003 54.8094V32.008C80.8003 24.5885 76.8191 17.8023 70.4854 14.0926L50.7603 2.78232C44.3361 -0.92744 36.4642 -0.92744 30.04 2.78232L10.4054 14.0926C3.9812 17.8023 0 24.6789 0 32.008V54.7189C0 62.1384 3.9812 68.9246 10.3149 72.6343L29.9495 84.0351C36.3737 87.7448 44.2457 87.7448 50.6699 84.0351L70.3044 72.6343C76.8191 69.0151 80.8003 62.1384 80.8003 54.8094Z" fill="#56FBB1"/>
<path d="M40.3552 63.5861C51.4989 63.5861 60.5327 54.5523 60.5327 43.4086C60.5327 32.2649 51.4989 23.2312 40.3552 23.2312C29.2115 23.2312 20.1777 32.2649 20.1777 43.4086C20.1777 54.5523 29.2115 63.5861 40.3552 63.5861Z" fill="white"/>
<path d="M147.938 20.5167H160.696V64.8528H153.005V27.2124L140.79 64.8528H132.737L120.431 27.6648V64.8528H112.74V20.5167H125.589L136.808 56.0761L147.938 20.5167Z" fill="#0A3149"/>
<path d="M199.512 54.8094C197.702 61.505 192.002 65.6672 184.13 65.6672C174.267 65.6672 167.934 58.9715 167.934 48.928C167.934 38.8845 174.267 32.1889 184.311 32.1889C195.44 32.1889 201.231 40.5132 198.155 50.9186H175.625C176.258 56.1666 179.153 59.243 184.22 59.243C187.749 59.243 190.554 57.6143 191.64 54.7189H199.512V54.8094ZM175.715 45.8516H191.278C191.73 41.3275 189.106 38.3416 184.13 38.3416C179.425 38.3416 176.439 40.9656 175.715 45.8516Z" fill="#0A3149"/>
<path d="M228.557 20.5167H235.795V64.8528H228.557V60.1478C226.114 63.6766 222.404 65.7577 217.789 65.7577C209.465 65.7577 203.493 59.062 203.493 49.0185C203.493 38.975 209.284 32.2794 217.789 32.2794C222.404 32.2794 226.114 34.27 228.557 37.8892V20.5167ZM228.828 49.0185C228.828 42.7753 225.299 38.6131 219.961 38.6131C214.532 38.6131 211.003 42.7753 211.003 49.0185C211.003 55.2618 214.532 59.4239 219.961 59.4239C225.299 59.3334 228.828 55.2618 228.828 49.0185Z" fill="#0A3149"/>
<path d="M262.578 33.1842H269.816V64.8528H262.578V59.1525C260.316 63.4051 256.787 65.5767 252.353 65.5767C243.577 65.5767 242.129 56.7999 242.129 51.1901V33.0937H249.367V51.0996C249.367 55.2618 250.363 59.243 254.887 59.243C259.592 59.243 262.578 55.0808 262.578 49.1995V33.1842Z" fill="#0A3149"/>
<path d="M275.156 53.4521H282.123C281.67 57.3428 284.566 59.8763 289.542 59.8763C293.433 59.8763 295.967 58.3381 295.967 56.0761C295.967 49.7424 275.608 54.2665 275.608 42.4133C275.608 36.0796 281.489 32.1889 289.18 32.1889C297.686 32.1889 303.839 36.8939 302.481 44.1325H295.424C296.329 40.5132 293.433 38.0702 289.09 38.0702C285.38 38.0702 283.028 39.6989 283.028 41.9609C283.028 48.3851 303.477 43.4991 303.477 55.5332C303.477 61.9574 297.686 65.6672 289.452 65.6672C280.494 65.6672 274.613 61.1431 275.156 53.4521Z" fill="#0A3149"/>
<path d="M335.868 46.8469V64.8528H329.173V59.3334C326.82 63.4051 322.929 65.7577 317.772 65.7577C311.076 65.7577 306.914 61.8669 306.914 56.3475C306.914 49.9233 312.524 46.1231 321.391 46.1231C323.834 46.1231 326.368 46.3945 328.63 46.9374C328.63 42.1419 326.911 38.6131 321.844 38.6131C318.043 38.6131 315.691 40.5132 316.415 44.042H309.086C307.366 36.9844 313.61 32.2794 321.844 32.2794C331.163 32.2794 335.868 37.9797 335.868 46.8469ZM328.901 52.3663C326.82 51.6425 324.287 51.2806 322.025 51.2806C316.867 51.2806 314.334 53.1807 314.334 56.0761C314.334 58.6096 316.234 59.9668 319.31 59.9668C323.925 59.9668 327.725 56.9809 328.901 52.3663Z" fill="#0A3149"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

11
www/docs/yarn.lock
View File

@@ -1519,6 +1519,12 @@
dependencies:
"@hapi/hoek" "^9.0.0"
"@kiwicopple/prism-react-renderer@github:kiwicopple/prism-react-renderer":
version "1.0.2"
resolved "https://codeload.github.com/kiwicopple/prism-react-renderer/tar.gz/4a09100a587bce2d94d7ac8ed3564a61c6e70781"
dependencies:
prismjs "^1.22.0"
"@mdx-js/mdx@^1.6.21":
version "1.6.22"
resolved "https://registry.yarnpkg.com/@mdx-js/mdx/-/mdx-1.6.22.tgz#8a723157bf90e78f17dc0f27995398e6c731f1ba"
@@ -6609,6 +6615,11 @@ prism-react-renderer@^1.2.1:
resolved "https://registry.yarnpkg.com/prism-react-renderer/-/prism-react-renderer-1.2.1.tgz#392460acf63540960e5e3caa699d851264e99b89"
integrity sha512-w23ch4f75V1Tnz8DajsYKvY5lF7H1+WvzvLUcF0paFxkTHSp42RS0H5CttdN2Q8RR3DRGZ9v5xD/h3n8C8kGmg==
prismjs@^1.22.0:
version "1.25.0"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.25.0.tgz#6f822df1bdad965734b310b315a23315cf999756"
integrity sha512-WCjJHl1KEWbnkQom1+SzftbtXMKQoezOCYs5rECqMN+jP+apI7ftoflyqigqzopSO3hMhTEb0mFClA8lkolgEg==
prismjs@^1.23.0:
version "1.24.1"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.24.1.tgz#c4d7895c4d6500289482fa8936d9cdd192684036"