METODO LAYOT


SUBMITTED BY: terrorxdroid

DATE: Oct. 2, 2024, 9:52 p.m.

UPDATED: Oct. 4, 2024, 9:54 a.m.

FORMAT: Text only

SIZE: 93.2 kB

HITS: 332

  1. [
  2. {
  3. "id": 22166,
  4. "label": "Nome do app",
  5. "name": "APP_NAME",
  6. "value": null,
  7. "type": "STRING",
  8. "status": "ACTIVE",
  9. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  10. },
  11. {
  12. "id": 22167,
  13. "label": "Logo do app",
  14. "name": "APP_LOGO",
  15. "value": "https://i.ibb.co/j4Q48sG/DT040a9i8j.png",
  16. "type": "IMAGE",
  17. "status": "ACTIVE",
  18. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  19. },
  20. {
  21. "id": 22168,
  22. "label": "Imagem de fundo",
  23. "name": "APP_BACKGROUND_IMAGE",
  24. "value": null,
  25. "type": "IMAGE",
  26. "status": "ACTIVE",
  27. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  28. },
  29. {
  30. "id": 22169,
  31. "label": "Tipo do fundo do app",
  32. "name": "APP_BACKGROUND_TYPE",
  33. "value": {
  34. "options": [
  35. {
  36. "label": "Imagem",
  37. "value": "IMAGE"
  38. },
  39. {
  40. "label": "Cor",
  41. "value": "COLOR"
  42. }
  43. ],
  44. "selected": "COLOR"
  45. },
  46. "type": "SELECT",
  47. "status": "ACTIVE",
  48. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  49. },
  50. {
  51. "id": 22170,
  52. "label": "Cor de fundo",
  53. "name": "APP_BACKGROUND_COLOR",
  54. "value": "#080e16c7",
  55. "type": "COLOR",
  56. "status": "ACTIVE",
  57. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  58. },
  59. {
  60. "id": 22171,
  61. "label": "Cor do card inicial",
  62. "name": "APP_CARD_COLOR",
  63. "value": "#1d242e73",
  64. "type": "COLOR",
  65. "status": "ACTIVE",
  66. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  67. },
  68. {
  69. "id": 22172,
  70. "label": "Raio do card inicial",
  71. "name": "APP_CARD_RADIUS",
  72. "value": 20,
  73. "type": "INTEGER",
  74. "status": "ACTIVE",
  75. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  76. },
  77. {
  78. "id": 22173,
  79. "label": "Cor do card de status",
  80. "name": "APP_CARD_STATUS_COLOR",
  81. "value": "#1d242e73",
  82. "type": "COLOR",
  83. "status": "ACTIVE",
  84. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  85. },
  86. {
  87. "id": 22174,
  88. "label": "Raio do card de status",
  89. "name": "APP_CARD_STATUS_RADIUS",
  90. "value": 25,
  91. "type": "INTEGER",
  92. "status": "ACTIVE",
  93. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  94. },
  95. {
  96. "id": 22175,
  97. "label": "Cor do card de configurações",
  98. "name": "APP_CARD_CONFIG_COLOR",
  99. "value": "#4298e182",
  100. "type": "COLOR",
  101. "status": "ACTIVE",
  102. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  103. },
  104. {
  105. "id": 22176,
  106. "label": "Cor do fundo dos dialogs",
  107. "name": "APP_DIALOG_BACKGROUND_COLOR",
  108. "value": "#4298e182",
  109. "type": "COLOR",
  110. "status": "ACTIVE",
  111. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  112. },
  113. {
  114. "id": 22177,
  115. "label": "Cor do fundo do dialog de log",
  116. "name": "APP_DIALOG_LOGGER_COLOR",
  117. "value": "#4298e182",
  118. "type": "COLOR",
  119. "status": "ACTIVE",
  120. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  121. },
  122. {
  123. "id": 22178,
  124. "label": "Cor das bordas",
  125. "name": "APP_BORDER_COLOR",
  126. "value": "#1d242e73",
  127. "type": "COLOR",
  128. "status": "ACTIVE",
  129. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  130. },
  131. {
  132. "id": 22179,
  133. "label": "Cor dos inputs",
  134. "name": "APP_INPUT_COLOR",
  135. "value": "#1d242e73",
  136. "type": "COLOR",
  137. "status": "ACTIVE",
  138. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  139. },
  140. {
  141. "id": 22180,
  142. "label": "Raio dos inputs",
  143. "name": "APP_INPUT_RADIUS",
  144. "value": 25,
  145. "type": "INTEGER",
  146. "status": "ACTIVE",
  147. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  148. },
  149. {
  150. "id": 22181,
  151. "label": "Cor dos textos",
  152. "name": "APP_TEXT_COLOR",
  153. "value": "#FFFFFFFF",
  154. "type": "COLOR",
  155. "status": "ACTIVE",
  156. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  157. },
  158. {
  159. "id": 22182,
  160. "label": "Cor dos botões",
  161. "name": "APP_BUTTON_COLOR",
  162. "value": "#1d242e73",
  163. "type": "COLOR",
  164. "status": "ACTIVE",
  165. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  166. },
  167. {
  168. "id": 22183,
  169. "label": "Raio dos botões",
  170. "name": "APP_BUTTON_RADIUS",
  171. "value": 25,
  172. "type": "INTEGER",
  173. "status": "ACTIVE",
  174. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  175. },
  176. {
  177. "id": 22184,
  178. "label": "Cor dos icones",
  179. "name": "APP_ICON_COLOR",
  180. "value": "#FFFFFFFF",
  181. "type": "COLOR",
  182. "status": "ACTIVE",
  183. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  184. },
  185. {
  186. "id": 22185,
  187. "label": "Exibir modo de conexão",
  188. "name": "APP_SHOW_CONNECTION_MODE",
  189. "value": true,
  190. "type": "BOOLEAN",
  191. "status": "ACTIVE",
  192. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  193. },
  194. {
  195. "id": 22871,
  196. "label": "Atualizar automaticamente as configurações ao lançar uma atualização.",
  197. "name": "APP_CONFIG_AUTO_UPDATE",
  198. "value": true,
  199. "type": "BOOLEAN",
  200. "status": "ACTIVE",
  201. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  202. },
  203. {
  204. "id": 22186,
  205. "label": "Iniciar o app automaticamente ao reiniciar o dispositivo",
  206. "name": "APP_AUTO_START",
  207. "value": false,
  208. "type": "BOOLEAN",
  209. "status": "ACTIVE",
  210. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  211. },
  212. {
  213. "id": 22187,
  214. "label": "Usar limiter de conexão",
  215. "name": "APP_CONNECTION_LIMITER",
  216. "value": false,
  217. "type": "BOOLEAN",
  218. "status": "ACTIVE",
  219. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  220. },
  221. {
  222. "id": 22188,
  223. "label": "Usar botão de atualizações",
  224. "name": "APP_BTN_UPDATE_ENABLED",
  225. "value": false,
  226. "type": "BOOLEAN",
  227. "status": "ACTIVE",
  228. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  229. },
  230. {
  231. "id": 22189,
  232. "label": "Usar botão de registros",
  233. "name": "APP_BTN_LOGGER_ENABLED",
  234. "value": false,
  235. "type": "BOOLEAN",
  236. "status": "ACTIVE",
  237. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  238. },
  239. {
  240. "id": 22190,
  241. "label": "Usar botão de pagina webview",
  242. "name": "APP_BTN_PAGE_ENABLED",
  243. "value": false,
  244. "type": "BOOLEAN",
  245. "status": "ACTIVE",
  246. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  247. },
  248. {
  249. "id": 22191,
  250. "label": "Ativar dialog de erros",
  251. "name": "APP_DIALOG_ERROR_ENABLED",
  252. "value": false,
  253. "type": "BOOLEAN",
  254. "status": "ACTIVE",
  255. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  256. },
  257. {
  258. "id": 22192,
  259. "label": "Ativar dialog de checkuser",
  260. "name": "APP_CHECKUSER_DIALOG_ENABLED",
  261. "value": false,
  262. "type": "BOOLEAN",
  263. "status": "ACTIVE",
  264. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  265. },
  266. {
  267. "id": 22193,
  268. "label": "Ativar toast de sucesso",
  269. "name": "APP_SUCCESS_TOAST_ENABLED",
  270. "value": true,
  271. "type": "BOOLEAN",
  272. "status": "ACTIVE",
  273. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  274. },
  275. {
  276. "id": 22194,
  277. "label": "Ativar toast de erro",
  278. "name": "APP_ERROR_TOAST_ENABLED",
  279. "value": false,
  280. "type": "BOOLEAN",
  281. "status": "ACTIVE",
  282. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  283. },
  284. {
  285. "id": 22195,
  286. "label": "Usar layout webview",
  287. "name": "APP_LAYOUT_WEBVIEW_ENABLED",
  288. "value": true,
  289. "type": "BOOLEAN",
  290. "status": "ACTIVE",
  291. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  292. },
  293. {
  294. "id": 22196,
  295. "label": "Mensagem",
  296. "name": "APP_MESSAGE",
  297. "value": null,
  298. "type": "TEXT",
  299. "status": "ACTIVE",
  300. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  301. },
  302. {
  303. "id": 22197,
  304. "label": "URL de atualização do aplicativo",
  305. "name": "APP_UPDATE_URL",
  306. "value": null,
  307. "type": "URL",
  308. "status": "ACTIVE",
  309. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  310. },
  311. {
  312. "id": 22198,
  313. "label": "Tipo de mensagem",
  314. "name": "APP_MESSAGE_TYPE",
  315. "value": {
  316. "options": [
  317. {
  318. "label": "Alerta",
  319. "value": "ALERT"
  320. },
  321. {
  322. "label": "Informação",
  323. "value": "INFO"
  324. },
  325. {
  326. "label": "Boas vindas",
  327. "value": "WELCOME"
  328. },
  329. {
  330. "label": "Sem mensagem",
  331. "value": "NONE"
  332. }
  333. ],
  334. "selected": "NONE"
  335. },
  336. "type": "SELECT",
  337. "status": "ACTIVE",
  338. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  339. },
  340. {
  341. "id": 22199,
  342. "label": "LAYOUT WEBVIEW (POR SUA CONTA E RISCO)",
  343. "name": "APP_LAYOUT_WEBVIEW",
  344. "value": "<!DOCTYPE html>\n<html lang=\"en\">\n <head>\n <title>Document</title>\n\n <meta charset=\"UTF-8\" />\n <meta\n name=\"viewport\"\n content=\"width=device-width, initial-scale=1.0, user-scalable=no\"\n />\n\n <style>\n :root {\n --background-color-main: #001432;\n --background-image-main: url(\"\");\n\n --header-container-color: linear-gradient(\n to top right,\n #b616b6,\n #993399\n );\n --background-container-color: #001432;\n\n --border-color: linear-gradient(to top right, #b616b6, #993399);\n --border-loading-color: #ffffff;\n\n --text-color: #ffffff;\n --text-alert-color: #ff0000;\n\n --icons-color: #ffffff;\n\n --background-buttons-color: linear-gradient(\n to top right,\n #b616b6,\n #993399\n );\n\n --margem-do-topo-do-modal: 10px;\n --margem-do-bottom-do-modal: 10px;\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n html,\n body,\n main {\n width: 100%;\n height: 100%;\n }\n\n body {\n background: var(--background-color-main);\n background-image: var(--background-image-main);\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n }\n\n main {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 20px;\n\n position: relative;\n\n transition: padding-bottom 0.3s ease 0.2s;\n\n overflow: hidden;\n }\n\n .container-logo {\n width: 95%;\n height: auto;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n margin-top: 40px;\n\n padding: 5px 3px;\n }\n\n .container-logo img {\n width: 50%;\n max-width: 300px;\n }\n\n .container {\n width: 95%;\n max-width: 450px;\n height: auto;\n\n position: relative;\n\n border-radius: 5px;\n\n background: transparent;\n }\n\n .container header {\n width: 95%;\n height: 45px;\n\n display: flex;\n align-items: center;\n gap: 10px;\n\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n\n margin: auto;\n padding: 5px 10px;\n\n background: transparent;\n }\n\n .container header button:first-child {\n visibility: hidden;\n }\n\n .container header button {\n flex: 1;\n height: 100%;\n\n border: 0;\n border-radius: 20px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n\n background: var(--background-buttons-color);\n }\n\n .container form {\n width: 100%;\n height: calc(100% - 45px);\n\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n\n margin: 10px 0px;\n padding: 0px 3px;\n }\n\n .container form div {\n width: 95%;\n height: 45px;\n\n display: flex;\n align-items: center;\n\n border-radius: 50px;\n\n padding: 0px 10px;\n\n background: #b616b6;\n }\n\n .container form div#uuid-container {\n display: none;\n }\n\n .container form div svg {\n width: 38px;\n height: 100%;\n\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n\n padding: 0px 10px;\n\n border-right: 1px solid var(--border-color);\n\n color: var(--icons-color);\n }\n\n .container form div svg path {\n transform: scale(1);\n }\n\n .container form div input {\n width: 100%;\n height: 100%;\n\n border: 0;\n outline: none;\n\n padding-left: 5px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-size: 1rem;\n\n background: transparent;\n }\n\n .container form div input::placeholder {\n color: #dddddd;\n }\n\n .form-buttons {\n width: 100%;\n\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n\n margin-top: 10px;\n padding: 0px 5px;\n }\n\n .form-buttons button {\n flex: 1;\n height: 45px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 5px;\n\n border: 0;\n border-radius: 20px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n\n background: var(--background-buttons-color);\n\n & > svg {\n width: 16px;\n height: 16px;\n }\n }\n\n .form-buttons button:last-child {\n width: 50%;\n flex-basis: 100%;\n\n margin-top: 10px;\n }\n\n .menu {\n width: 100%;\n height: calc(100% - 45px);\n\n position: absolute;\n top: 45px;\n left: 0;\n right: 0;\n bottom: 0;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 13px;\n\n padding: 10px 5px;\n\n border-bottom-left-radius: 5px;\n border-bottom-right-radius: 5px;\n\n opacity: 0;\n transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n transform-origin: 100% 100%;\n\n background: var(--background-color-main);\n }\n\n .menu button {\n width: 95%;\n height: 45px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n border: 0;\n border-radius: 17.5px;\n\n background: var(--background-buttons-color);\n }\n\n .menu button svg {\n width: 20px;\n height: 20px;\n\n color: var(--icons-color);\n\n margin-right: 5px;\n }\n\n .menu button span {\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n }\n\n .status-vpn {\n width: 100%;\n max-width: 450px;\n height: auto;\n }\n\n .status-vpn section {\n width: 90%;\n height: 40px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n\n margin: 0 auto;\n\n border-radius: 20px;\n\n background: #b616b6;\n }\n\n .status-vpn section svg {\n color: #ffffff;\n }\n\n .status-vpn section h1 {\n color: #ffffff;\n font-family: \"Roboto\", sans-serif;\n font-weight: 400;\n font-size: 1rem;\n }\n\n .home-menu {\n width: 95%;\n max-width: 450px;\n height: auto;\n\n display: flex;\n flex-direction: column;\n justify-content: center;\n gap: 10px;\n\n position: absolute;\n bottom: 20px;\n\n padding: 0px 10px;\n }\n\n .home-menu button {\n width: auto;\n height: 45px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 5px;\n\n padding: 0px 10px;\n\n border: 0px;\n border-radius: 20px;\n\n background: var(--background-buttons-color);\n }\n\n .home-menu button svg {\n width: 20px;\n height: 20px;\n color: var(--icons-color);\n }\n\n .home-menu button span {\n color: var(--text-color);\n }\n\n .modal-speedtest,\n .modal-configs,\n .modal-logs,\n .modal-alert-clear-data,\n .modal-error-alert,\n .modal-status-vpn,\n .modal-checkuser,\n .modal-loading,\n .modal-gen-test,\n .modal-buy-access,\n .modal-call-support {\n width: 98%;\n max-width: 450px;\n height: calc(\n 100% - var(--margem-do-bottom-do-modal) -\n var(--margem-do-topo-do-modal)\n );\n\n position: absolute;\n top: var(--margem-do-topo-do-modal);\n left: auto;\n right: auto;\n bottom: var(--margem-do-bottom-do-modal);\n z-index: 2;\n\n display: flex;\n flex-direction: column;\n\n border-radius: 5px;\n\n overflow: hidden;\n\n opacity: 0;\n transform: scale(0);\n transform-origin: center;\n transition: all 0.3s ease 0.1s;\n }\n\n .show {\n opacity: 1;\n transform: scale(1);\n }\n\n .modal-speedtest header,\n .modal-configs header,\n .modal-logs header,\n .modal-alert-clear-data header,\n .modal-error-alert header,\n .modal-status-vpn header,\n .modal-checkuser header,\n .modal-loading header,\n .modal-gen-test header,\n .modal-buy-access header,\n .modal-call-support header {\n width: 100%;\n height: 40px;\n\n display: flex;\n align-items: center;\n\n padding: 0px 10px;\n\n background: var(--header-container-color);\n }\n\n .modal-speedtest header svg,\n .modal-configs header svg,\n .modal-logs header svg,\n .modal-alert-clear-data header svg,\n .modal-error-alert header svg,\n .modal-status-vpn header svg,\n .modal-checkuser header svg,\n .modal-loading header svg,\n .modal-gen-test header svg,\n .modal-buy-access header svg,\n .modal-call-support header svg {\n margin-left: auto;\n\n color: var(--icons-color);\n }\n\n .modal-speedtest section,\n .modal-configs section,\n .modal-logs section,\n .modal-alert-clear-data section,\n .modal-error-alert section,\n .modal-status-vpn section,\n .modal-checkuser section,\n .modal-loading section,\n .modal-gen-test section,\n .modal-buy-access section,\n .modal-call-support section {\n background: var(--background-container-color);\n }\n\n .modal-speedtest section,\n .modal-gen-test section,\n .modal-buy-access section,\n .modal-call-support section {\n width: 100%;\n height: calc(100% - 40px);\n\n position: relative;\n\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .modal-logs section,\n .modal-checkuser section {\n width: 100%;\n height: calc(100% - 40px);\n\n position: relative;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n\n .modal-logs section p {\n width: 100%;\n height: auto;\n max-height: calc(100% - 65px);\n\n margin: 10px 0px;\n padding: 0px 10px;\n\n overflow-y: auto;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-size: 0.7rem;\n }\n\n .modal-logs section button {\n width: 80%;\n height: 45px;\n\n margin-top: auto;\n margin-bottom: 5px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n border: 0;\n border-radius: 17.5px;\n\n background: var(--background-buttons-color);\n }\n\n .modal-logs section button svg {\n color: var(--icons-color);\n\n margin-right: 5px;\n }\n\n .modal-logs section button span {\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n }\n\n .modal-speedtest section iframe,\n .modal-gen-test section iframe,\n .modal-buy-access section iframe,\n .modal-call-support section iframe {\n width: 100%;\n height: 100%;\n\n border: 0;\n\n overflow: hidden;\n }\n\n .modal-checkuser section {\n padding: 10px;\n\n justify-content: center;\n }\n\n .modal-checkuser section h1 {\n width: 100%;\n height: 40px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n margin: 20px;\n\n border-bottom: 2px solid var(--background-buttons-color);\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-weight: 400;\n }\n\n .modal-checkuser section div {\n width: 100%;\n height: 40px;\n\n display: flex;\n align-items: center;\n\n margin: 10px 0px;\n\n border-radius: 20px;\n\n background: var(--background-buttons-color);\n\n overflow: hidden;\n }\n\n .modal-checkuser section div i {\n width: 40px;\n height: 40px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n color: var(--icons-color);\n }\n\n .modal-checkuser section div span {\n width: calc(100% - 40px);\n height: 100%;\n\n display: flex;\n align-items: center;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n }\n\n .modal-configs section {\n width: 100%;\n height: calc(100% - 40px);\n\n overflow-y: auto;\n }\n\n .modal-configs section div {\n width: 100%;\n height: auto;\n\n margin-top: 10px;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n\n .modal-configs section div h1.title {\n width: 90%;\n min-height: 30px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n margin: 10px 0px;\n margin-top: 10px;\n\n border-radius: 15px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-size: 0.9rem;\n\n background: var(--background-buttons-color);\n }\n\n .modal-configs section div ul {\n width: 100%;\n height: auto;\n\n margin-top: 5px;\n\n padding: 0px 10px;\n\n border-radius: 15px;\n }\n\n .modal-configs section div ul li {\n width: 100%;\n height: 60px;\n min-height: 60px;\n\n display: flex;\n align-items: center;\n\n margin: 0px 0px 10px 0px;\n\n padding: 5px;\n padding-left: 15px;\n\n border-radius: 30px;\n\n overflow: hidden;\n\n background: #000;\n }\n\n .modal-configs section ul li img {\n width: 30px;\n height: 30px;\n }\n\n .modal-configs section ul li div {\n width: calc(100% - 40px);\n height: 40px;\n\n margin-left: 5px;\n\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n\n overflow: hidden;\n }\n\n .modal-configs section ul li div h1 {\n color: var(--text-color);\n font-size: 0.7rem;\n font-weight: 600;\n font-family: \"Roboto\", sans-serif;\n }\n\n .modal-configs section ul li div p {\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-size: 0.6rem;\n font-weight: 400;\n }\n\n .modal-alert-clear-data section,\n .modal-error-alert section,\n .modal-status-vpn section,\n .modal-loading section {\n width: 100%;\n height: calc(100% - 40px);\n\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n }\n\n .modal-alert-clear-data section svg,\n .modal-error-alert section svg {\n width: 128px;\n height: auto;\n\n color: var(--text-alert-color);\n }\n\n .modal-alert-clear-data section h1,\n .modal-error-alert section h1 {\n margin: 10px 0px;\n\n color: var(--text-alert-color);\n font-family: \"Roboto\", sans-serif;\n }\n\n .modal-alert-clear-data section p,\n .modal-error-alert section p {\n height: 145px;\n max-height: 145px;\n\n overflow-y: auto;\n\n margin-bottom: 10px;\n\n padding: 10px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-weight: 300;\n }\n\n .modal-error-alert section p {\n text-align: center;\n }\n\n .modal-alert-clear-data section div {\n width: 95%;\n height: auto;\n\n margin-top: 10px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n }\n\n .modal-alert-clear-data section div button {\n width: 150px;\n height: 45px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n padding: 0px 5px;\n\n border: 0;\n border-radius: 20px;\n\n background: var(--background-buttons-color);\n }\n\n .modal-alert-clear-data section div button svg {\n width: 16px;\n height: auto;\n\n margin-left: 6px;\n\n color: var(--icons-color);\n }\n\n .modal-alert-clear-data section div button span {\n margin-left: 5px;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n font-size: 0.7rem;\n }\n\n .modal-status-vpn section {\n position: relative;\n }\n\n .modal-status-vpn section div.loading-status,\n .modal-loading section div {\n width: 70px;\n height: 70px;\n\n position: relative;\n\n border: 4px solid var(--border-loading-color);\n border-radius: 50%;\n border-top: 4px solid transparent;\n\n animation: spin 1s infinite linear;\n }\n\n .modal-status-vpn section div.loading-status svg,\n .modal-loading section svg {\n width: 100%;\n height: 100%;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n color: var(--icons-color);\n padding: 15px;\n\n position: absolute;\n top: auto;\n left: auto;\n right: auto;\n bottom: auto;\n\n animation: spin 1s infinite linear reverse;\n }\n\n .modal-status-vpn section h1 {\n margin-top: 15%;\n\n color: var(--text-color);\n font-family: \"Roboto\", sans-serif;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .boingInUp {\n -webkit-animation-name: boingInUp;\n animation-name: boingInUp;\n }\n @-webkit-keyframes boingInUp {\n 0% {\n opacity: 0;\n transform: perspective(800px) rotateX(-90deg);\n transform-origin: 50% 0;\n }\n 50% {\n opacity: 1;\n transform: perspective(800px) rotateX(50deg);\n transform-origin: 50% 0;\n }\n to {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg);\n transform-origin: 50% 0;\n }\n }\n @keyframes boingInUp {\n 0% {\n opacity: 0;\n transform: perspective(800px) rotateX(-90deg);\n transform-origin: 50% 0;\n }\n 50% {\n opacity: 1;\n transform: perspective(800px) rotateX(50deg);\n transform-origin: 50% 0;\n }\n to {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg);\n transform-origin: 50% 0;\n }\n }\n .boingOutDown {\n -webkit-animation-name: boingOutDown;\n animation-name: boingOutDown;\n }\n @-webkit-keyframes boingOutDown {\n 0% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n transform-origin: 100% 100%;\n }\n 20% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n transform-origin: 100% 100%;\n }\n 30% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n transform-origin: 0 100%;\n }\n 40% {\n opacity: 1;\n transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n transform-origin: 0 100%;\n }\n to {\n opacity: 0;\n transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n transform-origin: 100% 100%;\n }\n }\n @keyframes boingOutDown {\n 0% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n transform-origin: 100% 100%;\n }\n 20% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(10deg);\n transform-origin: 100% 100%;\n }\n 30% {\n opacity: 1;\n transform: perspective(800px) rotateX(0deg) rotateY(0deg);\n transform-origin: 0 100%;\n }\n 40% {\n opacity: 1;\n transform: perspective(800px) rotateX(10deg) rotateY(10deg);\n transform-origin: 0 100%;\n }\n to {\n opacity: 0;\n transform: perspective(800px) rotateX(90deg) rotateY(0deg);\n transform-origin: 100% 100%;\n }\n }\n .magictime {\n -webkit-animation-duration: 1s;\n animation-duration: 1s;\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both;\n }\n @media (prefers-reduced-motion), (print) {\n .magictime {\n -webkit-animation: unset !important;\n animation: unset !important;\n transition: none !important;\n }\n }\n\n @media (max-width: 375px) {\n .container form div {\n height: 35px;\n }\n\n .form-buttons button {\n height: 35px;\n }\n\n .home-menu button {\n height: 35px;\n }\n }\n </style>\n </head>\n <body>\n <main>\n <section class=\"container-logo\">\n <!-- PARA TROCAR A LOGO É SÓ COLOCAR UM LINK COM A IMAGEM DIRETO NO SRC -->\n <img id=\"app-logo\" src=\"\" alt=\"Logo do app\" />\n </section>\n\n <section class=\"container\">\n <header>\n <button>Log-in</button>\n <button id=\"configuracao\">Configurações</button>\n </header>\n\n <form>\n <div id=\"operadora\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n class=\"bi bi-ethernet\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M14 13.5v-7a.5.5 0 0 0-.5-.5H12V4.5a.5.5 0 0 0-.5-.5h-1v-.5A.5.5 0 0 0 10 3H6a.5.5 0 0 0-.5.5V4h-1a.5.5 0 0 0-.5.5V6H2.5a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5h11a.5.5 0 0 0 .5-.5ZM3.75 11h.5a.25.25 0 0 1 .25.25v1.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-1.5a.25.25 0 0 1 .25-.25Zm2 0h.5a.25.25 0 0 1 .25.25v1.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-1.5a.25.25 0 0 1 .25-.25Zm1.75.25a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v1.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-1.5ZM9.75 11h.5a.25.25 0 0 1 .25.25v1.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-1.5a.25.25 0 0 1 .25-.25Zm1.75.25a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v1.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-1.5Z\"\n />\n <path\n d=\"M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2ZM1 2a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2Z\"\n />\n </svg>\n\n <input\n id=\"operator-selected\"\n type=\"text\"\n placeholder=\"Escolha sua operadora\"\n readonly\n />\n </div>\n\n <div id=\"user-container\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z\"\n />\n </svg>\n\n <input id=\"user\" type=\"text\" placeholder=\"Usuário\" />\n </div>\n\n <div id=\"password-container\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M15.75 5.25a3 3 0 013 3m3 0a6 6 0 01-7.029 5.912c-.563-.097-1.159.026-1.563.43L10.5 17.25H8.25v2.25H6v2.25H2.25v-2.818c0-.597.237-1.17.659-1.591l6.499-6.499c.404-.404.527-1 .43-1.563A6 6 0 1121.75 8.25z\"\n />\n </svg>\n\n <input id=\"password\" type=\"password\" placeholder=\"Senha\" />\n </div>\n\n <div id=\"uuid-container\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-fingerprint\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M8.06 6.5a.5.5 0 0 1 .5.5v.776a11.5 11.5 0 0 1-.552 3.519l-1.331 4.14a.5.5 0 0 1-.952-.305l1.33-4.141a10.5 10.5 0 0 0 .504-3.213V7a.5.5 0 0 1 .5-.5Z\"\n />\n <path\n d=\"M6.06 7a2 2 0 1 1 4 0 .5.5 0 1 1-1 0 1 1 0 1 0-2 0v.332c0 .409-.022.816-.066 1.221A.5.5 0 0 1 6 8.447c.04-.37.06-.742.06-1.115V7Zm3.509 1a.5.5 0 0 1 .487.513 11.5 11.5 0 0 1-.587 3.339l-1.266 3.8a.5.5 0 0 1-.949-.317l1.267-3.8a10.5 10.5 0 0 0 .535-3.048A.5.5 0 0 1 9.569 8Zm-3.356 2.115a.5.5 0 0 1 .33.626L5.24 14.939a.5.5 0 1 1-.955-.296l1.303-4.199a.5.5 0 0 1 .625-.329Z\"\n />\n <path\n d=\"M4.759 5.833A3.501 3.501 0 0 1 11.559 7a.5.5 0 0 1-1 0 2.5 2.5 0 0 0-4.857-.833.5.5 0 1 1-.943-.334Zm.3 1.67a.5.5 0 0 1 .449.546 10.72 10.72 0 0 1-.4 2.031l-1.222 4.072a.5.5 0 1 1-.958-.287L4.15 9.793a9.72 9.72 0 0 0 .363-1.842.5.5 0 0 1 .546-.449Zm6 .647a.5.5 0 0 1 .5.5c0 1.28-.213 2.552-.632 3.762l-1.09 3.145a.5.5 0 0 1-.944-.327l1.089-3.145c.382-1.105.578-2.266.578-3.435a.5.5 0 0 1 .5-.5Z\"\n />\n <path\n d=\"M3.902 4.222a4.996 4.996 0 0 1 5.202-2.113.5.5 0 0 1-.208.979 3.996 3.996 0 0 0-4.163 1.69.5.5 0 0 1-.831-.556Zm6.72-.955a.5.5 0 0 1 .705-.052A4.99 4.99 0 0 1 13.059 7v1.5a.5.5 0 1 1-1 0V7a3.99 3.99 0 0 0-1.386-3.028.5.5 0 0 1-.051-.705ZM3.68 5.842a.5.5 0 0 1 .422.568c-.029.192-.044.39-.044.59 0 .71-.1 1.417-.298 2.1l-1.14 3.923a.5.5 0 1 1-.96-.279L2.8 8.821A6.531 6.531 0 0 0 3.058 7c0-.25.019-.496.054-.736a.5.5 0 0 1 .568-.422Zm8.882 3.66a.5.5 0 0 1 .456.54c-.084 1-.298 1.986-.64 2.934l-.744 2.068a.5.5 0 0 1-.941-.338l.745-2.07a10.51 10.51 0 0 0 .584-2.678.5.5 0 0 1 .54-.456Z\"\n />\n <path\n d=\"M4.81 1.37A6.5 6.5 0 0 1 14.56 7a.5.5 0 1 1-1 0 5.5 5.5 0 0 0-8.25-4.765.5.5 0 0 1-.5-.865Zm-.89 1.257a.5.5 0 0 1 .04.706A5.478 5.478 0 0 0 2.56 7a.5.5 0 0 1-1 0c0-1.664.626-3.184 1.655-4.333a.5.5 0 0 1 .706-.04ZM1.915 8.02a.5.5 0 0 1 .346.616l-.779 2.767a.5.5 0 1 1-.962-.27l.778-2.767a.5.5 0 0 1 .617-.346Zm12.15.481a.5.5 0 0 1 .49.51c-.03 1.499-.161 3.025-.727 4.533l-.07.187a.5.5 0 0 1-.936-.351l.07-.187c.506-1.35.634-2.74.663-4.202a.5.5 0 0 1 .51-.49Z\"\n />\n </svg>\n\n <input id=\"uuid\" type=\"password\" placeholder=\"UUID\" />\n </div>\n\n <section class=\"form-buttons\">\n <button id=\"update-config\" type=\"button\" title=\"Atualizar\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-arrow-clockwise\"\n viewBox=\"0 0 16 16\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z\"\n />\n <path\n d=\"M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z\"\n />\n </svg>\n\n <span>ATUALIZAR</span>\n </button>\n\n <button id=\"logs-button\" type=\"button\" title=\"Registro\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M12 12.75c1.148 0 2.278.08 3.383.237 1.037.146 1.866.966 1.866 2.013 0 3.728-2.35 6.75-5.25 6.75S6.75 18.728 6.75 15c0-1.046.83-1.867 1.866-2.013A24.204 24.204 0 0112 12.75zm0 0c2.883 0 5.647.508 8.207 1.44a23.91 23.91 0 01-1.152 6.06M12 12.75c-2.883 0-5.647.508-8.208 1.44.125 2.104.52 4.136 1.153 6.06M12 12.75a2.25 2.25 0 002.248-2.354M12 12.75a2.25 2.25 0 01-2.248-2.354M12 8.25c.995 0 1.971-.08 2.922-.236.403-.066.74-.358.795-.762a3.778 3.778 0 00-.399-2.25M12 8.25c-.995 0-1.97-.08-2.922-.236-.402-.066-.74-.358-.795-.762a3.734 3.734 0 01.4-2.253M12 8.25a2.25 2.25 0 00-2.248 2.146M12 8.25a2.25 2.25 0 012.248 2.146M8.683 5a6.032 6.032 0 01-1.155-1.002c.07-.63.27-1.222.574-1.747m.581 2.749A3.75 3.75 0 0115.318 5m0 0c.427-.283.815-.62 1.155-.999a4.471 4.471 0 00-.575-1.752M4.921 6a24.048 24.048 0 00-.392 3.314c1.668.546 3.416.914 5.223 1.082M19.08 6c.205 1.08.337 2.187.392 3.314a23.882 23.882 0 01-5.223 1.082\"\n />\n </svg>\n\n <span>REGISTRO</span>\n </button>\n\n <button id=\"vpn-start\" type=\"button\" title=\"Conectar\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-plug\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M6 0a.5.5 0 0 1 .5.5V3h3V.5a.5.5 0 0 1 1 0V3h1a.5.5 0 0 1 .5.5v3A3.5 3.5 0 0 1 8.5 10c-.002.434-.01.845-.04 1.22-.041.514-.126 1.003-.317 1.424a2.083 2.083 0 0 1-.97 1.028C6.725 13.9 6.169 14 5.5 14c-.998 0-1.61.33-1.974.718A1.922 1.922 0 0 0 3 16H2c0-.616.232-1.367.797-1.968C3.374 13.42 4.261 13 5.5 13c.581 0 .962-.088 1.218-.219.241-.123.4-.3.514-.55.121-.266.193-.621.23-1.09.027-.34.035-.718.037-1.141A3.5 3.5 0 0 1 4 6.5v-3a.5.5 0 0 1 .5-.5h1V.5A.5.5 0 0 1 6 0zM5 4v2.5A2.5 2.5 0 0 0 7.5 9h1A2.5 2.5 0 0 0 11 6.5V4H5z\"\n />\n </svg>\n\n <span>CONECTAR</span>\n </button>\n </section>\n </form>\n\n <section class=\"menu\">\n <button id=\"battery-optimization\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M21 10.5h.375c.621 0 1.125.504 1.125 1.125v2.25c0 .621-.504 1.125-1.125 1.125H21M4.5 10.5h6.75V15H4.5v-4.5zM3.75 18h15A2.25 2.25 0 0021 15.75v-6a2.25 2.25 0 00-2.25-2.25h-15A2.25 2.25 0 001.5 9.75v6A2.25 2.25 0 003.75 18z\"\n />\n </svg>\n\n <span>OTIMIZAÇÃO DE BATERIA</span>\n </button>\n\n <button id=\"apn-configuration\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.324.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 011.37.49l1.296 2.247a1.125 1.125 0 01-.26 1.431l-1.003.827c-.293.24-.438.613-.431.992a6.759 6.759 0 010 .255c-.007.378.138.75.43.99l1.005.828c.424.35.534.954.26 1.43l-1.298 2.247a1.125 1.125 0 01-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.57 6.57 0 01-.22.128c-.331.183-.581.495-.644.869l-.213 1.28c-.09.543-.56.941-1.11.941h-2.594c-.55 0-1.02-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 01-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 01-1.369-.49l-1.297-2.247a1.125 1.125 0 01.26-1.431l1.004-.827c.292-.24.437-.613.43-.992a6.932 6.932 0 010-.255c.007-.378-.138-.75-.43-.99l-1.004-.828a1.125 1.125 0 01-.26-1.43l1.297-2.247a1.125 1.125 0 011.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.087.22-.128.332-.183.582-.495.644-.869l.214-1.281z\"\n />\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\"\n />\n </svg>\n\n <span>CONFIGURAR APN</span>\n </button>\n\n <button id=\"checkuser\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-person-lines-fill\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M6 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-5 6s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H1zM11 3.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5zm.5 2.5a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1h-4zm2 3a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2zm0 3a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2z\"\n />\n </svg>\n\n <span>DETALHES DO USUÁRIO</span>\n </button>\n\n <button id=\"speedtest-button\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-router\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M5.525 3.025a3.5 3.5 0 0 1 4.95 0 .5.5 0 1 0 .707-.707 4.5 4.5 0 0 0-6.364 0 .5.5 0 0 0 .707.707Z\"\n />\n <path\n d=\"M6.94 4.44a1.5 1.5 0 0 1 2.12 0 .5.5 0 0 0 .708-.708 2.5 2.5 0 0 0-3.536 0 .5.5 0 0 0 .707.707ZM2.5 11a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1Zm4.5-.5a.5.5 0 1 0 1 0 .5.5 0 0 0-1 0Zm2.5.5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1Zm1.5-.5a.5.5 0 1 0 1 0 .5.5 0 0 0-1 0Zm2 0a.5.5 0 1 0 1 0 .5.5 0 0 0-1 0Z\"\n />\n <path\n d=\"M2.974 2.342a.5.5 0 1 0-.948.316L3.806 8H1.5A1.5 1.5 0 0 0 0 9.5v2A1.5 1.5 0 0 0 1.5 13H2a.5.5 0 0 0 .5.5h2A.5.5 0 0 0 5 13h6a.5.5 0 0 0 .5.5h2a.5.5 0 0 0 .5-.5h.5a1.5 1.5 0 0 0 1.5-1.5v-2A1.5 1.5 0 0 0 14.5 8h-2.306l1.78-5.342a.5.5 0 1 0-.948-.316L11.14 8H4.86L2.974 2.342ZM14.5 9a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 1 .5-.5h13Z\"\n />\n <path d=\"M8.5 5.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z\" />\n </svg>\n\n <span>TESTAR REDE</span>\n </button>\n\n <button id=\"clean-data-app\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0\"\n />\n </svg>\n\n <span>LIMPAR DADOS</span>\n </button>\n </section>\n </section>\n\n <section class=\"status-vpn\">\n <section>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-outlet\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M3.34 2.994c.275-.338.68-.494 1.074-.494h7.172c.393 0 .798.156 1.074.494.578.708 1.84 2.534 1.84 5.006 0 2.472-1.262 4.297-1.84 5.006-.276.338-.68.494-1.074.494H4.414c-.394 0-.799-.156-1.074-.494C2.762 12.297 1.5 10.472 1.5 8c0-2.472 1.262-4.297 1.84-5.006zm1.074.506a.376.376 0 0 0-.299.126C3.599 4.259 2.5 5.863 2.5 8c0 2.137 1.099 3.74 1.615 4.374.06.073.163.126.3.126h7.17c.137 0 .24-.053.3-.126.516-.633 1.615-2.237 1.615-4.374 0-2.137-1.099-3.74-1.615-4.374a.376.376 0 0 0-.3-.126h-7.17z\"\n />\n <path\n d=\"M6 5.5a.5.5 0 0 1 .5.5v1.5a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm4 0a.5.5 0 0 1 .5.5v1.5a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zM7 10v1h2v-1a1 1 0 0 0-2 0z\"\n />\n </svg>\n\n <h1>DESCONECTADO</h1>\n </section>\n </section>\n\n <section class=\"home-menu\">\n <button type=\"button\" id=\"buy-access\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke-width=\"1.5\"\n stroke=\"currentColor\"\n class=\"w-6 h-6\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n d=\"M15.75 10.5V6a3.75 3.75 0 10-7.5 0v4.5m11.356-1.993l1.263 12c.07.665-.45 1.243-1.119 1.243H4.25a1.125 1.125 0 01-1.12-1.243l1.264-12A1.125 1.125 0 015.513 7.5h12.974c.576 0 1.059.435 1.119 1.007zM8.625 10.5a.375.375 0 11-.75 0 .375.375 0 01.75 0zm7.5 0a.375.375 0 11-.75 0 .375.375 0 01.75 0z\"\n />\n </svg>\n\n <span>Comprar Acesso</span>\n </button>\n </section>\n\n <section class=\"modal-speedtest\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n id=\"close\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section>\n <div class=\"loading\"></div>\n <iframe title=\"fast\" id=\"iframe-speedtest\"></iframe>\n </section>\n </section>\n\n <section class=\"modal-configs\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section>\n <div>\n <h1 class=\"title\">VIVO</h1>\n\n <ul>\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>VIVO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>VIVO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>VIVO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n </ul>\n </div>\n\n <div>\n <h1 class=\"title\">TIM</h1>\n\n <ul>\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>TIM 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>TIM 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>TIM 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n </ul>\n </div>\n\n <div>\n <h1 class=\"title\">CLARO</h1>\n\n <ul>\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>CLARO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>CLARO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n\n <li>\n <img\n src=\"https://basteon.me/assets/images/app/operadoras/VIVO.png\"\n alt=\"icon\"\n />\n\n <div>\n <h1>CLARO 1 ➜ CONFIG 1 ➜ SV01.QFN</h1>\n <p>SERVIDOR: 🇧🇷 ➜ LATÊNCIA BAIXA</p>\n </div>\n </li>\n </ul>\n </div>\n </section>\n </section>\n\n <section class=\"modal-logs\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section>\n <p></p>\n\n <button class=\"clear-logs\" type=\"button\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-stars\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M7.657 6.247c.11-.33.576-.33.686 0l.645 1.937a2.89 2.89 0 0 0 1.829 1.828l1.936.645c.33.11.33.576 0 .686l-1.937.645a2.89 2.89 0 0 0-1.828 1.829l-.645 1.936a.361.361 0 0 1-.686 0l-.645-1.937a2.89 2.89 0 0 0-1.828-1.828l-1.937-.645a.361.361 0 0 1 0-.686l1.937-.645a2.89 2.89 0 0 0 1.828-1.828l.645-1.937zM3.794 1.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387A1.734 1.734 0 0 0 4.593 5.69l-.387 1.162a.217.217 0 0 1-.412 0L3.407 5.69A1.734 1.734 0 0 0 2.31 4.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387A1.734 1.734 0 0 0 3.407 2.31l.387-1.162zM10.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.732L9.1 2.137a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732L10.863.1z\"\n />\n </svg>\n <span>Limpar Registro</span>\n </button>\n </section>\n </section>\n\n <section class=\"modal-alert-clear-data\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-exclamation-triangle\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.146.146 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.163.163 0 0 1-.054.06.116.116 0 0 1-.066.017H1.146a.115.115 0 0 1-.066-.017.163.163 0 0 1-.054-.06.176.176 0 0 1 .002-.183L7.884 2.073a.147.147 0 0 1 .054-.057zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z\"\n />\n <path\n d=\"M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995z\"\n />\n </svg>\n\n <h1>ATENÇÃO</h1>\n\n <p>\n Ao limpar os dados do aplicativo, o aplicativo será redefinido como\n se estivesse sendo instalado pela primeira vez! Essa ação é\n irreversível. Será necessário inserir o usuário e senha novamente e\n atualizar o aplicativo para carregar as configurações atuais de\n conexão VPN.\n </p>\n\n <div>\n <button type=\"button\" id=\"back-clear-data-button\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-caret-left\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M10 12.796V3.204L4.519 8 10 12.796zm-.659.753-5.48-4.796a1 1 0 0 1 0-1.506l5.48-4.796A1 1 0 0 1 11 3.204v9.592a1 1 0 0 1-1.659.753z\"\n />\n </svg>\n <span>VOLTAR</span>\n </button>\n\n <button type=\"button\" id=\"clear-data-button-confirm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-trash\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6Z\"\n />\n <path\n d=\"M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1ZM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118ZM2.5 3h11V2h-11v1Z\"\n />\n </svg>\n <span>LIMPAR DADOS</span>\n </button>\n </div>\n </section>\n </section>\n\n <section class=\"modal-error-alert\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section></section>\n </section>\n\n <section class=\"modal-status-vpn\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n id=\"close-modal-status-vpn\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section class=\"modal-status-content\">\n <div class=\"loading-status\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-shield-x\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M5.338 1.59a61.44 61.44 0 0 0-2.837.856.481.481 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.725 10.725 0 0 0 2.287 2.233c.346.244.652.42.893.533.12.057.218.095.293.118a.55.55 0 0 0 .101.025.615.615 0 0 0 .1-.025c.076-.023.174-.061.294-.118.24-.113.547-.29.893-.533a10.726 10.726 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.775 11.775 0 0 1-2.517 2.453 7.159 7.159 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7.158 7.158 0 0 1-1.048-.625 11.777 11.777 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 62.456 62.456 0 0 1 5.072.56z\"\n />\n <path\n d=\"M6.146 5.146a.5.5 0 0 1 .708 0L8 6.293l1.146-1.147a.5.5 0 1 1 .708.708L8.707 7l1.147 1.146a.5.5 0 0 1-.708.708L8 7.707 6.854 8.854a.5.5 0 1 1-.708-.708L7.293 7 6.146 5.854a.5.5 0 0 1 0-.708z\"\n />\n </svg>\n </div>\n\n <h1 id=\"modal-status-text\">CONECTADO!</h1>\n </section>\n </section>\n\n <section class=\"modal-checkuser\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n id=\"close-modal-checkuser\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section></section>\n </section>\n\n <section class=\"modal-loading\">\n <header>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-x-lg\"\n id=\"close-modal-loading\"\n id=\"close-modal-checkuser\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z\"\n />\n </svg>\n </header>\n\n <section>\n <div>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-calendar3\"\n viewBox=\"0 0 16 16\"\n >\n <path\n d=\"M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z\"\n />\n <path\n d=\"M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z\"\n />\n </svg>\n </div>\n </section>\n </section>\n </main>\n\n <!-- FUNÇÕES DO APP -->\n <script>\n const dtStatusBarHeight = () => DtGetStatusBarHeight.execute()\n const dtNavbarHeight = () => DtGetNavigationBarHeight.execute()\n\n const dtAppLogo = () => DtGetAppConfig.execute(\"APP_LOGO\")\n\n const dtVpnState = () => DtGetVpnState.execute()\n\n const dtTranslateText = (label) => DtTranslateText.execute(label)\n\n const dtAllConfigs = () => DtGetConfigs.execute()\n const dtSetConfig = (id) => DtSetConfig.execute(id)\n const dtGetDefaultConfig = () => DtGetDefaultConfig.execute()\n\n const dtGetLogs = () => DtGetLogs.execute()\n const dtClearLogs = () => DtClearLogs.execute()\n\n const dtGetUsername = () => DtUsername.get()\n const dtSetUsername = (username) => DtUsername.set(username)\n const dtGetPassword = () => DtPassword.get()\n const dtSetPassword = (password) => DtPassword.set(password)\n const dtGetUUID = () => DtUuid.get()\n const dtSetUUID = (uuid) => DtUuid.set(uuid)\n\n const dtUpdate = () => DtStartAppUpdate.execute()\n\n const dtStartVpn = () => DtExecuteVpnStart.execute()\n const dtStopVpn = () => DtExecuteVpnStop.execute()\n\n const dtBatteryOptimization = () => DtIgnoreBatteryOptimizations.execute()\n const dtApnConfiguration = () => DtStartApnActivity.execute()\n const dtStartCheckUser = () => DtStartCheckUser.execute()\n const dtCleanDataApp = () => DtCleanApp.execute()\n const dtStartWebView = (url) => DtStartWebViewActivity.execute(url)\n const dtOpenBrowser = (url) => DtOpenExternalUrl.execute(url)\n </script>\n\n <!-- FUNÇÕES PARA O APP -->\n <script>\n const dtOnNewLogListener = () => writeModalContent()\n const dtConfigClickListener = () => writeInputCarrierList()\n const dtCheckUserStartedListener = () => showModalLoading()\n const dtVpnStateListener = (state) => vpnState(state)\n const dtCheckUserModelListener = (model) => writeModalCheckUser(model)\n\n const dtMessageErrorListener = (model) => writeModalError(model)\n </script>\n\n <!-- FUNÇÕES DE AJUDA -->\n <script>\n const createSvgIcon = (iconPath, Class = \"\") => {\n const svg = document.createElementNS(\n \"http://www.w3.org/2000/svg\",\n \"svg\"\n )\n svg.setAttribute(\"xmlns\", \"http://www.w3.org/2000/svg\")\n svg.setAttribute(\"width\", \"16\")\n svg.setAttribute(\"height\", \"16\")\n svg.setAttribute(\"fill\", \"currentColor\")\n svg.setAttribute(\"viewBox\", \"0 0 16 16\")\n svg.setAttribute(\"class\", Class)\n\n const path = document.createElementNS(\n \"http://www.w3.org/2000/svg\",\n \"path\"\n )\n path.setAttribute(\"d\", iconPath)\n\n svg.appendChild(path)\n return svg\n }\n\n const createListItem = (iconPath, Class = \"\", text) => {\n const li = document.createElement(\"li\")\n const svg = createSvgIcon(iconPath, Class)\n const span = document.createElement(\"span\")\n span.setAttribute(\"class\", Class)\n span.innerHTML = text\n li.appendChild(svg)\n li.appendChild(span)\n return li\n }\n </script>\n\n <!-- FUNÇÕES DO LAYOUT -->\n <script>\n const vpnState = (state) => {\n const stateLabel = state || dtVpnState()\n\n switch (stateLabel) {\n case \"DISCONNECTED\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_START\"))\n writeModalVpnState(disconnected())\n hiddenModalVpnState()\n writeStatusVpn(disconnected())\n return disconnected()\n case \"CONNECTING\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOP\"))\n writeModalVpnState(connecting())\n writeStatusVpn(connecting())\n return connecting()\n case \"CONNECTED\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOP\"))\n writeModalVpnState(connected())\n writeStatusVpn(connected())\n return connected()\n case \"STOPPING\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOPPING\"))\n writeModalVpnState(stopping())\n writeStatusVpn(stopping())\n return stopping()\n case \"NO_NETWORK\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOP\"))\n writeModalVpnState(noNetwork())\n writeStatusVpn(noNetwork())\n return noNetwork()\n case \"AUTH\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOP\"))\n writeModalVpnState(auth())\n writeStatusVpn(auth())\n return auth()\n case \"AUTH_FAILED\":\n StartStopVPNButton.html(dtTranslateText(\"LBL_BTN_STOP\"))\n writeModalVpnState(authFailed())\n writeStatusVpn(authFailed())\n return authFailed()\n default:\n return \"Não foi possível obter o status da conexão\"\n }\n }\n\n const showConfigMenu = () => {\n const menu = document.querySelector(\"section.menu\")\n\n if (\n !menu.className.includes(\"boingInUp\") &&\n !menu.className.includes(\"boingOutDown\")\n ) {\n menu.classList.add(\"magictime\", \"boingInUp\")\n HomeMenu.style({ visibility: `hidden` })\n } else if (menu.className.includes(\"boingInUp\")) {\n menu.classList.remove(\"magictime\", \"boingInUp\")\n menu.classList.add(\"magictime\", \"boingOutDown\")\n HomeMenu.style({ visibility: `visible` })\n } else if (menu.className.includes(\"boingOutDown\")) {\n menu.classList.remove(\"magictime\", \"boingOutDown\")\n menu.classList.add(\"magictime\", \"boingInUp\")\n HomeMenu.style({ visibility: `hidden` })\n } else {\n console.log(\"ocorreu um erro\")\n }\n }\n\n const showModalSpeedtest = () => {\n ModalSpeedtest.addClass(\"show\")\n\n IframeSpeedtest.attr({ src: \"https://fast.com/pt/\" })\n }\n const hiddenModalSpeedtest = () => {\n IframeSpeedtest.attr({ src: \"\" })\n\n ModalSpeedtest.removeClass(\"show\")\n }\n\n const writeCarrierList = () => {\n const writeCarrierList = document.querySelector(\n \"section.modal-configs section\"\n )\n\n writeCarrierList.innerHTML = \"\"\n\n const data = JSON.parse(dtAllConfigs())\n data.sort((a, b) => a.sorter - b.sorter)\n data.forEach((item, index) =>\n item.items.sort((a, b) => a.sorter - b.sorter)\n )\n data.forEach((category) => {\n const div = document.createElement(\"div\")\n const h1 = document.createElement(\"h1\")\n\n h1.classList.add(\"title\")\n h1.innerHTML = category.name\n\n const ul = document.createElement(\"ul\")\n\n category.items.forEach((item) => {\n const li = document.createElement(\"li\")\n li.innerHTML = `<img src=\"${item.icon}\" alt=\"icon\" /><div><h1>${\n item.name\n }</h1><p>${item.description ?? \"\"}</p></div>`\n\n li.addEventListener(\"click\", () => {\n dtSetConfig(item.id)\n\n ModalCarrierList.removeClass(\"show\")\n })\n\n ul.appendChild(li)\n })\n\n div.appendChild(h1)\n div.appendChild(ul)\n\n writeCarrierList.appendChild(div)\n })\n }\n const writeInputCarrierList = () => {\n const data = JSON.parse(dtGetDefaultConfig())\n\n const isV2ray = data?.mode?.toLowerCase()?.startsWith(\"v2ray\")\n\n InputCarrierValue.attr({\n placeholder: data.name ?? \"Escolha sua operadora\",\n })\n\n if (!data?.auth?.v2ray_uuid && isV2ray) {\n ContainerInputUser.style({ display: \"none\" })\n ContainerInputPassword.style({ display: \"none\" })\n ContainerInputUUID.style({ display: \"flex\" })\n InputUUIDValue.attr({ value: dtGetUUID() ?? \"\" })\n } else {\n ContainerInputPassword.style({ display: \"flex\" })\n ContainerInputUUID.style({ display: \"none\" })\n InputUserValue.attr({ value: dtGetUsername() ?? \"\" })\n InputPasswordValue.attr({ value: dtGetPassword() ?? \"\" })\n }\n }\n const showModalCarrierList = () => {\n writeCarrierList()\n\n ModalCarrierList.addClass(\"show\")\n }\n const hiddenModalCarrierList = () => {\n ModalCarrierList.removeClass(\"show\")\n }\n\n const writeModalContent = () => {\n const data = JSON.parse(dtGetLogs())\n\n let content = \"\"\n\n data.forEach((item) => {\n content += `${Object.keys(item)} ${item[Object.keys(item)]} <br>`\n })\n\n ModalLoggerContent.html(content)\n }\n const showModalLogger = () => {\n dtOnNewLogListener()\n\n const modal = document.querySelector(\"section.modal-logs\")\n\n if (!modal.className.includes(\"show\")) {\n ModalLogger.addClass(\"show\")\n }\n }\n const hiddenModalLogger = () => {\n ModalLogger.removeClass(\"show\")\n }\n\n const startStopVpn = () => {\n const state = dtVpnState()\n\n if (state !== \"CONNECTED\") {\n dtStartVpn()\n showModalVpnState()\n } else {\n dtStopVpn()\n }\n }\n\n const writeStatusVpn = (state) => {\n const icon = state.icon\n const text = `<h1 style=\"color: ${state.color}\">${state.text}</h1>`\n\n ContentContainerSVpnState.html(icon + text)\n\n return icon + text\n }\n\n const writeModalVpnState = (state) => {\n const divIcon = `<div class=\"loading-status\">${state.icon}</div>`\n const titleStatus = `<h1>${state.text}</h1>`\n\n ContentModalVpnState.html(divIcon + titleStatus)\n\n return divIcon + titleStatus\n }\n const showModalVpnState = () => {\n const data = JSON.parse(dtGetDefaultConfig())\n\n if (!data || !dtGetUsername() || !dtGetPassword()) {\n return\n } else {\n ModalVpnState.addClass(\"show\")\n }\n }\n const hiddenModalVpnState = () => {\n ModalVpnState.removeClass(\"show\")\n }\n\n const showModalLoading = () => {\n if (!JSON.parse(dtGetDefaultConfig())?.urlCheckUser) {\n hiddenModalVpnState()\n } else {\n hiddenModalVpnState()\n ModalLoading.addClass(\"show\")\n }\n }\n const hiddenModalLoading = () => {\n ModalLoading.removeClass(\"show\")\n }\n\n const writeModalCheckUser = (model) => {\n const data = JSON.parse(model)\n\n ContentModalCheckUser.html(`\n <h1>DETALHES DO USUÁRIO</h1>\n\n <div>\n <i class=\"bi bi-person\"></i>\n <span>Nome do usuário: ${data.username}</span>\n </div>\n\n <div>\n <i class=\"bi bi-calendar-week\"></i>\n <span>Expiração: ${data.expiration_date}</span>\n </div>\n\n <div>\n <i class=\"bi bi-hourglass-split\"></i>\n <span>Dias restantes: ${data.expiration_days}</span>\n </div>\n\n <div>\n <i class=\"bi bi-people\"></i>\n <span>Dispositivos: ${data.count_connections}|${data.limit_connections}</span>\n </div>\n `)\n\n showModalCheckUser()\n }\n const showModalCheckUser = () => {\n hiddenModalLoading()\n ModalCheckUser.addClass(\"show\")\n }\n const hiddenModalCheckUser = () => {\n ModalCheckUser.removeClass(\"show\")\n }\n\n const showModalAlertClearData = () => {\n ModalAlertClearData.addClass(\"show\")\n }\n const hiddenModalAlertClearData = () => {\n ModalAlertClearData.removeClass(\"show\")\n }\n\n const writeModalError = (model) => {\n const data = JSON.parse(model)\n\n const svg = `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-exclamation-triangle\" viewBox=\"0 0 16 16\"><path d=\"M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.146.146 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.163.163 0 0 1-.054.06.116.116 0 0 1-.066.017H1.146a.115.115 0 0 1-.066-.017.163.163 0 0 1-.054-.06.176.176 0 0 1 .002-.183L7.884 2.073a.147.147 0 0 1 .054-.057zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z\"/><path d=\"M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995z\"/></svg>`\n const h1 = `<h1 id=\"title-error-alert-title\">${data.title}</h1>`\n const p = `<p id=\"title-error-alert-description\">${data.content}</p>`\n\n ContentModalError.html(svg + h1 + p)\n hiddenModalSpeedtest()\n hiddenModalCarrierList()\n hiddenModalLogger()\n hiddenModalVpnState()\n hiddenModalLoading()\n hiddenModalCheckUser()\n\n showModalError()\n }\n const showModalError = () => {\n ModalError.addClass(\"show\")\n }\n const hiddenModalError = () => {\n ModalError.removeClass(\"show\")\n }\n\n const openBrowserIntoRenew = () => {\n dtStartWebView(\"https://t.me/terrorxdroidofc/\")\n }\n\n const getAppLogo = () => {\n const logo = dtAppLogo()\n\n if (!logo) {\n return false\n } else {\n return JSON.parse(logo).value\n }\n }\n </script>\n\n <!-- ESTADOS DE CONEXÃO -->\n <script>\n const disconnected = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-outlet\" viewBox=\"0 0 16 16\"><path d=\"M3.34 2.994c.275-.338.68-.494 1.074-.494h7.172c.393 0 .798.156 1.074.494.578.708 1.84 2.534 1.84 5.006 0 2.472-1.262 4.297-1.84 5.006-.276.338-.68.494-1.074.494H4.414c-.394 0-.799-.156-1.074-.494C2.762 12.297 1.5 10.472 1.5 8c0-2.472 1.262-4.297 1.84-5.006zm1.074.506a.376.376 0 0 0-.299.126C3.599 4.259 2.5 5.863 2.5 8c0 2.137 1.099 3.74 1.615 4.374.06.073.163.126.3.126h7.17c.137 0 .24-.053.3-.126.516-.633 1.615-2.237 1.615-4.374 0-2.137-1.099-3.74-1.615-4.374a.376.376 0 0 0-.3-.126h-7.17z\"/><path d=\"M6 5.5a.5.5 0 0 1 .5.5v1.5a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm4 0a.5.5 0 0 1 .5.5v1.5a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zM7 10v1h2v-1a1 1 0 0 0-2 0z\"/></svg>`,\n color: \"#FFFFFF\",\n text: dtTranslateText(\"LBL_STATE_DISCONNECTED\"),\n }\n\n return state\n }\n\n const connecting = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-plug\" viewBox=\"0 0 16 16\"><path d=\"M6 0a.5.5 0 0 1 .5.5V3h3V.5a.5.5 0 0 1 1 0V3h1a.5.5 0 0 1 .5.5v3A3.5 3.5 0 0 1 8.5 10c-.002.434-.01.845-.04 1.22-.041.514-.126 1.003-.317 1.424a2.083 2.083 0 0 1-.97 1.028C6.725 13.9 6.169 14 5.5 14c-.998 0-1.61.33-1.974.718A1.922 1.922 0 0 0 3 16H2c0-.616.232-1.367.797-1.968C3.374 13.42 4.261 13 5.5 13c.581 0 .962-.088 1.218-.219.241-.123.4-.3.514-.55.121-.266.193-.621.23-1.09.027-.34.035-.718.037-1.141A3.5 3.5 0 0 1 4 6.5v-3a.5.5 0 0 1 .5-.5h1V.5A.5.5 0 0 1 6 0zM5 4v2.5A2.5 2.5 0 0 0 7.5 9h1A2.5 2.5 0 0 0 11 6.5V4H5z\"/></svg>`,\n color: \"#FFFF00\",\n text: dtTranslateText(\"LBL_STATE_CONNECTING\"),\n }\n\n return state\n }\n\n const connected = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-plugin\" viewBox=\"0 0 16 16\"><path fill-rule=\"evenodd\" d=\"M1 8a7 7 0 1 1 2.898 5.673c-.167-.121-.216-.406-.002-.62l1.8-1.8a3.5 3.5 0 0 0 4.572-.328l1.414-1.415a.5.5 0 0 0 0-.707l-.707-.707 1.559-1.563a.5.5 0 1 0-.708-.706l-1.559 1.562-1.414-1.414 1.56-1.562a.5.5 0 1 0-.707-.706l-1.56 1.56-.707-.706a.5.5 0 0 0-.707 0L5.318 5.975a3.5 3.5 0 0 0-.328 4.571l-1.8 1.8c-.58.58-.62 1.6.121 2.137A8 8 0 1 0 0 8a.5.5 0 0 0 1 0Z\"/></svg>`,\n color: \"#00FF00\",\n text: dtTranslateText(\"LBL_STATE_CONNECTED\"),\n }\n\n return state\n }\n\n const stopping = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-stop\" viewBox=\"0 0 16 16\"><path d=\"M3.5 5A1.5 1.5 0 0 1 5 3.5h6A1.5 1.5 0 0 1 12.5 5v6a1.5 1.5 0 0 1-1.5 1.5H5A1.5 1.5 0 0 1 3.5 11V5zM5 4.5a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h6a.5.5 0 0 0 .5-.5V5a.5.5 0 0 0-.5-.5H5z\"/></svg>`,\n color: \"#FFFF00\",\n text: dtTranslateText(\"LBL_STATE_STOPPING\"),\n }\n\n return state\n }\n\n const noNetwork = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-wifi-off\" viewBox=\"0 0 16 16\"><path d=\"M10.706 3.294A12.545 12.545 0 0 0 8 3C5.259 3 2.723 3.882.663 5.379a.485.485 0 0 0-.048.736.518.518 0 0 0 .668.05A11.448 11.448 0 0 1 8 4c.63 0 1.249.05 1.852.148l.854-.854zM8 6c-1.905 0-3.68.56-5.166 1.526a.48.48 0 0 0-.063.745.525.525 0 0 0 .652.065 8.448 8.448 0 0 1 3.51-1.27L8 6zm2.596 1.404.785-.785c.63.24 1.227.545 1.785.907a.482.482 0 0 1 .063.745.525.525 0 0 1-.652.065 8.462 8.462 0 0 0-1.98-.932zM8 10l.933-.933a6.455 6.455 0 0 1 2.013.637c.285.145.326.524.1.75l-.015.015a.532.532 0 0 1-.611.09A5.478 5.478 0 0 0 8 10zm4.905-4.905.747-.747c.59.3 1.153.645 1.685 1.03a.485.485 0 0 1 .047.737.518.518 0 0 1-.668.05 11.493 11.493 0 0 0-1.811-1.07zM9.02 11.78c.238.14.236.464.04.66l-.707.706a.5.5 0 0 1-.707 0l-.707-.707c-.195-.195-.197-.518.04-.66A1.99 1.99 0 0 1 8 11.5c.374 0 .723.102 1.021.28zm4.355-9.905a.53.53 0 0 1 .75.75l-10.75 10.75a.53.53 0 0 1-.75-.75l10.75-10.75z\"/></svg>`,\n color: \"#FF0000\",\n text: dtTranslateText(\"LBL_STATE_NO_NETWORK\"),\n }\n\n return state\n }\n\n const auth = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-person-lock\" viewBox=\"0 0 16 16\"><path d=\"M11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM8 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm0 5.996V14H3s-1 0-1-1 1-4 6-4c.564 0 1.077.038 1.544.107a4.524 4.524 0 0 0-.803.918A10.46 10.46 0 0 0 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h5ZM9 13a1 1 0 0 1 1-1v-1a2 2 0 1 1 4 0v1a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1v-2Zm3-3a1 1 0 0 0-1 1v1h2v-1a1 1 0 0 0-1-1Z\"/></svg>`,\n color: \"#FFFF00\",\n text: dtTranslateText(\"LBL_STATE_AUTH\"),\n }\n\n return state\n }\n\n const authFailed = () => {\n const state = {\n icon: `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" class=\"bi bi-person-slash\" viewBox=\"0 0 16 16\"><path d=\"M13.879 10.414a2.501 2.501 0 0 0-3.465 3.465l3.465-3.465Zm.707.707-3.465 3.465a2.501 2.501 0 0 0 3.465-3.465Zm-4.56-1.096a3.5 3.5 0 1 1 4.949 4.95 3.5 3.5 0 0 1-4.95-4.95ZM11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM8 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm.256 7a4.474 4.474 0 0 1-.229-1.004H3c.001-.246.154-.986.832-1.664C4.484 10.68 5.711 10 8 10c.26 0 .507.009.74.025.226-.341.496-.65.804-.918C9.077 9.038 8.564 9 8 9c-5 0-6 3-6 4s1 1 1 1h5.256Z\"/></svg>`,\n color: \"#FF0000\",\n text: dtTranslateText(\"LBL_STATE_AUTH_FAILED\"),\n }\n\n return state\n }\n </script>\n\n <!-- DOM WRAPPER -->\n <script>\n const Dom = (selector) => {\n const _elements = document.querySelectorAll(selector)\n\n const wrapper = {\n on(listeners) {\n for (const [event, listener] of Object.entries(listeners)) {\n _elements.forEach((element) => {\n element.addEventListener(event, listener)\n })\n }\n\n return wrapper\n },\n addClass: (...tokens) => {\n _elements.forEach((element) => {\n element.classList.add(...tokens)\n })\n\n return wrapper\n },\n removeClass: (...tokens) => {\n _elements.forEach((element) => {\n element.classList.remove(...tokens)\n })\n\n return wrapper\n },\n toggleClass: (token, force) => {\n _elements.forEach((element) => {\n element.classList.toggle(token, force)\n })\n\n return wrapper\n },\n style(styles) {\n for (const [property, value] of Object.entries(styles)) {\n console.log(value)\n _elements.forEach((element) => {\n element.style[property] = value\n })\n }\n\n return wrapper\n },\n attr(attrs) {\n for (const [name, value] of Object.entries(attrs)) {\n _elements.forEach((element) => element.setAttribute(name, value))\n }\n\n return wrapper\n },\n html(value) {\n _elements.forEach((element) => (element.innerHTML = value))\n return wrapper\n },\n }\n\n return wrapper\n }\n </script>\n\n <!-- VÁRIAVEIS -->\n <script>\n const Main = Dom(\"main\")\n\n const AppLogo = Dom(\"#app-logo\")\n\n const ConfigMenu = Dom(\"#configuracao\")\n const ContainerConfigMenu = Dom(\"section.menu\")\n\n const BatteryOptimizationButton = Dom(\"#battery-optimization\")\n const ApnConfigurationButton = Dom(\"#apn-configuration\")\n const CheckuserButton = Dom(\"#checkuser\")\n const SpeedtestButton = Dom(\"#speedtest-button\")\n const ClearDataAppButton = Dom(\"#clean-data-app\")\n\n const BuyAccessButton = Dom(\"#buy-access\")\n\n const ModalSpeedtest = Dom(\"section.modal-speedtest\")\n const CloseModalSpeedtest = Dom(\"section.modal-speedtest header svg\")\n const LoadingSpeedtest = Dom(\n \"section.modal-speedtest section div.loading\"\n )\n const IframeSpeedtest = Dom(\"#iframe-speedtest\")\n\n const SelectCarrierButton = Dom(\"#operadora\")\n const ModalCarrierList = Dom(\"section.modal-configs\")\n const CloseModalCarrierList = Dom(\"section.modal-configs header svg\")\n const ModalContentCarrierList = Dom(\"section.modal-configs section\")\n\n const ContainerInputUser = Dom(\"#user-container\")\n const ContainerInputPassword = Dom(\"#password-container\")\n const ContainerInputUUID = Dom(\"#uuid-container\")\n\n const InputCarrierValue = Dom(\"#operadora input\")\n const InputUserValue = Dom(\"#user-container input\")\n const InputPasswordValue = Dom(\"#password-container input\")\n const InputUUIDValue = Dom(\"#uuid-container input\")\n\n const RefreshButton = Dom(\"#update-config\")\n const LoggerButton = Dom(\"#logs-button\")\n const StartStopVPNButton = Dom(\"#vpn-start\")\n\n const ContainerSVpnState = Dom(\"section.status-vpn\")\n const ContentContainerSVpnState = Dom(\"section.status-vpn section\")\n\n const ModalVpnState = Dom(\"section.modal-status-vpn\")\n const CloseModalVpnState = Dom(\"section.modal-status-vpn header svg\")\n const ContentModalVpnState = Dom(\n \"section.modal-status-vpn section.modal-status-content\"\n )\n\n const ModalLogger = Dom(\"section.modal-logs\")\n const CloseModalLogger = Dom(\"section.modal-logs header svg\")\n const ModalLoggerContent = Dom(\"section.modal-logs section p\")\n const CleanLoggerContent = Dom(\"section.modal-logs section button\")\n\n const ModalLoading = Dom(\"section.modal-loading\")\n const CloseModalLoading = Dom(\"section.modal-loading header svg\")\n\n const ModalCheckUser = Dom(\"section.modal-checkuser\")\n const CloseModalCheckUser = Dom(\"section.modal-checkuser header svg\")\n const ContentModalCheckUser = Dom(\"section.modal-checkuser section\")\n\n const ModalAlertClearData = Dom(\"section.modal-alert-clear-data\")\n const CloseModalAlertClearData = Dom(\n \"section.modal-alert-clear-data header svg\"\n )\n const BackModalAlertClearData = Dom(\"#back-clear-data-button\")\n const ConfirmModalAlertClearData = Dom(\"#clear-data-button-confirm\")\n\n const ModalError = Dom(\"section.modal-error-alert\")\n const CloseModalError = Dom(\"section.modal-error-alert header svg\")\n const ContentModalError = Dom(\"section.modal-error-alert section\")\n\n const HomeMenu = Dom(\"section.home-menu\")\n </script>\n\n <!-- VARIAVEIS ROOT -->\n <script>\n document.documentElement.style.setProperty(\n \"--margem-do-topo-do-modal\",\n `${dtStatusBarHeight() + 10}px`\n )\n\n document.documentElement.style.setProperty(\n \"--margem-do-bottom-do-modal\",\n `${dtNavbarHeight() + 10}px`\n )\n </script>\n\n <!-- AÇÕES -->\n <script>\n Main.style({ padding: `${dtStatusBarHeight() + 10}px 0px 0px 0px` })\n HomeMenu.style({ bottom: `${dtNavbarHeight() + 10}px` })\n\n AppLogo.attr({ src: getAppLogo() })\n\n ConfigMenu.on({ click: () => showConfigMenu() })\n\n BatteryOptimizationButton.on({ click: () => dtBatteryOptimization() })\n ApnConfigurationButton.on({ click: () => dtApnConfiguration() })\n\n SpeedtestButton.on({ click: () => showModalSpeedtest() })\n CloseModalSpeedtest.on({ click: () => hiddenModalSpeedtest() })\n\n SelectCarrierButton.on({ click: () => showModalCarrierList() })\n CloseModalCarrierList.on({ click: () => hiddenModalCarrierList() })\n\n InputUserValue.on({ input: (e) => dtSetUsername(e.target.value) })\n InputPasswordValue.on({ input: (e) => dtSetPassword(e.target.value) })\n InputUUIDValue.on({ input: (e) => dtSetUUID(e.target.value) })\n\n RefreshButton.on({ click: () => dtUpdate() })\n\n LoggerButton.on({ click: () => showModalLogger() })\n CloseModalLogger.on({ click: () => hiddenModalLogger() })\n CleanLoggerContent.on({ click: () => dtClearLogs() })\n\n StartStopVPNButton.on({ click: () => startStopVpn() })\n\n ContentContainerSVpnState.html(vpnState())\n\n ContentModalVpnState.html(vpnState())\n CloseModalVpnState.on({ click: () => hiddenModalVpnState() })\n\n CloseModalLoading.on({ click: () => hiddenModalLoading() })\n\n CloseModalCheckUser.on({ click: () => hiddenModalCheckUser() })\n\n CheckuserButton.on({ click: () => dtStartCheckUser() })\n\n ClearDataAppButton.on({ click: () => showModalAlertClearData() })\n CloseModalAlertClearData.on({ click: () => hiddenModalAlertClearData() })\n BackModalAlertClearData.on({ click: () => hiddenModalAlertClearData() })\n ConfirmModalAlertClearData.on({ click: () => dtCleanDataApp() })\n\n CloseModalError.on({ click: () => hiddenModalError() })\n\n BuyAccessButton.on({ click: () => openBrowserIntoRenew() })\n\n writeInputCarrierList()\n </script>\n </body>\n</html>\n",
  345. "type": "HTML",
  346. "status": "ACTIVE",
  347. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  348. },
  349. {
  350. "id": 22200,
  351. "label": "ANDROID WEBVIEW (POR SUA CONTA E RISCO)",
  352. "name": "APP_SUPPORT_BUTTON",
  353. "value": null,
  354. "type": "HTML",
  355. "status": "ACTIVE",
  356. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  357. },
  358. {
  359. "id": 22201,
  360. "label": "PAGINA WEBVIEW (POR SUA CONTA E RISCO)",
  361. "name": "APP_WEB_VIEW",
  362. "value": null,
  363. "type": "HTML",
  364. "status": "ACTIVE",
  365. "user_id": "d37036c7-833d-4246-8b45-c0ce6e8daaa2"
  366. }
  367. ]

comments powered by Disqus