Basis-Theory · kevinperaza · Dec 8, 2022 · Dec 8, 2022
@@ -62,7 +62,7 @@ go get github.com/Basis-Theory/basistheory-go/v3
 
 Our SDKs enable you to quickly and easily integrate with the API. Select one of the language tabs to see instructions on how to install the SDK and view code examples in that language.
 
-<Alert type={Alerts.INFO}>
+<Alert>
   If you don't see your language listed,{" "}
   <a href="mailto:support@basistheory.com?subject=API%20SDK%20Language%20Support">
     contact us

@@ -58,7 +58,7 @@ Application. Below, we describe each Application Type and how to choose between
 
 See [Access Rules](/docs/concepts/access-controls#what-are-access-rules) for more information.
 
-<Alert type={Alerts.INFO}>
+<Alert>
   <code>container</code> is only required for <code>public</code> and{" "}
   <code>private</code>
   applications, whilst <code>conditions</code> is only required for <code>

@@ -14,11 +14,10 @@ Basis Theory requires the API key to be included in all API requests to the serv
 
 `BT-API-KEY: key_N88mVGsp3sCXkykyN2EFED`
 
-<Alert type={Alerts.INFO}>
+<Alert>
   You must replace <code>key_N88mVGsp3sCXkykyN2EFED</code> with your API key
   supplied when you{" "}
-  <a href="/docs/api/applications#create-application">created an Application</a>
-  .
+  <a href="/docs/api/applications#create-application">created an Application</a>.
 </Alert>
 
 ### Request

@@ -199,7 +199,7 @@ then the following request body will be sent to the destination:
 The `token:use` permission is required in order to detokenize tokens within a proxy request.
 At most, 100 tokens may be detokenized within a single proxy request. You can find more information about the supported detokenization expressions [here](/docs/expressions/detokenization).
 
-<Alert type={Alerts.INFO}>
+<Alert>
   For more detailed examples about how to detokenize within the Proxy, check out
   our{" "}
   <a href="/docs/expressions/detokenization#examples">
@@ -218,7 +218,7 @@ If an error occurs within the proxy (eg. missing or invalid `BT-PROXY-URL` heade
 | ------------- | ----- | ---------------------------------------- |
 | `proxy_error` | _any_ | A standard Basis Theory [error](#errors) |
 
-<Alert type={Alerts.INFO}>
+<Alert>
   If you are interested in using the proxy and your use case is not currently
   supported, please{" "}
   <a href="mailto:support@basistheory.com?subject=Proxy%20Feature%20Request">

@@ -912,7 +912,7 @@ a single complex token that contains several of the request parameters.
 
 At most, 100 tokens may be detokenized within a single Reactor request.
 
-<Alert type={Alerts.INFO}>
+<Alert>
   For more detailed examples about how to detokenize within Reactors, check out
   our{" "}
   <a href="/docs/expressions/detokenization#examples">

@@ -49,7 +49,7 @@ Tenants provide a way to logically group your Applications and tokens. Common us
 | `included_monthly_active_tokens` | _long_                                                          | Number of included monthly active tokens for the billing plan               |
 | `monthly_active_tokens`          | _long_                                                          | Number of tokens that have been created, read, or used in the current month |
 
-<Alert type={Alerts.INFO}>
+<Alert>
   To learn more about Monthly Active Tokens (MATs), check out{" "}
   <a href="/docs/concepts/what-are-mats/">our guide</a>.
 </Alert>

@@ -242,7 +242,7 @@ Multiple terms may be combined using the `AND`, `OR` and `NOT` operators (case s
   (type:social_security_number AND !metadata.user_id:1234) OR data:111-11-1111
 ```
 
-<Alert type={Alerts.INFO}>
+<Alert>
   The supported Lucene syntax is currently limited to the operations documented
   above, and not all standard Lucene syntax is supported. If you would like to
   have support for any additional Lucene features, please{" "}

@@ -40,7 +40,7 @@ Creating an association between two existing tokens requires read permission on
 | `parent_id` | true     | _string_ | `null`  | The ID of the parent token |
 | `child_id`  | true     | _string_ | `null`  | The ID of the child token  |
 
-<Alert type={Alerts.INFO}>
+<Alert>
   Bi-directional associations can be made between two tokens by creating a token
   association and swapping the <code>parent_id</code> and <code>child_id</code>.
 </Alert>

@@ -64,7 +64,7 @@ An expired token is **deleted** from the tenant up to **1 hour** after it's expi
 | `DateTime` String w/ Offset | 8/26/2030 7:23:57 PM -07:00 |
 | `ShortDate` String          | 9/27/2030                   |
 
-<Alert type={Alerts.INFO}>
+<Alert>
   If an offset is not provided with the <code>DateTime</code> string, it's
   considered that the provided time is in <b>UTC</b>. When using the{" "}
   <code>ShortDate</code> format, the expiration time will be set as{" "}
@@ -517,7 +517,7 @@ Update an existing token for the Tenant.
 
 <Permission content="token:update" />
 
-<Alert type={Alerts.INFO}>
+<Alert>
   The Update Tokens endpoint uses a different content-type to support
   merge-patch operations. Requests need the <code>Content-Type</code> header to
   be set to <code>application/merge-patch+json</code>. Requests made with a
@@ -694,7 +694,7 @@ Returns the updated [token](#token-object) if successful. Returns [an error](/do
 }
 ```
 
-<Alert type={Alerts.INFO}>
+<Alert>
   If the updated token results in a duplicate of an existing token and the
   application does not have the original token's read permission, the{" "}
   <code>data</code>,<code>metadata</code>, <code>fingerprint_expression</code>,{" "}

@@ -38,7 +38,7 @@ Tokens that match your search criteria that are contained within other non-fetch
 Any token that is used within a [Reactor](./what-are-reactors) or the [Proxy](./what-is-the-proxy) will be counted as a MAT.
 This includes any tokens that were [Detokenized](/docs/expressions/detokenization) within a Reactor or Proxy request.
 
-<Alert type={Alerts.INFO}>
+<Alert>
   A token is only counted as a Monthly Active Token if it has been interacted
   with through the Basis Theory API. Tokens that are viewed or interacted with
   through the Portal are not counted as MATs.
@@ -83,7 +83,7 @@ and will have a short grace period to enter your payment details while continuin
 
 There is a limit of 5 interactions per MAT per month. Our billing is designed to be simple for almost every use-case for using our platform. In some situations more than 5 interactions per MAT in a month are required. [Contact us](https://basistheory.com/contact) for alternate plans available when this limit isn’t enough.
 
-<Alert type={Alerts.INFO}>
+<Alert>
   Are you interested in using Basis Theory in production? Please{" "}
   <a href="https://basistheory.com/contact" target="_blank">
     contact us

@@ -42,7 +42,7 @@ module.exports = async function (req) {
 };
 ```
 
-<Alert type={Alerts.INFO} title="Quickstart hint">
+<Alert title="Quickstart hint">
   Find a list of our fully compliant and maintained Official Reactor Formulas
   from within our{" "}
   <a href="https://portal.basistheory.com/reactors/formulas" target="_blank">
@@ -71,7 +71,7 @@ curl "https://api.basistheory.com/reactors" \
   }'
 ```
 
-<Alert type={Alerts.INFO}>
+<Alert>
   We encrypt and store each configuration setting in our secure PCI Level 1 and
   SOC2 environment.
 </Alert>

@@ -1,19 +1,33 @@
 .container {
   display: flex;
-  padding: 10px 15px 10px 15px;
+  align-items: flex-start;
+  padding: 13px 18px 13px 18px;
   gap: 12px;
   border-radius: 4px;
   margin: 15px 0;
 }
 
+.container > div:has(.svg) {
+  padding-right: 14px;
+}
+
+.title {
+  font-style: normal;
+  font-weight: 500;
+  font-size: 16px;
+  line-height: 130%;
+  letter-spacing: 0.15px;
+  margin-bottom: 10px;
+}
+
 .content {
   margin: 0;
   text-align: justify;
+  line-height: 145%;
 }
 
 .error {
   background: var(--bt-alert-error-background);
-
   border: 1px solid rgba(245, 108, 157, 0.3);
   color: var(--bt-alert-error-color);
 }
@@ -36,17 +50,25 @@
   color: var(--bt-alert-success-color);
 }
 
-.title {
-  font-style: normal;
-  font-weight: 500;
-  font-size: 16px;
-  line-height: 130%;
-  letter-spacing: 0.15px;
-  margin-bottom: 10px;
-}
-
 .svg {
+  margin: 0 auto;
+  display: block;
   width: 25px;
   height: 25px;
-  margin-right: 5px;
+}
+
+.error .svg path {
+  fill: var(--bt-alert-error-color);
+}
+
+.info .svg path {
+  fill: var(--bt-alert-info-color);
+}
+
+.warning .svg path {
+  fill: var(--bt-alert-warning-color);
+}
+
+.success .svg path {
+  fill: var(--bt-alert-success-color);
 }
@@ -22,7 +22,7 @@ interface Alert {
 }
 
 export const Alert = ({
-  type,
+  type = Alerts.INFO,
   title,
   content,
   children,

@@ -144,7 +144,7 @@
     rgba(255, 255, 255, 0) 100%
   );
 
-  /* Warnings */
+  /* Alerts */
   --bt-alert-warning-color: #ffa726;
   --bt-alert-warning-background: linear-gradient(
     90deg,
@@ -230,6 +230,7 @@ p {
 code {
   border: 1px solid rgba(0, 0, 0, 0.1);
   font-family: "Source Code Pro";
+  color: var(--ifm-font-color-base);
   font-weight: 500;
 }