Basic Configurations

Authentication - auth

• timestamp, signature, app-id, app-uid, app-url, app-key, app-email

• all these parameters are required.

<legend-trade 
  timestamp="1587365207"
  signature="0123456789ABCDEF"
  app-id="Bitrue"
  app-uid="0123456789ABCDEF"
  app-url="https=//www.bitrue.com/"
  app-key="xxxxxxxx"
  app-email="[email protected]"
></legend-trade>

app-phone (optional)

• provide the current user's phone number.

<legend-trade app-phone="+16502683902"></legend-trade>

Application environment - mode

mode (optional)

• production is the default value

• Set it to sandbox if you are testing in the Sandbox environment. The SDK will talk to LP Sandbox servers if you set it.

• To test on your local dev machine, please set a host, e.g. test-legend.kucoin.local 127.0.0.1。

<legend-trade mode="sandbox"></legend-trade>

When your integration goes live, you may delete this code, or set mode=“production”.
The SDK will then talk to LG Production servers.

When you use hostname likelocalhost、127.0.0.1 or [::1] to access local servers for debugging, you are using the development mode -mode="development"

Languages - lang

lang (optional)

• By default - en.
• ISO 639 language codes, en, zh, pt-BR, es-MX.

<legend-trade lang="zh"></legend-trade>

Customer Support Email address - email

email (optional)

• By default - [email protected].
• You can set it to your Customer Support Email if you want, e.g. [email protected]

<legend-trade email="[email protected]"></legend-trade>

UI Styles - style

no-legend (optional)

• By default - false.
• show or not show Legend Trading Logo.

<legend-trade no-legend></legend-trade>

no-trial (optional)

• By default - false.
• Display the price quote UI for new users.

<legend-trade no-trial></legend-trade>

no-sell (optional)

• By default - false.
• Disable the Sell and off-ramp.

<legend-trade no-sell></legend-trade>

primary-color (Optional)

Change the webpage's theme color.

<legend-trade primary-color="#6dabe4"></legend-trade>

url-style (optional)

Your own and customized styles, if needed.

<legend-trade url-style="https://www.bitrue.com/assets/style.css"></legend-trade>

ui-size (optional)

• large | default | small

Set the size of the texts and the UI components.

<legend-trade ui-size="large"></legend-trade>

prefers-color-scheme (optional)

• dark | light
• Set the default theme.

<legend-trade prefers-color-scheme="dark"></legend-trade>

Events

CustomEvent includes event.data

Slot

title

<legend-trade>
  <h4 slot="title">OTC Trading</h4>
</legend-trade>

Customize the styles

• Styling Shadow DOM