@broxus/tvm-connect
Version:
TypeScript SDK for connecting to Nekoton-compatible wallets using a unified interface.
71 lines (65 loc) • 3.98 kB
CSS
@import './style.css';
:root {
--tvm-connect-color: var(--global-color, #383838);
--tvm-connect-emphasis-color: var(--global-emphasis-color, #333);
--tvm-connect-muted-color: var(--global-muted-color, #7698bb);
--tvm-connect-link-color: var(--global-link-color, #1e87f0);
--tvm-connect-link-hover-color: var(--global-link-hover-color, #00a6ff);
--tvm-connect-border: var(--global-border, #93b6d8);
--tvm-connect-border-radius: var(--global-border-radius, 12px);
/* Modal */
--tvm-connect-modal-width: 380px;
--tvm-connect-modal-background: var(--modal-background, #f7f9fb);
--tvm-connect-modal-border-radius: 12px;
--tvm-connect-modal-box-shadow: 0 8px 32px 0 rgb(63 74 111 / 12%), 0 1px 4px 0 rgb(63 74 111 / 8%);
--tvm-connect-modal-color: var(--tvm-connect-color);
--tvm-connect-modal-padding-horizontal: 24px;
--tvm-connect-modal-padding-vertical: var(--tvm-connect-modal-padding-horizontal);
--tvm-connect-modal-header-padding-horizontal: 0;
--tvm-connect-modal-header-padding-vertical: var(--tvm-connect-modal-padding-vertical);
--tvm-connect-modal-title-color: var(--tvm-connect-emphasis-color);
--tvm-connect-modal-title-font-size: 20px;
--tvm-connect-modal-title-font-weight: 500;
--tvm-connect-modal-title-line-height: 24px;
--tvm-connect-modal-body-padding-horizontal: 0;
--tvm-connect-modal-body-padding-vertical: var(--tvm-connect-modal-padding-vertical);
--tvm-connect-modal-footer-padding-horizontal: 0;
--tvm-connect-modal-footer-padding-vertical: var(--tvm-connect-modal-padding-vertical);
/* Drawer */
--tvm-connect-drawer-content-background: var(--drawer-content-background, #f7f9fb);
--tvm-connect-drawer-content-border-radius: 16px;
--tvm-connect-drawer-content-box-shadow: 0 8px 32px 0 rgb(63 74 111 / 12%), 0 1px 4px 0 rgb(63 74 111 / 8%);
--tvm-connect-drawer-content-color: var(--tvm-connect-color);
--tvm-connect-drawer-content-padding-horizontal: 24px;
--tvm-connect-drawer-content-padding-vertical: var(--tvm-connect-drawer-content-padding-horizontal);
--tvm-connect-drawer-header-padding-horizontal: 0;
--tvm-connect-drawer-header-padding-vertical: var(--tvm-connect-drawer-content-padding-vertical);
--tvm-connect-drawer-title-color: var(--tvm-connect-emphasis-color);
--tvm-connect-drawer-title-font-size: 22px;
--tvm-connect-drawer-title-font-weight: 500;
--tvm-connect-drawer-title-line-height: 26px;
--tvm-connect-drawer-body-padding-horizontal: 0;
--tvm-connect-drawer-body-padding-vertical: var(--tvm-connect-drawer-content-padding-vertical);
--tvm-connect-drawer-footer-padding-horizontal: 0;
--tvm-connect-drawer-footer-padding-vertical: var(--tvm-connect-drawer-content-padding-vertical);
/* Connector */
--tvm-connect-dropdown-trigger-horizontal-padding: 8px;
--tvm-connect-dropdown-trigger-vertical-padding: 0;
--tvm-connect-dropdown-background: var(--dropdown-background, #fff);
--tvm-connect-dropdown-border-radius: 5px;
--tvm-connect-dropdown-box-shadow: 0 8px 32px 0 rgb(63 74 111 / 12%), 0 1px 4px 0 rgb(63 74 111 / 8%);
--tvm-connect-dropdown-color: var(--tvm-connect-emphasis-color);
--tvm-connect-dropdown-link-color: var(--tvm-connect-muted-color, #0098ea);
--tvm-connect-dropdown-link-hover-color: var(--tvm-connect-color, #00a6ff);
/* Providers list */
--tvm-connect-provider-button-background: var(--button-default-background, #e4eaf1);
--tvm-connect-provider-button-hover-background: var(
--button-default-hover-background,
rgb(0 154.494955 232.2106 / 8%)
);
--tvm-connect-provider-button-hover-color: var(--tvm-connect-color);
--tvm-connect-provider-button-border-width: 2px;
--tvm-connect-provider-button-border-style: solid;
--tvm-connect-provider-button-border: transparent;
--tvm-connect-provider-button-hover-border: var(--button-default-hover-border, #07acff);
}