New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@mydefi/ui

Package Overview
Dependencies
Maintainers
1
Versions
58
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mydefi/ui - npm Package Compare versions

Comparing version 0.1.19 to 0.1.20

2

dist/index.es.js

@@ -30,3 +30,3 @@ import React, { Component } from 'react';

var css = "/* Import Custom Fonts */\n@import url(\"https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,900&display=swap\");\n\nhtml,\nbody,\n#ui_root__c-Sk1 {\n width: 100%;\n height: 100%;\n background: #191735 !important;\n font-family: \"Nunito Sans\", sans-serif !important;\n}\n/** Main */\n.ui_Main__2PgQ- {\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n width: 100%;\n height: 100%;\n}\n\n/** Card Styling */\n.ui_Card__3_XoG {\n border-radius: 4px;\n padding: 30px;\n margin-bottom: 25px;\n white-space: nowrap;\n overflow: hidden;\n}\n.ui_CardChildContainer__3B9dp {\n white-space: normal;\n width: 100%;\n}\n\n.ui_Card__3_XoG h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 15px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG h3 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 14px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 14px;\n margin-top: 5px;\n margin-bottom: 0;\n white-space: normal;\n padding-right: 40px;\n}\n\n/** Background Wrapper (used for SidePanel and Modal) */\n.ui_Background_Wrapper__3ysTm {\n position: fixed;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: pointer;\n animation: ui_FadeIn__37wwp 0.35s ease-out 0s 1;\n z-index: 1000;\n}\n\n/** SidePanel styling */\n.ui_SidePanel__1dhp0 {\n position: absolute;\n background-color: #221e44;\n padding: 25px;\n cursor: default;\n overflow-y: scroll;\n z-index: 10;\n}\n.ui_SidePanel__1dhp0 h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 29px;\n font-weight: bold;\n margin-top: 10px !important;\n margin-bottom: 5px;\n text-align: center;\n}\n\n.ui_SidePanel__1dhp0 p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 17px;\n margin-bottom: 0;\n text-align: center;\n margin-bottom: 40px;\n}\n/** Mobile */\n@media screen and (max-width: 800px) {\n .ui_SidePanel__1dhp0 {\n bottom: 0px;\n width: 100% !important;\n height: 500px !important;\n border-radius: 8px;\n animation: ui_SidePanelMobileAppear__20yxI 0.35s ease-out 0s 1 !important;\n }\n}\n/** Desktop */\n@media screen and (min-width: 800px) {\n .ui_SidePanel__1dhp0 {\n top: 0;\n right: 0;\n height: 100%;\n animation: ui_SidePanelAppear__d4yW4 0.35s ease-out 0s 1;\n }\n}\n\n/** Modal styling */\n.ui_Modal__1zwxd {\n position: absolute;\n background: #221e44;\n border-radius: 10px;\n padding: 40px;\n top: 60px;\n margin-left: -250px;\n left: 50%;\n text-align: center;\n z-index: 10;\n cursor: default;\n animation: ui_ModalAppear__dy6j7 0.25s ease-out 0s 1;\n}\n.ui_Modal__1zwxd h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 18px;\n font-weight: bold;\n margin-top: 0px !important;\n margin-bottom: 0px;\n text-align: center;\n}\n\n.ui_Modal__1zwxd p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 16px;\n text-align: center;\n margin-bottom: 0px;\n margin-top: 10px;\n}\n\n/** Asset */\n.ui_label_asset__1y4-g {\n text-align: left;\n line-height: 1.2;\n}\n\n/** Button styling */\n.ui_mdf_button__1TYo3 {\n font-family: \"Nunito Sans\", sans-serif;\n border-radius: 2px !important;\n padding: 10px 13px;\n font-weight: bold !important;\n font-size: 15px !important;\n border-width: 0px;\n cursor: pointer;\n white-space: nowrap;\n box-shadow: 0 1px 1px rgba(0, 0, 0, 0);\n}\n\n.ui_white_bg__2MU5a {\n color: #000000;\n background-color: #ffffff;\n outline: none;\n}\n.ui_green_bg__3AlUi {\n color: #ffffff;\n background-image: linear-gradient(130deg, #1ad692, #46d8a3);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_green_bg__3AlUi:hover {\n background-image: linear-gradient(130deg, #1ad692, #1ad692);\n}\n.ui_yellow_bg__38Vs1 {\n color: #ffffff;\n background-image: linear-gradient(130deg, #fd9240, #fdb640);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_yellow_bg__38Vs1:hover {\n background-image: linear-gradient(130deg, #fd9240, #fd9240);\n}\n.ui_pink_bg__1xndu {\n color: #ffffff;\n background-image: linear-gradient(130deg, #d43d76, #e74b86);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_pink_bg__1xndu:hover {\n background-image: linear-gradient(130deg, #d43d76, #d43d76);\n}\n\n/** Badges */\n.ui_mdf_badge__2ay4v {\n border-radius: 50px;\n font-size: 12px;\n padding: 3px 8px;\n font-weight: bold;\n display: inline-block;\n}\n.ui_mdf_badge_label__1lXDM {\n color: #ffffff;\n display: inline-block;\n padding-left: 10px;\n line-height: 1.2;\n font-size: 15px;\n}\n.ui_mdf_badge_label__1lXDM h2 {\n color: #ffffff;\n font-weight: bold;\n font-size: 15px !important;\n}\n.ui_mdf_badge_label__1lXDM p {\n color: #6a668e;\n font-size: 13px !important;\n}\n\n/** Table */\ntable.ui_mdf_table__2DkfT {\n width: 100%;\n}\n\ntable.ui_mdf_table__2DkfT th {\n color: #ffffff;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\ntable.ui_mdf_table__2DkfT td {\n color: #6a668e;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\n\n/** Utilities */\n.ui_align_middle__3C6YL {\n vertical-align: middle !important;\n}\n.ui_white__3hSFF {\n color: #ffffff;\n}\n.ui_grey__3RMEb {\n color: #6a668e;\n}\n.ui_blue__2sSDw {\n color: #29cae4;\n}\n.ui_yellow__1blKd {\n color: #fdb640;\n}\n.ui_pink__2bael {\n color: #e74b86;\n}\n.ui_green__2HHBI {\n color: #7ffacc;\n}\n.ui_red__3kihW {\n color: #e85e5e;\n}\n.ui_inline_block__3W1LN {\n display: inline-block;\n}\n.ui_bold__5MAcU {\n font-weight: bold;\n}\n.ui_italic__2msns {\n font-style: italic;\n}\n.ui_smallcaps__22Fif {\n text-transform: lowercase;\n font-variant: small-caps;\n}\n\n.ui_left__1C0J3 {\n text-align: left;\n}\n.ui_center__3oIt6 {\n text-align: center;\n}\n.ui_right__s2Wjf {\n text-align: right;\n}\n\n.ui_cursor__3nPSe {\n cursor: pointer;\n}\n\n.ui_p-10__24IpT {\n padding: 10px !important;\n}\n\n.ui_pleft-5__eZL5k {\n padding-left: 5px;\n}\n.ui_pleft-10__tcuAZ {\n padding-left: 10px;\n}\n.ui_pleft-15__1easn {\n padding-left: 15px;\n}\n.ui_pleft-20__2XdMx {\n padding-left: 20px;\n}\n\n.ui_pright-5__2NtbF {\n padding-right: 5px;\n}\n.ui_pright-10__1R3qK {\n padding-right: 10px;\n}\n.ui_pright_15__2GvQi {\n padding-right: 15px;\n}\n.ui_pright-20__1w3ya {\n padding-right: 20px;\n}\n\n.ui_ptop-5__JzuYA {\n padding-top: 5px;\n}\n.ui_ptop-10__233Di {\n padding-top: 10px;\n}\n.ui_ptop-15__IyV-Y {\n padding-top: 15px;\n}\n.ui_ptop-20__3tsF- {\n padding-top: 20px;\n}\n.ui_ptop-25__2FXZ6 {\n padding-top: 25px;\n}\n\n.ui_mright-5__2JO-T {\n margin-right: 5px !important;\n}\n.ui_mright-10__WQ64e {\n margin-right: 10px !important;\n}\n\n.ui_mtop-10__WnHbc {\n margin-top: 10px !important;\n}\n.ui_mtop-15__26ybX {\n margin-top: 15px !important;\n}\n.ui_mtop-20__1REcA {\n margin-top: 20px !important;\n}\n.ui_mtop-25__1yrj4 {\n margin-top: 25px !important;\n}\n.ui_mtop-30__1dB4B {\n margin-top: 30px !important;\n}\n.ui_mtop-40__1zbxf {\n margin-top: 40px !important;\n}\n\n.ui_mbottom-10__16Wrr {\n margin-bottom: 10px !important;\n}\n.ui_mbottom-15__2GTPh {\n margin-bottom: 15px !important;\n}\n.ui_mbottom-20__G_gQw {\n margin-bottom: 20px !important;\n}\n.ui_mbottom-25__2_yYd {\n margin-bottom: 25px !important;\n}\n\n.ui_br_2__1Sifd {\n border-radius: 2px;\n}\n.ui_br_20__5YY1c {\n border-radius: 20px;\n}\n\n/** Inputs */\n.ui_TextField__1CqQT label {\n color: #6a668e;\n display: block;\n text-align: left;\n margin-bottom: 0px;\n font-size: 15px;\n}\n.ui_TextField__1CqQT input,\n.ui_TextField__1CqQT textarea {\n display: block;\n font-family: \"Nunito Sans\", sans-serif;\n background-color: #2d2950;\n padding: 10px;\n border-radius: 4px;\n font-weight: bold;\n color: #ffffff;\n font-size: 15px;\n width: 100%;\n border: 0px solid #000000;\n outline: none;\n}\n.ui_TextField__1CqQT input::placeholder,\n.ui_TextField__1CqQT textarea::placeholder {\n color: #6a668e;\n}\n\n/** CheckBox */\n.ui_mdf_checkbox_container__2jTik {\n display: block;\n position: relative;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n color: #ffffff;\n padding-left: 28px;\n font-size: 14px;\n font-weight: bold;\n}\n\n/* Hide the browser's default checkbox */\n.ui_mdf_checkbox_container__2jTik input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n height: 0;\n width: 0;\n}\n\n/* Create a custom checkbox */\n.ui_mdf_checkbox__2x0v8 {\n position: absolute;\n top: 0;\n left: 0;\n height: 22px;\n width: 22px;\n background-color: #2d2950;\n border-radius: 2px;\n}\n\n/* Show the checkmark when checked */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8:after {\n display: block;\n}\n\n/* Style the checkmark/indicator */\n.ui_mdf_checkmark__G11Fa {\n content: \"\";\n position: absolute;\n display: none;\n left: 7px;\n top: 2px;\n width: 8px;\n height: 15px;\n border: solid #7ffacc;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n/* Show checkmark when input selected */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8 > .ui_mdf_checkmark__G11Fa {\n display: block;\n}\n\n/** Slider */\n.ui_slider__2s9Vu {\n -webkit-appearance: none;\n width: 100%;\n height: 7px;\n background: #6a668e;\n outline: none;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n.ui_slider__2s9Vu::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 17px;\n height: 17px;\n background: #ffffff;\n cursor: pointer;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n\n/** Keyframes Animation */\n\n@keyframes ui_FadeIn__37wwp {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes ui_SidePanelAppear__d4yW4 {\n 0% {\n right: -600px;\n }\n 100% {\n right: 0px;\n }\n}\n@keyframes ui_SidePanelMobileAppear__20yxI {\n 0% {\n bottom: -500px;\n }\n 100% {\n bottom: 0px;\n }\n}\n@keyframes ui_ModalAppear__dy6j7 {\n 0% {\n top: 180px;\n }\n 100% {\n right: 60px;\n }\n}\n";
var css = "/* Import Custom Fonts */\n@import url(\"https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,900&display=swap\");\n\nhtml,\nbody,\n#ui_root__c-Sk1 {\n width: 100%;\n height: 100%;\n background: #191735 !important;\n font-family: \"Nunito Sans\", sans-serif !important;\n}\n/** Main */\n.ui_Main__2PgQ- {\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n width: 100%;\n height: 100%;\n}\n\n/** Card Styling */\n.ui_Card__3_XoG {\n border-radius: 4px;\n padding: 30px;\n margin-bottom: 25px;\n white-space: nowrap;\n overflow: hidden;\n}\n.ui_CardChildContainer__3B9dp {\n white-space: normal;\n width: 100%;\n}\n\n.ui_Card__3_XoG h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 15px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG h3 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 14px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 14px;\n margin-top: 5px;\n margin-bottom: 0;\n white-space: normal;\n padding-right: 40px;\n}\n\n/** Background Wrapper (used for SidePanel and Modal) */\n.ui_Background_Wrapper__3ysTm {\n position: fixed;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: pointer;\n animation: ui_FadeIn__37wwp 0.35s ease-out 0s 1;\n z-index: 1000;\n}\n\n/** SidePanel styling */\n.ui_SidePanel__1dhp0 {\n position: absolute;\n background-color: #221e44;\n padding: 25px;\n cursor: default;\n overflow-y: scroll;\n z-index: 10;\n}\n.ui_SidePanel__1dhp0 h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 29px;\n font-weight: bold;\n margin-top: 10px !important;\n margin-bottom: 5px;\n text-align: center;\n}\n\n.ui_SidePanel__1dhp0 p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 17px;\n margin-bottom: 0;\n text-align: center;\n margin-bottom: 40px;\n}\n/** Mobile */\n@media screen and (max-width: 800px) {\n .ui_SidePanel__1dhp0 {\n bottom: 0px;\n width: 100% !important;\n height: 500px !important;\n border-radius: 8px;\n animation: ui_SidePanelMobileAppear__20yxI 0.35s ease-out 0s 1 !important;\n }\n}\n/** Desktop */\n@media screen and (min-width: 800px) {\n .ui_SidePanel__1dhp0 {\n top: 0;\n right: 0;\n height: 100%;\n animation: ui_SidePanelAppear__d4yW4 0.35s ease-out 0s 1;\n }\n}\n\n/** Modal styling */\n.ui_Modal__1zwxd {\n position: absolute;\n background: #221e44;\n border-radius: 10px;\n padding: 40px;\n top: 60px;\n text-align: center;\n z-index: 10;\n cursor: default;\n animation: ui_ModalAppear__dy6j7 0.25s ease-out 0s 1;\n}\n.ui_Modal__1zwxd h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 18px;\n font-weight: bold;\n margin-top: 0px !important;\n margin-bottom: 0px;\n text-align: center;\n}\n\n.ui_Modal__1zwxd p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 16px;\n text-align: center;\n margin-bottom: 0px;\n margin-top: 10px;\n}\n\n/** Mobile specifics for .Modal class */\n@media screen and (max-width: 800px) {\n .ui_Modal__1zwxd {\n margin-left: 0px !important;\n left: 0px !important;\n width: 100% !important;\n }\n}\n/** Desktop specifics for .Modal class */\n@media screen and (min-width: 800px) {\n .ui_Modal__1zwxd {\n margin-left: -250px;\n left: 50%;\n }\n}\n\n/** Asset */\n.ui_label_asset__1y4-g {\n text-align: left;\n line-height: 1.2;\n}\n\n/** Button styling */\n.ui_mdf_button__1TYo3 {\n font-family: \"Nunito Sans\", sans-serif;\n border-radius: 2px !important;\n padding: 10px 13px;\n font-weight: bold !important;\n font-size: 15px !important;\n border-width: 0px;\n cursor: pointer;\n white-space: nowrap;\n box-shadow: 0 1px 1px rgba(0, 0, 0, 0);\n}\n\n.ui_white_bg__2MU5a {\n color: #000000;\n background-color: #ffffff;\n outline: none;\n}\n.ui_green_bg__3AlUi {\n color: #ffffff;\n background-image: linear-gradient(130deg, #1ad692, #46d8a3);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_green_bg__3AlUi:hover {\n background-image: linear-gradient(130deg, #1ad692, #1ad692);\n}\n.ui_yellow_bg__38Vs1 {\n color: #ffffff;\n background-image: linear-gradient(130deg, #fd9240, #fdb640);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_yellow_bg__38Vs1:hover {\n background-image: linear-gradient(130deg, #fd9240, #fd9240);\n}\n.ui_pink_bg__1xndu {\n color: #ffffff;\n background-image: linear-gradient(130deg, #d43d76, #e74b86);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_pink_bg__1xndu:hover {\n background-image: linear-gradient(130deg, #d43d76, #d43d76);\n}\n\n/** Badges */\n.ui_mdf_badge__2ay4v {\n border-radius: 50px;\n font-size: 12px;\n padding: 3px 8px;\n font-weight: bold;\n display: inline-block;\n}\n.ui_mdf_badge_label__1lXDM {\n color: #ffffff;\n display: inline-block;\n padding-left: 10px;\n line-height: 1.2;\n font-size: 15px;\n}\n.ui_mdf_badge_label__1lXDM h2 {\n color: #ffffff;\n font-weight: bold;\n font-size: 15px !important;\n}\n.ui_mdf_badge_label__1lXDM p {\n color: #6a668e;\n font-size: 13px !important;\n}\n\n/** Table */\ntable.ui_mdf_table__2DkfT {\n width: 100%;\n}\n\ntable.ui_mdf_table__2DkfT th {\n color: #ffffff;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\ntable.ui_mdf_table__2DkfT td {\n color: #6a668e;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\n\n/** Utilities */\n.ui_align_middle__3C6YL {\n vertical-align: middle !important;\n}\n.ui_white__3hSFF {\n color: #ffffff;\n}\n.ui_grey__3RMEb {\n color: #6a668e;\n}\n.ui_blue__2sSDw {\n color: #29cae4;\n}\n.ui_yellow__1blKd {\n color: #fdb640;\n}\n.ui_pink__2bael {\n color: #e74b86;\n}\n.ui_green__2HHBI {\n color: #7ffacc;\n}\n.ui_red__3kihW {\n color: #e85e5e;\n}\n.ui_inline_block__3W1LN {\n display: inline-block;\n}\n.ui_bold__5MAcU {\n font-weight: bold;\n}\n.ui_italic__2msns {\n font-style: italic;\n}\n.ui_smallcaps__22Fif {\n text-transform: lowercase;\n font-variant: small-caps;\n}\n\n.ui_left__1C0J3 {\n text-align: left;\n}\n.ui_center__3oIt6 {\n text-align: center;\n}\n.ui_right__s2Wjf {\n text-align: right;\n}\n\n.ui_cursor__3nPSe {\n cursor: pointer;\n}\n\n.ui_p-10__24IpT {\n padding: 10px !important;\n}\n\n.ui_pleft-5__eZL5k {\n padding-left: 5px;\n}\n.ui_pleft-10__tcuAZ {\n padding-left: 10px;\n}\n.ui_pleft-15__1easn {\n padding-left: 15px;\n}\n.ui_pleft-20__2XdMx {\n padding-left: 20px;\n}\n\n.ui_pright-5__2NtbF {\n padding-right: 5px;\n}\n.ui_pright-10__1R3qK {\n padding-right: 10px;\n}\n.ui_pright_15__2GvQi {\n padding-right: 15px;\n}\n.ui_pright-20__1w3ya {\n padding-right: 20px;\n}\n\n.ui_ptop-5__JzuYA {\n padding-top: 5px;\n}\n.ui_ptop-10__233Di {\n padding-top: 10px;\n}\n.ui_ptop-15__IyV-Y {\n padding-top: 15px;\n}\n.ui_ptop-20__3tsF- {\n padding-top: 20px;\n}\n.ui_ptop-25__2FXZ6 {\n padding-top: 25px;\n}\n\n.ui_mright-5__2JO-T {\n margin-right: 5px !important;\n}\n.ui_mright-10__WQ64e {\n margin-right: 10px !important;\n}\n\n.ui_mtop-10__WnHbc {\n margin-top: 10px !important;\n}\n.ui_mtop-15__26ybX {\n margin-top: 15px !important;\n}\n.ui_mtop-20__1REcA {\n margin-top: 20px !important;\n}\n.ui_mtop-25__1yrj4 {\n margin-top: 25px !important;\n}\n.ui_mtop-30__1dB4B {\n margin-top: 30px !important;\n}\n.ui_mtop-40__1zbxf {\n margin-top: 40px !important;\n}\n\n.ui_mbottom-10__16Wrr {\n margin-bottom: 10px !important;\n}\n.ui_mbottom-15__2GTPh {\n margin-bottom: 15px !important;\n}\n.ui_mbottom-20__G_gQw {\n margin-bottom: 20px !important;\n}\n.ui_mbottom-25__2_yYd {\n margin-bottom: 25px !important;\n}\n\n.ui_br_2__1Sifd {\n border-radius: 2px;\n}\n.ui_br_20__5YY1c {\n border-radius: 20px;\n}\n\n/** Inputs */\n.ui_TextField__1CqQT label {\n color: #6a668e;\n display: block;\n text-align: left;\n margin-bottom: 0px;\n font-size: 15px;\n}\n.ui_TextField__1CqQT input,\n.ui_TextField__1CqQT textarea {\n display: block;\n font-family: \"Nunito Sans\", sans-serif;\n background-color: #2d2950;\n padding: 10px;\n border-radius: 4px;\n font-weight: bold;\n color: #ffffff;\n font-size: 15px;\n width: 100%;\n border: 0px solid #000000;\n outline: none;\n}\n.ui_TextField__1CqQT input::placeholder,\n.ui_TextField__1CqQT textarea::placeholder {\n color: #6a668e;\n}\n\n/** CheckBox */\n.ui_mdf_checkbox_container__2jTik {\n display: block;\n position: relative;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n color: #ffffff;\n padding-left: 28px;\n font-size: 14px;\n font-weight: bold;\n}\n\n/* Hide the browser's default checkbox */\n.ui_mdf_checkbox_container__2jTik input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n height: 0;\n width: 0;\n}\n\n/* Create a custom checkbox */\n.ui_mdf_checkbox__2x0v8 {\n position: absolute;\n top: 0;\n left: 0;\n height: 22px;\n width: 22px;\n background-color: #2d2950;\n border-radius: 2px;\n}\n\n/* Show the checkmark when checked */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8:after {\n display: block;\n}\n\n/* Style the checkmark/indicator */\n.ui_mdf_checkmark__G11Fa {\n content: \"\";\n position: absolute;\n display: none;\n left: 7px;\n top: 2px;\n width: 8px;\n height: 15px;\n border: solid #7ffacc;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n/* Show checkmark when input selected */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8 > .ui_mdf_checkmark__G11Fa {\n display: block;\n}\n\n/** Slider */\n.ui_slider__2s9Vu {\n -webkit-appearance: none;\n width: 100%;\n height: 7px;\n background: #6a668e;\n outline: none;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n.ui_slider__2s9Vu::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 17px;\n height: 17px;\n background: #ffffff;\n cursor: pointer;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n\n/** Keyframes Animation */\n\n@keyframes ui_FadeIn__37wwp {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes ui_SidePanelAppear__d4yW4 {\n 0% {\n right: -600px;\n }\n 100% {\n right: 0px;\n }\n}\n@keyframes ui_SidePanelMobileAppear__20yxI {\n 0% {\n bottom: -500px;\n }\n 100% {\n bottom: 0px;\n }\n}\n@keyframes ui_ModalAppear__dy6j7 {\n 0% {\n top: 180px;\n }\n 100% {\n right: 60px;\n }\n}\n";
var styles = { "root": "ui_root__c-Sk1", "Main": "ui_Main__2PgQ-", "Card": "ui_Card__3_XoG", "CardChildContainer": "ui_CardChildContainer__3B9dp", "Background_Wrapper": "ui_Background_Wrapper__3ysTm", "FadeIn": "ui_FadeIn__37wwp", "SidePanel": "ui_SidePanel__1dhp0", "SidePanelMobileAppear": "ui_SidePanelMobileAppear__20yxI", "SidePanelAppear": "ui_SidePanelAppear__d4yW4", "Modal": "ui_Modal__1zwxd", "ModalAppear": "ui_ModalAppear__dy6j7", "label_asset": "ui_label_asset__1y4-g", "mdf_button": "ui_mdf_button__1TYo3", "white_bg": "ui_white_bg__2MU5a", "green_bg": "ui_green_bg__3AlUi", "yellow_bg": "ui_yellow_bg__38Vs1", "pink_bg": "ui_pink_bg__1xndu", "mdf_badge": "ui_mdf_badge__2ay4v", "mdf_badge_label": "ui_mdf_badge_label__1lXDM", "mdf_table": "ui_mdf_table__2DkfT", "align_middle": "ui_align_middle__3C6YL", "white": "ui_white__3hSFF", "grey": "ui_grey__3RMEb", "blue": "ui_blue__2sSDw", "yellow": "ui_yellow__1blKd", "pink": "ui_pink__2bael", "green": "ui_green__2HHBI", "red": "ui_red__3kihW", "inline_block": "ui_inline_block__3W1LN", "bold": "ui_bold__5MAcU", "italic": "ui_italic__2msns", "smallcaps": "ui_smallcaps__22Fif", "left": "ui_left__1C0J3", "center": "ui_center__3oIt6", "right": "ui_right__s2Wjf", "cursor": "ui_cursor__3nPSe", "p-10": "ui_p-10__24IpT", "pleft-5": "ui_pleft-5__eZL5k", "pleft-10": "ui_pleft-10__tcuAZ", "pleft-15": "ui_pleft-15__1easn", "pleft-20": "ui_pleft-20__2XdMx", "pright-5": "ui_pright-5__2NtbF", "pright-10": "ui_pright-10__1R3qK", "pright_15": "ui_pright_15__2GvQi", "pright-20": "ui_pright-20__1w3ya", "ptop-5": "ui_ptop-5__JzuYA", "ptop-10": "ui_ptop-10__233Di", "ptop-15": "ui_ptop-15__IyV-Y", "ptop-20": "ui_ptop-20__3tsF-", "ptop-25": "ui_ptop-25__2FXZ6", "mright-5": "ui_mright-5__2JO-T", "mright-10": "ui_mright-10__WQ64e", "mtop-10": "ui_mtop-10__WnHbc", "mtop-15": "ui_mtop-15__26ybX", "mtop-20": "ui_mtop-20__1REcA", "mtop-25": "ui_mtop-25__1yrj4", "mtop-30": "ui_mtop-30__1dB4B", "mtop-40": "ui_mtop-40__1zbxf", "mbottom-10": "ui_mbottom-10__16Wrr", "mbottom-15": "ui_mbottom-15__2GTPh", "mbottom-20": "ui_mbottom-20__G_gQw", "mbottom-25": "ui_mbottom-25__2_yYd", "br_2": "ui_br_2__1Sifd", "br_20": "ui_br_20__5YY1c", "TextField": "ui_TextField__1CqQT", "mdf_checkbox_container": "ui_mdf_checkbox_container__2jTik", "mdf_checkbox": "ui_mdf_checkbox__2x0v8", "mdf_checkmark": "ui_mdf_checkmark__G11Fa", "slider": "ui_slider__2s9Vu" };

@@ -33,0 +33,0 @@ styleInject(css);

2

dist/index.js

@@ -37,3 +37,3 @@ 'use strict';

var css = "/* Import Custom Fonts */\n@import url(\"https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,900&display=swap\");\n\nhtml,\nbody,\n#ui_root__c-Sk1 {\n width: 100%;\n height: 100%;\n background: #191735 !important;\n font-family: \"Nunito Sans\", sans-serif !important;\n}\n/** Main */\n.ui_Main__2PgQ- {\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n width: 100%;\n height: 100%;\n}\n\n/** Card Styling */\n.ui_Card__3_XoG {\n border-radius: 4px;\n padding: 30px;\n margin-bottom: 25px;\n white-space: nowrap;\n overflow: hidden;\n}\n.ui_CardChildContainer__3B9dp {\n white-space: normal;\n width: 100%;\n}\n\n.ui_Card__3_XoG h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 15px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG h3 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 14px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 14px;\n margin-top: 5px;\n margin-bottom: 0;\n white-space: normal;\n padding-right: 40px;\n}\n\n/** Background Wrapper (used for SidePanel and Modal) */\n.ui_Background_Wrapper__3ysTm {\n position: fixed;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: pointer;\n animation: ui_FadeIn__37wwp 0.35s ease-out 0s 1;\n z-index: 1000;\n}\n\n/** SidePanel styling */\n.ui_SidePanel__1dhp0 {\n position: absolute;\n background-color: #221e44;\n padding: 25px;\n cursor: default;\n overflow-y: scroll;\n z-index: 10;\n}\n.ui_SidePanel__1dhp0 h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 29px;\n font-weight: bold;\n margin-top: 10px !important;\n margin-bottom: 5px;\n text-align: center;\n}\n\n.ui_SidePanel__1dhp0 p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 17px;\n margin-bottom: 0;\n text-align: center;\n margin-bottom: 40px;\n}\n/** Mobile */\n@media screen and (max-width: 800px) {\n .ui_SidePanel__1dhp0 {\n bottom: 0px;\n width: 100% !important;\n height: 500px !important;\n border-radius: 8px;\n animation: ui_SidePanelMobileAppear__20yxI 0.35s ease-out 0s 1 !important;\n }\n}\n/** Desktop */\n@media screen and (min-width: 800px) {\n .ui_SidePanel__1dhp0 {\n top: 0;\n right: 0;\n height: 100%;\n animation: ui_SidePanelAppear__d4yW4 0.35s ease-out 0s 1;\n }\n}\n\n/** Modal styling */\n.ui_Modal__1zwxd {\n position: absolute;\n background: #221e44;\n border-radius: 10px;\n padding: 40px;\n top: 60px;\n margin-left: -250px;\n left: 50%;\n text-align: center;\n z-index: 10;\n cursor: default;\n animation: ui_ModalAppear__dy6j7 0.25s ease-out 0s 1;\n}\n.ui_Modal__1zwxd h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 18px;\n font-weight: bold;\n margin-top: 0px !important;\n margin-bottom: 0px;\n text-align: center;\n}\n\n.ui_Modal__1zwxd p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 16px;\n text-align: center;\n margin-bottom: 0px;\n margin-top: 10px;\n}\n\n/** Asset */\n.ui_label_asset__1y4-g {\n text-align: left;\n line-height: 1.2;\n}\n\n/** Button styling */\n.ui_mdf_button__1TYo3 {\n font-family: \"Nunito Sans\", sans-serif;\n border-radius: 2px !important;\n padding: 10px 13px;\n font-weight: bold !important;\n font-size: 15px !important;\n border-width: 0px;\n cursor: pointer;\n white-space: nowrap;\n box-shadow: 0 1px 1px rgba(0, 0, 0, 0);\n}\n\n.ui_white_bg__2MU5a {\n color: #000000;\n background-color: #ffffff;\n outline: none;\n}\n.ui_green_bg__3AlUi {\n color: #ffffff;\n background-image: linear-gradient(130deg, #1ad692, #46d8a3);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_green_bg__3AlUi:hover {\n background-image: linear-gradient(130deg, #1ad692, #1ad692);\n}\n.ui_yellow_bg__38Vs1 {\n color: #ffffff;\n background-image: linear-gradient(130deg, #fd9240, #fdb640);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_yellow_bg__38Vs1:hover {\n background-image: linear-gradient(130deg, #fd9240, #fd9240);\n}\n.ui_pink_bg__1xndu {\n color: #ffffff;\n background-image: linear-gradient(130deg, #d43d76, #e74b86);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_pink_bg__1xndu:hover {\n background-image: linear-gradient(130deg, #d43d76, #d43d76);\n}\n\n/** Badges */\n.ui_mdf_badge__2ay4v {\n border-radius: 50px;\n font-size: 12px;\n padding: 3px 8px;\n font-weight: bold;\n display: inline-block;\n}\n.ui_mdf_badge_label__1lXDM {\n color: #ffffff;\n display: inline-block;\n padding-left: 10px;\n line-height: 1.2;\n font-size: 15px;\n}\n.ui_mdf_badge_label__1lXDM h2 {\n color: #ffffff;\n font-weight: bold;\n font-size: 15px !important;\n}\n.ui_mdf_badge_label__1lXDM p {\n color: #6a668e;\n font-size: 13px !important;\n}\n\n/** Table */\ntable.ui_mdf_table__2DkfT {\n width: 100%;\n}\n\ntable.ui_mdf_table__2DkfT th {\n color: #ffffff;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\ntable.ui_mdf_table__2DkfT td {\n color: #6a668e;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\n\n/** Utilities */\n.ui_align_middle__3C6YL {\n vertical-align: middle !important;\n}\n.ui_white__3hSFF {\n color: #ffffff;\n}\n.ui_grey__3RMEb {\n color: #6a668e;\n}\n.ui_blue__2sSDw {\n color: #29cae4;\n}\n.ui_yellow__1blKd {\n color: #fdb640;\n}\n.ui_pink__2bael {\n color: #e74b86;\n}\n.ui_green__2HHBI {\n color: #7ffacc;\n}\n.ui_red__3kihW {\n color: #e85e5e;\n}\n.ui_inline_block__3W1LN {\n display: inline-block;\n}\n.ui_bold__5MAcU {\n font-weight: bold;\n}\n.ui_italic__2msns {\n font-style: italic;\n}\n.ui_smallcaps__22Fif {\n text-transform: lowercase;\n font-variant: small-caps;\n}\n\n.ui_left__1C0J3 {\n text-align: left;\n}\n.ui_center__3oIt6 {\n text-align: center;\n}\n.ui_right__s2Wjf {\n text-align: right;\n}\n\n.ui_cursor__3nPSe {\n cursor: pointer;\n}\n\n.ui_p-10__24IpT {\n padding: 10px !important;\n}\n\n.ui_pleft-5__eZL5k {\n padding-left: 5px;\n}\n.ui_pleft-10__tcuAZ {\n padding-left: 10px;\n}\n.ui_pleft-15__1easn {\n padding-left: 15px;\n}\n.ui_pleft-20__2XdMx {\n padding-left: 20px;\n}\n\n.ui_pright-5__2NtbF {\n padding-right: 5px;\n}\n.ui_pright-10__1R3qK {\n padding-right: 10px;\n}\n.ui_pright_15__2GvQi {\n padding-right: 15px;\n}\n.ui_pright-20__1w3ya {\n padding-right: 20px;\n}\n\n.ui_ptop-5__JzuYA {\n padding-top: 5px;\n}\n.ui_ptop-10__233Di {\n padding-top: 10px;\n}\n.ui_ptop-15__IyV-Y {\n padding-top: 15px;\n}\n.ui_ptop-20__3tsF- {\n padding-top: 20px;\n}\n.ui_ptop-25__2FXZ6 {\n padding-top: 25px;\n}\n\n.ui_mright-5__2JO-T {\n margin-right: 5px !important;\n}\n.ui_mright-10__WQ64e {\n margin-right: 10px !important;\n}\n\n.ui_mtop-10__WnHbc {\n margin-top: 10px !important;\n}\n.ui_mtop-15__26ybX {\n margin-top: 15px !important;\n}\n.ui_mtop-20__1REcA {\n margin-top: 20px !important;\n}\n.ui_mtop-25__1yrj4 {\n margin-top: 25px !important;\n}\n.ui_mtop-30__1dB4B {\n margin-top: 30px !important;\n}\n.ui_mtop-40__1zbxf {\n margin-top: 40px !important;\n}\n\n.ui_mbottom-10__16Wrr {\n margin-bottom: 10px !important;\n}\n.ui_mbottom-15__2GTPh {\n margin-bottom: 15px !important;\n}\n.ui_mbottom-20__G_gQw {\n margin-bottom: 20px !important;\n}\n.ui_mbottom-25__2_yYd {\n margin-bottom: 25px !important;\n}\n\n.ui_br_2__1Sifd {\n border-radius: 2px;\n}\n.ui_br_20__5YY1c {\n border-radius: 20px;\n}\n\n/** Inputs */\n.ui_TextField__1CqQT label {\n color: #6a668e;\n display: block;\n text-align: left;\n margin-bottom: 0px;\n font-size: 15px;\n}\n.ui_TextField__1CqQT input,\n.ui_TextField__1CqQT textarea {\n display: block;\n font-family: \"Nunito Sans\", sans-serif;\n background-color: #2d2950;\n padding: 10px;\n border-radius: 4px;\n font-weight: bold;\n color: #ffffff;\n font-size: 15px;\n width: 100%;\n border: 0px solid #000000;\n outline: none;\n}\n.ui_TextField__1CqQT input::placeholder,\n.ui_TextField__1CqQT textarea::placeholder {\n color: #6a668e;\n}\n\n/** CheckBox */\n.ui_mdf_checkbox_container__2jTik {\n display: block;\n position: relative;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n color: #ffffff;\n padding-left: 28px;\n font-size: 14px;\n font-weight: bold;\n}\n\n/* Hide the browser's default checkbox */\n.ui_mdf_checkbox_container__2jTik input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n height: 0;\n width: 0;\n}\n\n/* Create a custom checkbox */\n.ui_mdf_checkbox__2x0v8 {\n position: absolute;\n top: 0;\n left: 0;\n height: 22px;\n width: 22px;\n background-color: #2d2950;\n border-radius: 2px;\n}\n\n/* Show the checkmark when checked */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8:after {\n display: block;\n}\n\n/* Style the checkmark/indicator */\n.ui_mdf_checkmark__G11Fa {\n content: \"\";\n position: absolute;\n display: none;\n left: 7px;\n top: 2px;\n width: 8px;\n height: 15px;\n border: solid #7ffacc;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n/* Show checkmark when input selected */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8 > .ui_mdf_checkmark__G11Fa {\n display: block;\n}\n\n/** Slider */\n.ui_slider__2s9Vu {\n -webkit-appearance: none;\n width: 100%;\n height: 7px;\n background: #6a668e;\n outline: none;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n.ui_slider__2s9Vu::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 17px;\n height: 17px;\n background: #ffffff;\n cursor: pointer;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n\n/** Keyframes Animation */\n\n@keyframes ui_FadeIn__37wwp {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes ui_SidePanelAppear__d4yW4 {\n 0% {\n right: -600px;\n }\n 100% {\n right: 0px;\n }\n}\n@keyframes ui_SidePanelMobileAppear__20yxI {\n 0% {\n bottom: -500px;\n }\n 100% {\n bottom: 0px;\n }\n}\n@keyframes ui_ModalAppear__dy6j7 {\n 0% {\n top: 180px;\n }\n 100% {\n right: 60px;\n }\n}\n";
var css = "/* Import Custom Fonts */\n@import url(\"https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,900&display=swap\");\n\nhtml,\nbody,\n#ui_root__c-Sk1 {\n width: 100%;\n height: 100%;\n background: #191735 !important;\n font-family: \"Nunito Sans\", sans-serif !important;\n}\n/** Main */\n.ui_Main__2PgQ- {\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n width: 100%;\n height: 100%;\n}\n\n/** Card Styling */\n.ui_Card__3_XoG {\n border-radius: 4px;\n padding: 30px;\n margin-bottom: 25px;\n white-space: nowrap;\n overflow: hidden;\n}\n.ui_CardChildContainer__3B9dp {\n white-space: normal;\n width: 100%;\n}\n\n.ui_Card__3_XoG h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 15px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG h3 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 14px;\n font-weight: bold;\n margin-top: 0;\n margin-bottom: 5px;\n white-space: normal;\n padding-right: 40px;\n}\n\n.ui_Card__3_XoG p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 14px;\n margin-top: 5px;\n margin-bottom: 0;\n white-space: normal;\n padding-right: 40px;\n}\n\n/** Background Wrapper (used for SidePanel and Modal) */\n.ui_Background_Wrapper__3ysTm {\n position: fixed;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: pointer;\n animation: ui_FadeIn__37wwp 0.35s ease-out 0s 1;\n z-index: 1000;\n}\n\n/** SidePanel styling */\n.ui_SidePanel__1dhp0 {\n position: absolute;\n background-color: #221e44;\n padding: 25px;\n cursor: default;\n overflow-y: scroll;\n z-index: 10;\n}\n.ui_SidePanel__1dhp0 h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 29px;\n font-weight: bold;\n margin-top: 10px !important;\n margin-bottom: 5px;\n text-align: center;\n}\n\n.ui_SidePanel__1dhp0 p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 17px;\n margin-bottom: 0;\n text-align: center;\n margin-bottom: 40px;\n}\n/** Mobile */\n@media screen and (max-width: 800px) {\n .ui_SidePanel__1dhp0 {\n bottom: 0px;\n width: 100% !important;\n height: 500px !important;\n border-radius: 8px;\n animation: ui_SidePanelMobileAppear__20yxI 0.35s ease-out 0s 1 !important;\n }\n}\n/** Desktop */\n@media screen and (min-width: 800px) {\n .ui_SidePanel__1dhp0 {\n top: 0;\n right: 0;\n height: 100%;\n animation: ui_SidePanelAppear__d4yW4 0.35s ease-out 0s 1;\n }\n}\n\n/** Modal styling */\n.ui_Modal__1zwxd {\n position: absolute;\n background: #221e44;\n border-radius: 10px;\n padding: 40px;\n top: 60px;\n text-align: center;\n z-index: 10;\n cursor: default;\n animation: ui_ModalAppear__dy6j7 0.25s ease-out 0s 1;\n}\n.ui_Modal__1zwxd h2 {\n font-family: \"Nunito Sans\", sans-serif;\n color: #ffffff;\n font-size: 18px;\n font-weight: bold;\n margin-top: 0px !important;\n margin-bottom: 0px;\n text-align: center;\n}\n\n.ui_Modal__1zwxd p {\n font-family: \"Nunito Sans\", sans-serif;\n color: #6a668e;\n font-size: 16px;\n text-align: center;\n margin-bottom: 0px;\n margin-top: 10px;\n}\n\n/** Mobile specifics for .Modal class */\n@media screen and (max-width: 800px) {\n .ui_Modal__1zwxd {\n margin-left: 0px !important;\n left: 0px !important;\n width: 100% !important;\n }\n}\n/** Desktop specifics for .Modal class */\n@media screen and (min-width: 800px) {\n .ui_Modal__1zwxd {\n margin-left: -250px;\n left: 50%;\n }\n}\n\n/** Asset */\n.ui_label_asset__1y4-g {\n text-align: left;\n line-height: 1.2;\n}\n\n/** Button styling */\n.ui_mdf_button__1TYo3 {\n font-family: \"Nunito Sans\", sans-serif;\n border-radius: 2px !important;\n padding: 10px 13px;\n font-weight: bold !important;\n font-size: 15px !important;\n border-width: 0px;\n cursor: pointer;\n white-space: nowrap;\n box-shadow: 0 1px 1px rgba(0, 0, 0, 0);\n}\n\n.ui_white_bg__2MU5a {\n color: #000000;\n background-color: #ffffff;\n outline: none;\n}\n.ui_green_bg__3AlUi {\n color: #ffffff;\n background-image: linear-gradient(130deg, #1ad692, #46d8a3);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_green_bg__3AlUi:hover {\n background-image: linear-gradient(130deg, #1ad692, #1ad692);\n}\n.ui_yellow_bg__38Vs1 {\n color: #ffffff;\n background-image: linear-gradient(130deg, #fd9240, #fdb640);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_yellow_bg__38Vs1:hover {\n background-image: linear-gradient(130deg, #fd9240, #fd9240);\n}\n.ui_pink_bg__1xndu {\n color: #ffffff;\n background-image: linear-gradient(130deg, #d43d76, #e74b86);\n outline: none;\n}\n.ui_mdf_button__1TYo3.ui_pink_bg__1xndu:hover {\n background-image: linear-gradient(130deg, #d43d76, #d43d76);\n}\n\n/** Badges */\n.ui_mdf_badge__2ay4v {\n border-radius: 50px;\n font-size: 12px;\n padding: 3px 8px;\n font-weight: bold;\n display: inline-block;\n}\n.ui_mdf_badge_label__1lXDM {\n color: #ffffff;\n display: inline-block;\n padding-left: 10px;\n line-height: 1.2;\n font-size: 15px;\n}\n.ui_mdf_badge_label__1lXDM h2 {\n color: #ffffff;\n font-weight: bold;\n font-size: 15px !important;\n}\n.ui_mdf_badge_label__1lXDM p {\n color: #6a668e;\n font-size: 13px !important;\n}\n\n/** Table */\ntable.ui_mdf_table__2DkfT {\n width: 100%;\n}\n\ntable.ui_mdf_table__2DkfT th {\n color: #ffffff;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\ntable.ui_mdf_table__2DkfT td {\n color: #6a668e;\n font-size: 13px;\n padding: 7px;\n border-bottom: 1px solid #363265;\n}\n\n/** Utilities */\n.ui_align_middle__3C6YL {\n vertical-align: middle !important;\n}\n.ui_white__3hSFF {\n color: #ffffff;\n}\n.ui_grey__3RMEb {\n color: #6a668e;\n}\n.ui_blue__2sSDw {\n color: #29cae4;\n}\n.ui_yellow__1blKd {\n color: #fdb640;\n}\n.ui_pink__2bael {\n color: #e74b86;\n}\n.ui_green__2HHBI {\n color: #7ffacc;\n}\n.ui_red__3kihW {\n color: #e85e5e;\n}\n.ui_inline_block__3W1LN {\n display: inline-block;\n}\n.ui_bold__5MAcU {\n font-weight: bold;\n}\n.ui_italic__2msns {\n font-style: italic;\n}\n.ui_smallcaps__22Fif {\n text-transform: lowercase;\n font-variant: small-caps;\n}\n\n.ui_left__1C0J3 {\n text-align: left;\n}\n.ui_center__3oIt6 {\n text-align: center;\n}\n.ui_right__s2Wjf {\n text-align: right;\n}\n\n.ui_cursor__3nPSe {\n cursor: pointer;\n}\n\n.ui_p-10__24IpT {\n padding: 10px !important;\n}\n\n.ui_pleft-5__eZL5k {\n padding-left: 5px;\n}\n.ui_pleft-10__tcuAZ {\n padding-left: 10px;\n}\n.ui_pleft-15__1easn {\n padding-left: 15px;\n}\n.ui_pleft-20__2XdMx {\n padding-left: 20px;\n}\n\n.ui_pright-5__2NtbF {\n padding-right: 5px;\n}\n.ui_pright-10__1R3qK {\n padding-right: 10px;\n}\n.ui_pright_15__2GvQi {\n padding-right: 15px;\n}\n.ui_pright-20__1w3ya {\n padding-right: 20px;\n}\n\n.ui_ptop-5__JzuYA {\n padding-top: 5px;\n}\n.ui_ptop-10__233Di {\n padding-top: 10px;\n}\n.ui_ptop-15__IyV-Y {\n padding-top: 15px;\n}\n.ui_ptop-20__3tsF- {\n padding-top: 20px;\n}\n.ui_ptop-25__2FXZ6 {\n padding-top: 25px;\n}\n\n.ui_mright-5__2JO-T {\n margin-right: 5px !important;\n}\n.ui_mright-10__WQ64e {\n margin-right: 10px !important;\n}\n\n.ui_mtop-10__WnHbc {\n margin-top: 10px !important;\n}\n.ui_mtop-15__26ybX {\n margin-top: 15px !important;\n}\n.ui_mtop-20__1REcA {\n margin-top: 20px !important;\n}\n.ui_mtop-25__1yrj4 {\n margin-top: 25px !important;\n}\n.ui_mtop-30__1dB4B {\n margin-top: 30px !important;\n}\n.ui_mtop-40__1zbxf {\n margin-top: 40px !important;\n}\n\n.ui_mbottom-10__16Wrr {\n margin-bottom: 10px !important;\n}\n.ui_mbottom-15__2GTPh {\n margin-bottom: 15px !important;\n}\n.ui_mbottom-20__G_gQw {\n margin-bottom: 20px !important;\n}\n.ui_mbottom-25__2_yYd {\n margin-bottom: 25px !important;\n}\n\n.ui_br_2__1Sifd {\n border-radius: 2px;\n}\n.ui_br_20__5YY1c {\n border-radius: 20px;\n}\n\n/** Inputs */\n.ui_TextField__1CqQT label {\n color: #6a668e;\n display: block;\n text-align: left;\n margin-bottom: 0px;\n font-size: 15px;\n}\n.ui_TextField__1CqQT input,\n.ui_TextField__1CqQT textarea {\n display: block;\n font-family: \"Nunito Sans\", sans-serif;\n background-color: #2d2950;\n padding: 10px;\n border-radius: 4px;\n font-weight: bold;\n color: #ffffff;\n font-size: 15px;\n width: 100%;\n border: 0px solid #000000;\n outline: none;\n}\n.ui_TextField__1CqQT input::placeholder,\n.ui_TextField__1CqQT textarea::placeholder {\n color: #6a668e;\n}\n\n/** CheckBox */\n.ui_mdf_checkbox_container__2jTik {\n display: block;\n position: relative;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n color: #ffffff;\n padding-left: 28px;\n font-size: 14px;\n font-weight: bold;\n}\n\n/* Hide the browser's default checkbox */\n.ui_mdf_checkbox_container__2jTik input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n height: 0;\n width: 0;\n}\n\n/* Create a custom checkbox */\n.ui_mdf_checkbox__2x0v8 {\n position: absolute;\n top: 0;\n left: 0;\n height: 22px;\n width: 22px;\n background-color: #2d2950;\n border-radius: 2px;\n}\n\n/* Show the checkmark when checked */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8:after {\n display: block;\n}\n\n/* Style the checkmark/indicator */\n.ui_mdf_checkmark__G11Fa {\n content: \"\";\n position: absolute;\n display: none;\n left: 7px;\n top: 2px;\n width: 8px;\n height: 15px;\n border: solid #7ffacc;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n/* Show checkmark when input selected */\n.ui_mdf_checkbox_container__2jTik input:checked ~ .ui_mdf_checkbox__2x0v8 > .ui_mdf_checkmark__G11Fa {\n display: block;\n}\n\n/** Slider */\n.ui_slider__2s9Vu {\n -webkit-appearance: none;\n width: 100%;\n height: 7px;\n background: #6a668e;\n outline: none;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n.ui_slider__2s9Vu::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 17px;\n height: 17px;\n background: #ffffff;\n cursor: pointer;\n border-radius: 50px;\n box-shadow: 0px 15px -6px rgba(0, 0, 0, 0.1);\n}\n\n/** Keyframes Animation */\n\n@keyframes ui_FadeIn__37wwp {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes ui_SidePanelAppear__d4yW4 {\n 0% {\n right: -600px;\n }\n 100% {\n right: 0px;\n }\n}\n@keyframes ui_SidePanelMobileAppear__20yxI {\n 0% {\n bottom: -500px;\n }\n 100% {\n bottom: 0px;\n }\n}\n@keyframes ui_ModalAppear__dy6j7 {\n 0% {\n top: 180px;\n }\n 100% {\n right: 60px;\n }\n}\n";
var styles = { "root": "ui_root__c-Sk1", "Main": "ui_Main__2PgQ-", "Card": "ui_Card__3_XoG", "CardChildContainer": "ui_CardChildContainer__3B9dp", "Background_Wrapper": "ui_Background_Wrapper__3ysTm", "FadeIn": "ui_FadeIn__37wwp", "SidePanel": "ui_SidePanel__1dhp0", "SidePanelMobileAppear": "ui_SidePanelMobileAppear__20yxI", "SidePanelAppear": "ui_SidePanelAppear__d4yW4", "Modal": "ui_Modal__1zwxd", "ModalAppear": "ui_ModalAppear__dy6j7", "label_asset": "ui_label_asset__1y4-g", "mdf_button": "ui_mdf_button__1TYo3", "white_bg": "ui_white_bg__2MU5a", "green_bg": "ui_green_bg__3AlUi", "yellow_bg": "ui_yellow_bg__38Vs1", "pink_bg": "ui_pink_bg__1xndu", "mdf_badge": "ui_mdf_badge__2ay4v", "mdf_badge_label": "ui_mdf_badge_label__1lXDM", "mdf_table": "ui_mdf_table__2DkfT", "align_middle": "ui_align_middle__3C6YL", "white": "ui_white__3hSFF", "grey": "ui_grey__3RMEb", "blue": "ui_blue__2sSDw", "yellow": "ui_yellow__1blKd", "pink": "ui_pink__2bael", "green": "ui_green__2HHBI", "red": "ui_red__3kihW", "inline_block": "ui_inline_block__3W1LN", "bold": "ui_bold__5MAcU", "italic": "ui_italic__2msns", "smallcaps": "ui_smallcaps__22Fif", "left": "ui_left__1C0J3", "center": "ui_center__3oIt6", "right": "ui_right__s2Wjf", "cursor": "ui_cursor__3nPSe", "p-10": "ui_p-10__24IpT", "pleft-5": "ui_pleft-5__eZL5k", "pleft-10": "ui_pleft-10__tcuAZ", "pleft-15": "ui_pleft-15__1easn", "pleft-20": "ui_pleft-20__2XdMx", "pright-5": "ui_pright-5__2NtbF", "pright-10": "ui_pright-10__1R3qK", "pright_15": "ui_pright_15__2GvQi", "pright-20": "ui_pright-20__1w3ya", "ptop-5": "ui_ptop-5__JzuYA", "ptop-10": "ui_ptop-10__233Di", "ptop-15": "ui_ptop-15__IyV-Y", "ptop-20": "ui_ptop-20__3tsF-", "ptop-25": "ui_ptop-25__2FXZ6", "mright-5": "ui_mright-5__2JO-T", "mright-10": "ui_mright-10__WQ64e", "mtop-10": "ui_mtop-10__WnHbc", "mtop-15": "ui_mtop-15__26ybX", "mtop-20": "ui_mtop-20__1REcA", "mtop-25": "ui_mtop-25__1yrj4", "mtop-30": "ui_mtop-30__1dB4B", "mtop-40": "ui_mtop-40__1zbxf", "mbottom-10": "ui_mbottom-10__16Wrr", "mbottom-15": "ui_mbottom-15__2GTPh", "mbottom-20": "ui_mbottom-20__G_gQw", "mbottom-25": "ui_mbottom-25__2_yYd", "br_2": "ui_br_2__1Sifd", "br_20": "ui_br_20__5YY1c", "TextField": "ui_TextField__1CqQT", "mdf_checkbox_container": "ui_mdf_checkbox_container__2jTik", "mdf_checkbox": "ui_mdf_checkbox__2x0v8", "mdf_checkmark": "ui_mdf_checkmark__G11Fa", "slider": "ui_slider__2s9Vu" };

@@ -40,0 +40,0 @@ styleInject(css);

2

package.json
{
"name": "@mydefi/ui",
"version": "0.1.19",
"version": "0.1.20",
"description": "UI components originally created for the MyDeFi app.",

@@ -5,0 +5,0 @@ "author": "baptistegreve",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc