@redocly/marketing-pages 0.1.39 → 0.1.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import e from"react";import r from"styled-components";import{TextGradient as
|
|
1
|
+
import e from"react";import r from"styled-components";import{TextGradient as s}from"../TextGradient/TextGradient";import{TextNormal as n,TextSmall as g}from"../TypographyElements/TypographyElements";import{Box as l}from"../../ui/Box";import{formatDateString as x}from"../../utils/dates";import{breakpoints as a}from"@redocly/theme/core/utils";import{Link as f}from"@redocly/theme/components/Link/Link";function h(t){const{publishedDate:i,author:m,title:c,image:d,categories:p}=t;return e.createElement(l,{mt:5},e.createElement(b,null,e.createElement(y,null,p.map(o=>e.createElement(u,{key:o.category.id,to:`/blog/category/${o.category.id}${o.subcategory?.id?`/${o.subcategory?.id}`:""}`},o.category.label,o.subcategory?.label&&` \u2022 ${o.subcategory?.label}`))),e.createElement(v,{my:5},c)),e.createElement(w,{author:m,publishedDate:x(i)}),e.createElement(I,null,e.createElement(B,{src:d,alt:"post"})))}const u=r(f)`
|
|
2
2
|
display: flex;
|
|
3
3
|
height: 32px;
|
|
4
4
|
padding: 0 12px;
|
|
@@ -9,30 +9,34 @@ import e from"react";import r from"styled-components";import{TextGradient as x}f
|
|
|
9
9
|
border: 1px solid #dcdde5;
|
|
10
10
|
background: #fbfbfc;
|
|
11
11
|
cursor: pointer;
|
|
12
|
-
|
|
12
|
+
text-decoration: none;
|
|
13
|
+
color: var(--text-color-primary);
|
|
14
|
+
white-space: nowrap;
|
|
15
|
+
`,y=r.div`
|
|
13
16
|
display: flex;
|
|
14
17
|
align-items: flex-start;
|
|
15
18
|
gap: 8px;
|
|
16
|
-
|
|
19
|
+
flex-wrap: wrap;
|
|
20
|
+
`,b=r.div`
|
|
17
21
|
display: flex;
|
|
18
22
|
flex-direction: column;
|
|
19
23
|
gap: 16px;
|
|
20
|
-
`,
|
|
24
|
+
`,w=({author:t,publishedDate:i})=>e.createElement(l,{display:"flex"},e.createElement(k,{bg:t.image}),e.createElement($,null,e.createElement(E,{hasAuthorBIO:t.authorBIO},e.createElement(n,{color:"var(--color-text-dark)",fontWeight:500},"By ",t.name),e.createElement(n,{style:{marginLeft:t.authorBIO&&"10px"}},i.toLocaleString("en-US",{year:"numeric",month:"long",day:"2-digit"}))),e.createElement(g,{color:"var(--color-text-dimmed)"},t.authorBIO))),E=r.div`
|
|
21
25
|
display: flex;
|
|
22
26
|
flex-wrap: wrap;
|
|
23
27
|
flex-direction: ${({hasAuthorBIO:t})=>t?"row":"column"};
|
|
24
|
-
|
|
28
|
+
`,v=r(s)`
|
|
25
29
|
font-family: var(--font-family);
|
|
26
30
|
font-size: 44px;
|
|
27
31
|
line-height: 48px;
|
|
28
32
|
font-weight: 600;
|
|
29
33
|
margin-top: 0;
|
|
30
34
|
|
|
31
|
-
@media screen and (min-width: ${
|
|
35
|
+
@media screen and (min-width: ${a.medium}) {
|
|
32
36
|
font-size: 64px;
|
|
33
37
|
line-height: 78px;
|
|
34
38
|
}
|
|
35
|
-
`,
|
|
39
|
+
`,k=r.div`
|
|
36
40
|
width: 80px;
|
|
37
41
|
height: 80px;
|
|
38
42
|
border-radius: 50%;
|
|
@@ -42,7 +46,7 @@ import e from"react";import r from"styled-components";import{TextGradient as x}f
|
|
|
42
46
|
background-size: cover;
|
|
43
47
|
background-position: center;
|
|
44
48
|
z-index: 1;
|
|
45
|
-
|
|
49
|
+
`,$=r.div`
|
|
46
50
|
display: flex;
|
|
47
51
|
flex-direction: column;
|
|
48
52
|
justify-content: center;
|
|
@@ -53,15 +57,15 @@ import e from"react";import r from"styled-components";import{TextGradient as x}f
|
|
|
53
57
|
padding: 0 10px 0 58px;
|
|
54
58
|
background: white;
|
|
55
59
|
border-radius: 8px;
|
|
56
|
-
`,
|
|
60
|
+
`,B=r.img`
|
|
57
61
|
height: 100%;
|
|
58
62
|
max-height: 210px;
|
|
59
63
|
width: auto;
|
|
60
64
|
|
|
61
|
-
@media screen and (min-width: ${
|
|
65
|
+
@media screen and (min-width: ${a.small}) {
|
|
62
66
|
max-height: 320px;
|
|
63
67
|
}
|
|
64
|
-
`,
|
|
68
|
+
`,I=r.div`
|
|
65
69
|
display: flex;
|
|
66
70
|
align-items: center;
|
|
67
71
|
justify-content: center;
|
|
@@ -70,7 +74,7 @@ import e from"react";import r from"styled-components";import{TextGradient as x}f
|
|
|
70
74
|
background-color: #deeeff;
|
|
71
75
|
overflow: hidden;
|
|
72
76
|
|
|
73
|
-
@media screen and (min-width: ${
|
|
77
|
+
@media screen and (min-width: ${a.small}) {
|
|
74
78
|
height: 370px;
|
|
75
79
|
}
|
|
76
|
-
`;export{
|
|
80
|
+
`;export{h as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import*as t from"react";import n from"styled-components";import{breakpoints as l}from"@redocly/theme/core/utils";import{Tooltip as P}from"@redocly/theme/components/Tooltip/Tooltip";import{Link as M}from"@redocly/theme/components/Link/Link";import{periodsList as S,seatIntervals as f,seatProPlanIntervals as k}from"../pricingData/data";import{Period as y,Plan as v,Product as x}from"../types/types";import{choosePeriod as L}from"../calculations/choosePeriod";import{plansList as T}from"../pricingData/data";import{PlanCard as z}from"./PlanCard";import{Switcher as O}from"../../calculator/components/Switcher";import{chooseProduct as N}from"../calculations/chooseProduct";import{ActiveCheckmark as A}from"../images/ActiveCheckmark";const D=(e,o,a,m)=>{let s=0;const p=!m||isNaN(m)||m<1?1:m;return o===v.PRO?a===y.YEAR?s=k[e][a]/12:s=k[e][a]:(o===v.ENTERPRISE&&(a===y.YEAR?s=f[e][a][f[e][a].findIndex(c=>p<=c.tierEnd&&p>=c.tierStart)].price/12:s=f[e][a][f[e][a].findIndex(c=>p<=c.tierEnd&&p>=c.tierStart)].price),s)},fe=({setCalculatorProperties:e,period:o,plan:a,amountSelectedProjects:m,onChange:s,onFocus:p,onBlur:c,seats:h,inputValue:b,calculatorProperties:r})=>{const E=[{name:x.REALM,subName:": All combined",gradient:["#1677FF","#08C7E0"]},{name:x.REDOC,color:"#1677FF",activeColor:"#E5F1FF",descriptionProperties:[{title:"OpenAPI",tooltip:"Render OpenAPI docs with the beauty and function of Redoc. Try it panel with Replay. Code samples generated automatically in a dozen languages."},{title:"GraphQL",tooltip:"Redoc renders GraphQL SDL files with a consistent design to OpenAPI."},{title:"AsyncAPI",tooltip:"AsyncAPI docs rendered natively\u2014just drop in your spec file."},{title:"SOAP",tooltip:"Redoc renders SOAP WSDL files with an extension. Functional but not beautiful. SOAP is outdated folks, do you really want us spending more time there?"},{title:"Mock servers",tooltip:"Mock servers are generated automatically for every OpenAPI and hosted at the same custom domain as your website."},{title:"Lint",tooltip:"Make sure API definitions are correct and enforce from a variety of rules or your own configurable rules."}]},{name:x.REVEL,color:"#735CFF",activeColor:"#EDEBFF",descriptionProperties:[{title:"Markdown docs",tooltip:"Render Markdown and Markdoc docs. You can also use our built-in Markdoc tags and create your own."},{title:"React pages",tooltip:"Render tsx and jsx files perfect for landing pages or other fancy pages. This actual web page is one of them."},{title:"Component ejections",tooltip:"Eject components (React code) to the file system in a folder where front end developers can wrap or tweak the components to meet your vision."},{title:"Localization",tooltip:"Translate your content and built-in website tokens."},{title:"Multi-product support",tooltip:"Segment your website by product, if you desire, and have separate configurations and content per product."}]},{name:x.REEF,color:"#A45CFF",activeColor:"#F1E5FF",descriptionProperties:[{title:"Catalog",linkTo:"/reef",underlined:!0,tooltip:"Catalog all the things, including your APIs. Filter by metadata."},{title:"Scorecard for governance",tooltip:"Lint your APIs? This allows you to run multiple rulesets against each API. It collates the results into an interactive report some managers cannot live without."},{title:"API functions",tooltip:"Build custom backend logic (auth, data fetching, forms, and more) right inside your docs with API functions."},{title:"Markdown docs",tooltip:"Render Markdown and Markdoc docs. You can also use our built-in Markdoc tags and create your own."},{title:"Dynamic client registration",tooltip:"Want to allow customers to register a client/app, get API credentials, and request access to various API products or scopes?"}]}];return t.createElement(ie,null,t.createElement(q,{id:"selected-products"},E.map((i,g)=>t.createElement(Y,{key:g,isLastElement:E.length-1===g,isRealm:i.name===x.REALM},t.createElement(G,null,t.createElement("div",null,t.createElement(O,{height:"22px",transform:"translateX(18px)",width:"40px",right:"0",top:"0",activeColor:i.gradient?`linear-gradient(90deg, ${i.gradient[0]} 0%, ${i.gradient[1]} 100%)`:i.color,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,onClick:()=>N(e,i.name,r.coreProducts)})),t.createElement("p",null,i.name,i.subName&&t.createElement("span",null,i.subName))),i.descriptionProperties&&i.descriptionProperties.map((d,u)=>t.createElement(Q,{key:u},d.linkTo?t.createElement(B,{to:d.linkTo,underlined:d.underlined.toString()},t.createElement($,null,t.createElement(C,{isFirst:u===0,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.color}),t.createElement(I,{isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.activeColor},r.coreProducts.includes(i.name)||r.coreProducts.length===3?t.createElement(A,{fill:i.color}):t.createElement(R,null))),d.title,t.createElement(w,{src:require("../images/external.svg")})):t.createElement(j,{underlined:d.underlined},t.createElement($,null,t.createElement(C,{isFirst:u===0,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.color}),t.createElement(I,{isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.activeColor},r.coreProducts.includes(i.name)||r.coreProducts.length===3?t.createElement(A,{fill:i.color}):t.createElement(R,null))),t.createElement("p",null,d.title)),d.tooltip&&t.createElement(H,{tip:d.tooltip,width:"
|
|
1
|
+
import*as t from"react";import n from"styled-components";import{breakpoints as l}from"@redocly/theme/core/utils";import{Tooltip as P}from"@redocly/theme/components/Tooltip/Tooltip";import{Link as M}from"@redocly/theme/components/Link/Link";import{periodsList as S,seatIntervals as f,seatProPlanIntervals as k}from"../pricingData/data";import{Period as y,Plan as v,Product as x}from"../types/types";import{choosePeriod as L}from"../calculations/choosePeriod";import{plansList as T}from"../pricingData/data";import{PlanCard as z}from"./PlanCard";import{Switcher as O}from"../../calculator/components/Switcher";import{chooseProduct as N}from"../calculations/chooseProduct";import{ActiveCheckmark as A}from"../images/ActiveCheckmark";const D=(e,o,a,m)=>{let s=0;const p=!m||isNaN(m)||m<1?1:m;return o===v.PRO?a===y.YEAR?s=k[e][a]/12:s=k[e][a]:(o===v.ENTERPRISE&&(a===y.YEAR?s=f[e][a][f[e][a].findIndex(c=>p<=c.tierEnd&&p>=c.tierStart)].price/12:s=f[e][a][f[e][a].findIndex(c=>p<=c.tierEnd&&p>=c.tierStart)].price),s)},fe=({setCalculatorProperties:e,period:o,plan:a,amountSelectedProjects:m,onChange:s,onFocus:p,onBlur:c,seats:h,inputValue:b,calculatorProperties:r})=>{const E=[{name:x.REALM,subName:": All combined",gradient:["#1677FF","#08C7E0"]},{name:x.REDOC,color:"#1677FF",activeColor:"#E5F1FF",descriptionProperties:[{title:"OpenAPI",tooltip:"Render OpenAPI docs with the beauty and function of Redoc. Try it panel with Replay. Code samples generated automatically in a dozen languages."},{title:"GraphQL",tooltip:"Redoc renders GraphQL SDL files with a consistent design to OpenAPI."},{title:"AsyncAPI",tooltip:"AsyncAPI docs rendered natively\u2014just drop in your spec file."},{title:"SOAP",tooltip:"Redoc renders SOAP WSDL files with an extension. Functional but not beautiful. SOAP is outdated folks, do you really want us spending more time there?"},{title:"Mock servers",tooltip:"Mock servers are generated automatically for every OpenAPI and hosted at the same custom domain as your website."},{title:"Lint",tooltip:"Make sure API definitions are correct and enforce from a variety of rules or your own configurable rules."}]},{name:x.REVEL,color:"#735CFF",activeColor:"#EDEBFF",descriptionProperties:[{title:"Markdown docs",tooltip:"Render Markdown and Markdoc docs. You can also use our built-in Markdoc tags and create your own."},{title:"React pages",tooltip:"Render tsx and jsx files perfect for landing pages or other fancy pages. This actual web page is one of them."},{title:"Component ejections",tooltip:"Eject components (React code) to the file system in a folder where front end developers can wrap or tweak the components to meet your vision."},{title:"Localization",tooltip:"Translate your content and built-in website tokens."},{title:"Multi-product support",tooltip:"Segment your website by product, if you desire, and have separate configurations and content per product."}]},{name:x.REEF,color:"#A45CFF",activeColor:"#F1E5FF",descriptionProperties:[{title:"Catalog",linkTo:"/reef",underlined:!0,tooltip:"Catalog all the things, including your APIs. Filter by metadata."},{title:"Scorecard for governance",tooltip:"Lint your APIs? This allows you to run multiple rulesets against each API. It collates the results into an interactive report some managers cannot live without."},{title:"API functions",tooltip:"Build custom backend logic (auth, data fetching, forms, and more) right inside your docs with API functions."},{title:"Markdown docs",tooltip:"Render Markdown and Markdoc docs. You can also use our built-in Markdoc tags and create your own."},{title:"Dynamic client registration",tooltip:"Want to allow customers to register a client/app, get API credentials, and request access to various API products or scopes?"}]}];return t.createElement(ie,null,t.createElement(q,{id:"selected-products"},E.map((i,g)=>t.createElement(Y,{key:g,isLastElement:E.length-1===g,isRealm:i.name===x.REALM},t.createElement(G,null,t.createElement("div",null,t.createElement(O,{height:"22px",transform:"translateX(18px)",width:"40px",right:"0",top:"0",activeColor:i.gradient?`linear-gradient(90deg, ${i.gradient[0]} 0%, ${i.gradient[1]} 100%)`:i.color,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,onClick:()=>N(e,i.name,r.coreProducts)})),t.createElement("p",null,i.name,i.subName&&t.createElement("span",null,i.subName))),i.descriptionProperties&&i.descriptionProperties.map((d,u)=>t.createElement(Q,{key:u},d.linkTo?t.createElement(B,{to:d.linkTo,underlined:d.underlined.toString()},t.createElement($,null,t.createElement(C,{isFirst:u===0,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.color}),t.createElement(I,{isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.activeColor},r.coreProducts.includes(i.name)||r.coreProducts.length===3?t.createElement(A,{fill:i.color}):t.createElement(R,null))),d.title,t.createElement(w,{src:require("../images/external.svg")})):t.createElement(j,{underlined:d.underlined},t.createElement($,null,t.createElement(C,{isFirst:u===0,isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.color}),t.createElement(I,{isActive:r.coreProducts.includes(i.name)||r.coreProducts.length===3,activeColor:i.activeColor},r.coreProducts.includes(i.name)||r.coreProducts.length===3?t.createElement(A,{fill:i.color}):t.createElement(R,null))),t.createElement("p",null,d.title)),d.tooltip&&t.createElement(H,{tip:d.tooltip,width:"250px",children:t.createElement("img",{src:require("../images/tooltip.svg"),style:{maxWidth:"14px",maxHeight:"14px"}})})))))),t.createElement(te,null,t.createElement(ee,null,t.createElement(Z,null,t.createElement("p",null,"Seats"),t.createElement(K,null,t.createElement(J,{placeholder:"40",pattern:"\\d+(\\.\\d+)?",value:b!==void 0?b:h,onChange:s,onFocus:p,onBlur:c}),t.createElement(P,{tip:"Seats count for users who have the OWNER, MEMBER, or COMMITTER roles. Additional roles such as BILLING and VIEWER are users that do not count towards your seat limits.",children:t.createElement("img",{src:require("../images/tooltip.svg"),style:{maxWidth:"14px"}})}))),t.createElement(U,null,t.createElement(_,null,S.map(i=>t.createElement(X,{key:i,onClick:()=>L(e,i,a),selected:o===i},t.createElement(F,null,i,"ly")))),o===y.MONTH&&t.createElement(W,{src:require("../images/save-one-month-badge.svg")}))),t.createElement(V,null,T.map((i,g)=>t.createElement(z,{key:g,plan:i,period:o,price:D(m,i.name,o,h),isCustom:i.name===v.ENTERPRISE_PLUS||h>500})))))},W=n.img`
|
|
2
2
|
position: absolute;
|
|
3
3
|
right: 9px;
|
|
4
4
|
margin-bottom: 5px;
|
|
@@ -164,6 +164,7 @@ import*as t from"react";import n from"styled-components";import{breakpoints as l
|
|
|
164
164
|
`,H=n(P)`
|
|
165
165
|
span {
|
|
166
166
|
min-width: 300px;
|
|
167
|
+
|
|
167
168
|
}
|
|
168
169
|
`,Q=n.div`
|
|
169
170
|
display: flex;
|