@web3auth/ui/dist/lib.cjs/packages/ui/src/components/Button/styles.css.js

Ui modal for web3Auth

'use strict';

var styleInject_es = require('../../../../../node_modules/style-inject/dist/style-inject.es.js');

var css_248z = ".w3a-parent-container #w3a-modal button.t-btn,.w3a-parent-container a.t-btn{align-items:center;display:flex;justify-content:center;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:linear}.w3a-parent-container #w3a-modal button.t-btn:not(.t-btn-text):disabled,.w3a-parent-container a.t-btn:not(.t-btn-text):disabled{background-color:var(--app-gray-300);border-width:0;color:var(--app-gray-400)}.w3a-parent-container #w3a-modal button.t-btn:not(.t-btn-text):hover:disabled,.w3a-parent-container a.t-btn:not(.t-btn-text):hover:disabled{background-color:var(--app-gray-300);border-color:var(--app-gray-300);color:var(--app-gray-400)}.w3a-parent-container #w3a-modal button.t-btn:not(.t-btn-text):active:disabled,.w3a-parent-container a.t-btn:not(.t-btn-text):active:disabled{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-offset-width:0px;background-color:var(--app-gray-300);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);outline-width:0}.w3a-parent-container #w3a-modal button.t-btn:not(.t-btn-text):disabled:is(.w3a--dark *),.w3a-parent-container a.t-btn:not(.t-btn-text):disabled:is(.w3a--dark *){background-color:var(--app-gray-700);color:var(--app-gray-600)}.w3a-parent-container #w3a-modal .size-xs{font-size:.75rem;height:32px;line-height:1rem;padding:.5rem .75rem}.w3a-parent-container #w3a-modal .size-sm{font-size:.875rem;height:36px;line-height:1.25rem;padding:.5rem .75rem}.w3a-parent-container #w3a-modal .size-md{font-size:.875rem;height:42px;line-height:1.25rem;padding:.625rem 1.25rem}.w3a-parent-container #w3a-modal .size-lg{font-size:1rem;height:48px;line-height:1.5rem;padding:.75rem 1.25rem}.w3a-parent-container #w3a-modal .size-xl{font-size:1rem;height:52px;line-height:1.5rem;padding:.875rem 1rem}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary{background-color:var(--app-primary-600);color:var(--app-on-primary);outline:2px solid #0000;outline-offset:2px}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:hover{background-color:var(--app-primary-700)}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:focus-visible{outline-color:var(--app-primary-600);outline-offset:1px;outline-style:solid;outline-width:1px}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:active{background-color:var(--app-primary-600);outline-color:var(--app-primary-600);outline-offset:1px;outline-style:solid;outline-width:1px}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:is(.w3a--dark *){background-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:hover:is(.w3a--dark *){background-color:var(--app-primary-400)}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:focus-visible:is(.w3a--dark *){outline-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-primary:active:is(.w3a--dark *){background-color:var(--app-primary-500);outline-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary{background-color:initial;border-color:var(--app-gray-500);border-width:1px;color:var(--app-gray-600);outline:2px solid #0000;outline-offset:2px}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:hover{background-color:var(--app-gray-200)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);background-color:initial;border-color:var(--app-primary-600);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);background-color:initial;border-color:var(--app-primary-600);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:is(.w3a--dark *){border-color:var(--app-gray-300);color:var(--app-white)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:hover:is(.w3a--dark *){background-color:var(--app-gray-700)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:focus-visible:is(.w3a--dark *){--tw-ring-color:var(--app-primary-500);background-color:initial;border-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-secondary:active:is(.w3a--dark *){--tw-ring-color:var(--app-primary-500);background-color:initial;border-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary{background-color:var(--app-gray-200);color:var(--app-gray-800)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:hover{background-color:var(--app-gray-300)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);background-color:var(--app-gray-200);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:is(.w3a--dark *){background-color:var(--app-gray-500);color:var(--app-white)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:hover:is(.w3a--dark *){background-color:var(--app-gray-400)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:focus-visible:is(.w3a--dark *){--tw-ring-color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-tertiary:active:is(.w3a--dark *){--tw-ring-color:var(--app-primary-500);background-color:var(--app-gray-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text{color:var(--app-primary-600)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:hover{color:var(--app-primary-800);text-decoration-line:underline}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-color:var(--app-primary-600);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);color:var(--app-primary-600)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:disabled{color:var(--app-gray-400);text-decoration-line:none}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:is(.w3a--dark *){color:var(--app-primary-500)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:hover:is(.w3a--dark *){color:var(--app-primary-400)}.w3a-parent-container #w3a-modal .t-btn.t-btn-text:disabled:is(.w3a--dark *){color:var(--app-gray-600)}.w3a-parent-container #w3a-modal .btn-link{text-decoration-line:none}.w3a-parent-container #w3a-modal button.t-btn:hover>.hover-icon{display:block;transition:display .15s;transition-timing-function:cubic-bezier(0,.54,.63,.99)}.w3a-parent-container #w3a-modal button.t-btn:hover>.image-icon{display:none;transition:display .15s;transition-timing-function:cubic-bezier(0,.54,.63,.99)}";
styleInject_es(css_248z);

module.exports = css_248z;