From 5c411b4b9ac0c53e31f1ac2536a28526e8c5f448 Mon Sep 17 00:00:00 2001 From: Stevan Freeborn <65925598+StevanFreeborn@users.noreply.github.com> Date: Sun, 9 Apr 2023 23:13:02 -0500 Subject: [PATCH] feat: continue to work on site --- .vscode/settings.json | 2 +- public/images/favicon.ico | Bin 0 -> 15086 bytes src/app/components/Code.module.css | 69 +++++++++++++++- src/app/components/Code.tsx | 75 ++++++++++++++---- src/app/components/Section.module.css | 12 ++- src/app/layout.tsx | 8 ++ src/app/page.module.css | 11 ++- src/app/page.tsx | 11 ++- src/docs/version_002/authentication/copy.md | 8 +- .../version_002/authentication/example.md | 10 ++- src/docs/version_002/introduction/copy.md | 2 +- 11 files changed, 177 insertions(+), 31 deletions(-) create mode 100644 public/images/favicon.ico diff --git a/.vscode/settings.json b/.vscode/settings.json index b2547cd..490a9aa 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,5 +1,5 @@ { "typescript.tsdk": "node_modules\\typescript\\lib", "typescript.enablePromptUseWorkspaceTsdk": true, - "cSpell.words": ["markdoc"] + "cSpell.words": ["markdoc", "Onpsring"] } diff --git a/public/images/favicon.ico b/public/images/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..fe0a4f94751d67989974f2cbec394dacbd037b6b GIT binary patch literal 15086 zcmeI3S%@4(7{_bfBj(V}VKgr~gSa93pm`GUil`t;kcjx?i;0O!KyZCCFNt`d4?&5d zh(}NaFEoe>iY7ZT9vC4PiHb+E5F{!di)Ykz$KQXad#o+Gr|;>+bi;3|tE;}FzOJtB zuC6hr$Ml-Tiw$YrJU?X2xyG1!-OJB5W(~{^)S{MBr!0tbL$j?in zhx%du|4!K>a0OfpOL9in*0W&ye}H@~C;xrDx+nft5bph5`PDi5@3*5{sm7A&aoa%M zu>R96e_cBoOJd)DEB~ile{L+(AH7YgNq;*|4f1QrN5og_wCZpPwAX2|maE$0MS!tb z^C#EBJ@8NtJcy1<<5;KO+3*&)-wd-p%jsSCgibzCeky2PN>*Dz@*ksjFv9*C%k~8O zdJmP~Y5C65cXxzsz2CfT)z{qFS&-)aT{0)atDsnD&C4|r_UBMX>k9nXt?yJnsti4P zws_ssr@nMmCmG7s=XZJa<->=t2ox91Mbwv}eF zzZd!W8o&C6zwhaU>QMJG_yh8?{}Z~N2CbuuLTjtD}88Z|Ri{+4AjboZS{;*~v2+U~FH9|sSB?uDbE^$9`fzXlqAH9y~e-e>U2JHN$ Qh4yW>9h{n1*(gZ%U%DpPQUCw| literal 0 HcmV?d00001 diff --git a/src/app/components/Code.module.css b/src/app/components/Code.module.css index 1073562..f20fa56 100644 --- a/src/app/components/Code.module.css +++ b/src/app/components/Code.module.css @@ -16,6 +16,71 @@ font-size: 0.8rem; } -.snippetContent { - padding: 0.5rem 1rem; +.snippetContent>pre { + overflow: auto; + padding: 1rem; + scrollbar-color: #043160 #0b3766; +} + +.snippetContent>pre::-webkit-scrollbar { + background-color: #0b3766; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} + +.snippetContent>pre::-webkit-scrollbar-thumb { + background-color: #043160; + border-radius: 10px; +} + +@-moz-document url-prefix() { + .snippetContent>pre { + margin-right: 1rem; + } +} + +.copyButtonContainer { + position: relative; +} + +.copyButton { + background-color: #194488; + border: none; + color: white; + border-radius: 5px; + font-size: 0.8rem; + cursor: pointer; +} + +.copyButton:hover { + color: #ee7203; +} + +.tooltip { + position: absolute; + display: block; + top: 50%; + left: 50%; + transform: translate(-50%, -175%); + white-space: nowrap; + background-color: #0b3766; + padding: 0.5rem; + z-index: 100; + box-shadow: 0 0 2px 0.2px #05254a; + border-radius: 0.25rem; + width: 100px; + text-align: center; +} + +.tooltip::before { + content: ""; + position: absolute; + border: 0.5rem solid transparent; + border-top: 0.5rem solid #0b3766; + top: 100%; + left: 2.55rem; +} + +.tooltipHidden { + display: none; } \ No newline at end of file diff --git a/src/app/components/Code.tsx b/src/app/components/Code.tsx index 44b0913..6687fd5 100644 --- a/src/app/components/Code.tsx +++ b/src/app/components/Code.tsx @@ -1,22 +1,63 @@ +'use client'; + +import { MouseEvent, useState } from 'react'; import styles from './Code.module.css'; function CodeCopyButton() { + const [copyButtonTooltip, setCopyButtonTooltip] = + useState(false); + + const [showTooltip, setShowTooltip] = + useState(false); + + const handleCopy = (e: MouseEvent) => { + setCopyButtonTooltip(true); + setTimeout(() => { + setCopyButtonTooltip(false); + }, 1000); + + const target = e.currentTarget; + const code = + target.parentElement?.parentElement?.parentElement?.querySelector( + 'pre' + )?.innerText ?? ''; + + navigator.clipboard.writeText(code); + }; + return ( - + + + + + ); } @@ -35,9 +76,9 @@ export default function Code({
{heading}
- 
-        {children}
-
+
+ {children} +
); } diff --git a/src/app/components/Section.module.css b/src/app/components/Section.module.css index 08feeed..1680de0 100644 --- a/src/app/components/Section.module.css +++ b/src/app/components/Section.module.css @@ -3,8 +3,9 @@ align-items: flex-start; width: 100%; gap: 2rem; - border-bottom: 1px solid #848586; padding: 5rem; + max-width: 1450px; + } @media screen and (max-width: 1000px) { @@ -12,16 +13,25 @@ flex-direction: column; align-items: flex-start; justify-content: center; + padding: 2.5rem; gap: 1rem; } } .container>article { flex: 1; + min-width: 0; width: 100%; + max-width: 600px; } .container>article>p { margin-top: 20px; color: #c1c9d2 +} + +.container>article>p>code { + background-color: #0b3766; + padding: 0.2rem 0.5rem; + border-radius: 5px; } \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index b1cad57..fbda6ac 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -8,6 +8,14 @@ import './globals.css'; export const metadata = { title: 'Onspring API Docs', description: 'Documentation for the Onspring API', + icons: { + icon: [ + { + url: 'images/favicon.ico', + type: 'image/x-icon', + }, + ], + }, }; export default function RootLayout({ diff --git a/src/app/page.module.css b/src/app/page.module.css index 4217f18..ceb333a 100644 --- a/src/app/page.module.css +++ b/src/app/page.module.css @@ -1,8 +1,15 @@ .container { - max-width: 1450px; display: flex; width: 100%; flex-direction: column; - justify-content: center; + justify-content: flex-start; align-items: center; + margin: 0 auto; + overflow-y: auto; +} + +.divider { + width: 100%; + height: 1px; + background-color: #848586; } \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 2de2abb..490fcf2 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -12,10 +12,13 @@ export default function Home() { return (
{versionTwoSections.map(section => ( -
- {section.copy} - {section.example} -
+ <> +
+ {section.copy} + {section.example} +
+
 
+ ))}
); diff --git a/src/docs/version_002/authentication/copy.md b/src/docs/version_002/authentication/copy.md index c331cc2..3891d47 100644 --- a/src/docs/version_002/authentication/copy.md +++ b/src/docs/version_002/authentication/copy.md @@ -1,3 +1,9 @@ # Authentication -This is the copy for the authentication page. +The Onpsring API uses API keys to authenticate requests. You can view and manage your API keys your instance. + +The API key needs to be provided in every request. This is done by adding the `X-ApiKey` header to the request. + +API Keys are specific to an instance. If you are using the API to access data from multiple instances, you will need to create an API key for each instance. The API key must be in an `Enabled` status and it must be assigned a role that will control the permissions for requests made by the API key. The role assigned should be in an `Active` status. + +If the role assigned to the API key does not have sufficient permissions to perform the requested action, an error will be returned. Onspring administrators may configure roles for API keys just as they would any other role in Onspring. However each API key can have only one assigned role. diff --git a/src/docs/version_002/authentication/example.md b/src/docs/version_002/authentication/example.md index 532ed8e..85bedc1 100644 --- a/src/docs/version_002/authentication/example.md +++ b/src/docs/version_002/authentication/example.md @@ -1,3 +1,9 @@ -# Example +# X-ApiKey Header -This is an example for the authentication page. +{% code heading="X-API KEY" language="text" %} + +```text +X-ApiKey: 000000ffffff000000ffffff/00000000-ffff-0000-ffff-000000000000 +``` + +{% /code %} diff --git a/src/docs/version_002/introduction/copy.md b/src/docs/version_002/introduction/copy.md index 73f7d60..df37835 100644 --- a/src/docs/version_002/introduction/copy.md +++ b/src/docs/version_002/introduction/copy.md @@ -2,4 +2,4 @@ The Onspring API is organized around REST. It enables external programs to retrieve, save, and delete data within your Onspring instance. The Onspring API implements version 3 of the Open API Specification (OAS). -The Onspring API does support bulk operation for some, but not all endpoints. Bulk operations are not supported for endpoints that create, update, or delete data. The one exception is the bulk delete endpoint, which is used to delete multiple records at once. +The Onspring API does support bulk operation for some, but not all endpoints. Bulk operations are not supported for endpoints that create, update, or delete resources. The one exception is the batch delete endpoint for records, which is used to delete multiple records at once.