Plugin Directory

Changeset 3187716


Ignore:
Timestamp:
11/13/2024 02:28:58 PM (14 months ago)
Author:
kaisarahmmed
Message:

update brevo

Location:
formico
Files:
168 added
12 deleted
21 edited

Legend:

Unmodified
Added
Removed
  • formico/trunk/assets/css/formico_admin.css

    r3093701 r3187716  
    1 .formico__container {
    2     width: 100%;
    3 }
    4 
    5 #formico_settings_form {
    6     padding: 40px 40px 0 20px;
    7 }
    8 
    9 .formico_tab_wrapper_group {
     1:root {
     2    --formico-color-primary: rgba(92, 49, 254, 1);
     3    --formico-color-background: rgba(92, 49, 254, .06);
     4    --formico-color-text: #232323;
     5}
     6
     7@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,100&display=swap');
     8
     9.toplevel_page_formico #wpcontent,
     10.formico_page_formico_settings #wpcontent {
     11    padding-left: 0;
     12    background-color: #F5F6FD;
     13}
     14
     15.formico__dashboard {
     16    font-family: "Poppins", sans-serif;
     17    font-size: 14px;
     18    font-weight: 400;
     19    line-height: 1.5;
     20    color: #232323;
     21    min-height: 100vh;
     22}
     23
     24.formico__dashboard a {
     25    text-decoration: none;
     26    outline: none;
     27    box-shadow: none;
     28}
     29
     30.formico__dashboard h1,
     31.formico__dashboard h2,
     32.formico__dashboard h3,
     33.formico__dashboard h4,
     34.formico__dashboard h5,
     35.formico__dashboard h6 {
     36    margin: 0 0 15px;
     37}
     38
     39/* Header */
     40
     41.formico_header {
     42    background-color: #fff;
     43    border-bottom: 1px solid rgba(92, 49, 254, .1);
     44}
     45
     46.formico_logo h1 {
     47    margin: 0;
     48}
     49
     50.formico__header_wrap {
    1051    display: grid;
    11     grid-template-columns: repeat(12, 1fr);
    12     position: relative;
    13 }
    14 
    15 .formico_tabs_wrap {
    16     grid-column: span 3;
    17 }
    18 
    19 .formico_tabs_content_wrap {
    20     grid-column: span 9;
     52    grid-template-columns: 250px auto 250px;
     53    padding: 20px 30px;
     54    gap: 30px;
     55    align-items: center;
     56    width: 1160px;
     57    margin: 0 auto;
     58}
     59
     60.formico_logo img {
     61    height: auto;
     62    width: 140px;
     63}
     64
     65.formico_logo {
     66    display: flex;
     67}
     68
     69.formico_buttons {
     70    display: flex;
     71    justify-content: right;
     72}
     73
     74.btn {
     75    font-size: 15px;
     76    color: #fff;
     77    background: var(--formico-color-primary);
     78    padding: 10px 20px 10px 26px;
     79    border-radius: 5px;
     80    transition: 0.3s;
     81}
     82
     83.btn:hover {
     84    color: #fff;
     85    box-shadow: rgba(92, 49, 249, .3) 0px 7px 20px 0px;
     86}
     87
     88.formico__submit_button {
     89    margin-top: 20px;
     90    grid-column: 1;
     91}
     92
     93.formico__submit_button .btn {
     94    outline: none;
     95    border: none;
     96    cursor: pointer;
     97    display: flex;
     98    align-items: center;
     99    gap: 6px;
     100}
     101
     102@keyframes fbtn_spin {
     103    0% {
     104        transform: rotate(0deg);
     105    }
     106
     107    100% {
     108        transform: rotate(360deg);
     109    }
     110}
     111
     112.formico__spin.active {
     113    display: inline-block;
     114    height: 12px;
     115    width: 12px;
     116    border: 2px solid rgba(255, 255, 255, .5);
     117    border-radius: 50%;
     118    border-bottom-color: #fff;
     119    transform: rotate(45deg);
     120    animation: fbtn_spin 1s ease infinite;
     121}
     122
     123.formico__tab_section h2 {
     124    font-weight: 500;
     125    font-size: 20px;
     126    line-height: 24px;
     127}
     128
     129.formico__addons_items {
     130    display: grid;
     131    grid-template-columns: repeat(3, 1fr);
     132    gap: 15px;
     133}
     134
     135.formico__addon_item {
    21136    background: #fff;
    22137    border-radius: 8px;
    23     padding: 30px;
    24     min-height: 500px;
    25 }
    26 
    27 .formico_data_saved {
    28     position: absolute;
    29     right: -30px;
    30     display: flex;
    31     background: #fff;
    32     border-radius: 5px;
    33     padding: 10px;
    34     color: rgba(0, 119, 255, 1);
    35     align-items: center;
    36     justify-content: center;
    37     gap: 4px;
    38     font-size: 14px;
    39     font-weight: 500;
    40     top: 90px;
    41     box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
     138    padding: 16px;
     139    border: 1px solid rgba(92, 49, 254, .2);
     140    transition: 0.3s;
     141}
     142
     143.formico__addon_item:hover {
     144    border-color: rgba(92, 49, 254, .4);
     145    box-shadow: 0 7px 24px 0 var(--formico-color-background);
     146}
     147
     148.formico_addon_name {
     149    font-size: 15px;
     150    font-weight: 400;
     151    margin: 0;
     152    line-height: 18px;
     153}
     154
     155.formico__input_switch input[type=checkbox] {
    42156    opacity: 0;
    43157    visibility: hidden;
     158    position: absolute;
     159    z-index: -999;
     160}
     161
     162.formico__input_switch label {
     163    height: 20px;
     164    width: 40px;
     165    background: #EBECF0;
     166    display: block;
     167    border-radius: 30px;
     168    position: relative;
    44169    transition: 0.3s;
    45     border: 1px solid rgba(0, 119, 255, 1);
    46 }
    47 
    48 .formico_data_saved svg {
    49     width: 18px;
    50 }
    51 
    52 .formico_data_saved.active {
    53     opacity: 1;
    54     visibility: visible;
    55     right: 30px;
    56 }
    57 
    58 .formico_user_setting:not(:last-child) {
    59     margin-bottom: 35px;
    60 }
    61 
    62 .formico_tab_nav ul li a {
    63     text-decoration: none;
    64     padding: 23px 25px 23px 40px;
    65     display: flex;
    66     outline: none;
     170    cursor: pointer;
     171}
     172
     173.formico__addon_head {
     174    display: flex;
    67175    justify-content: space-between;
    68     align-items: center;
    69 }
    70 
    71 .formico_tab_nav ul li h4 {
    72     font-size: 14px;
    73     text-transform: uppercase;
    74     margin: 0;
    75     color: #000;
    76     transition: 0.3s;
    77 }
    78 
    79 .formico_tab_nav ul li p {
    80     font-size: 13px;
    81     margin: 0;
    82     color: #72777D;
    83 }
    84 
    85 .formico_tab_nav ul li {
    86     margin: 0;
    87     position: relative;
    88     z-index: 1;
    89     transition: 0.3s;
    90 }
    91 
    92 .formico_tab_nav ul li a:focus {
    93     box-shadow: none;
    94 }
    95 
    96 .formico_tab_nav ul li.tabscroll_activeNavi {
    97     background: #fff;
    98     border-radius: 8px 0 0 8px;
    99 }
    100 
    101 .formico_tab_nav ul li.tabscroll_activeNavi h4 {
    102     color: #0077FF;
    103 }
    104 
    105 .formico_tab_nav ul li:hover h4 {
    106     color: #0077FF;
    107 }
    108 
    109 .formico_tab_nav ul li:before {
     176}
     177
     178.formico__input_switch label:before {
    110179    position: absolute;
    111180    content: '';
    112     height: 10px;
    113     width: 10px;
    114     background: #0077FF;
     181    height: 14px;
     182    width: 14px;
     183    background: #fff;
     184    border-radius: 50%;
     185    -webkit-transition: ease-in-out .35s;
     186    transition: ease-in-out .35s;
     187    transform: translate(3px, 3px);
     188}
     189
     190.formico__input_switch input:checked+label:before {
     191    transform: translate(23px, 3px);
     192}
     193
     194.formico__input_switch input:checked+label {
     195    background: var(--formico-color-primary);
     196}
     197
     198.formico__addon_footer {
     199    display: flex;
     200    justify-content: space-between;
     201    align-items: center;
     202}
     203
     204.addon_info {
     205    display: flex;
     206    gap: 6px;
     207    align-items: center;
     208}
     209
     210.addon_info svg {
     211    height: 17px;
     212}
     213
     214.addon_info a {
     215    display: flex;
     216}
     217
     218.addon_status {
     219    font-size: 12px;
     220    text-transform: uppercase;
     221    font-weight: 400;
     222    line-height: 13px;
     223    padding: 2px 4px;
     224    border-radius: 5px;
     225}
     226
     227.addon_status.new {
     228    background: #11B76A;
     229    color: #fff;
     230}
     231
     232.formcio__section_wrapper {
     233    display: grid;
     234    grid-template-columns: 280px auto;
     235    gap: 20px;
     236    width: 1160px;
     237    margin: 40px auto;
     238}
     239
     240.formico__menu_warp {
     241    background: rgba(92, 49, 254, .02);
     242    border-radius: 8px;
     243    border: 1px solid rgba(92, 49, 254, .04);
     244}
     245
     246ul.formico__menu_items {
     247    margin: 0;
     248    display: flex;
     249    flex-direction: column;
     250    gap: 8px;
     251    padding: 15px;
     252}
     253
     254.formico__menu_items li {
     255    margin: 0;
     256}
     257
     258
     259.formico__menu_items li a {
     260    display: flex;
     261    background-color: transparent;
     262    color: var(--formico-color-text);
     263    gap: 8px;
     264    font-size: 15px;
     265    align-items: center;
     266    padding: 10px;
     267}
     268
     269.formico__menu_items li a svg {
     270    height: 20px;
     271}
     272
     273.formico__menu_items li.active a,
     274.formico__menu_items li a:hover {
     275    background-color: var(--formico-color-background);
     276    border-radius: 6px;
     277    color: var(--formico-color-primary);
     278}
     279
     280.formcio__section_wrapper .single_settings {
     281    background: #fff;
     282    height: 100%;
     283    border-radius: 8px;
     284    padding: 20px;
     285    border: 1px solid #f2f4f7;
     286}
     287
     288.single_settings h3 {
     289    font-size: 18px;
     290    font-weight: 500;
     291    line-height: 20px;
     292    border-bottom: 1px solid #f2f4f7;
     293    padding-bottom: 12px;
     294}
     295
     296span.addon_status.updated {
     297    background: #FFAD4D;
     298    color: #fff;
     299}
     300
     301.formico__setting_panel {
     302    background: #fff;
     303    border-radius: 8px;
    115304    transition: 0.3s;
    116     left: 16px;
    117     border-radius: 50%;
    118     top: 50%;
    119     transform: translateY(-50%);
     305}
     306
     307.formico__setting_panel:hover {
     308    border-color: rgba(92, 49, 254, .4);
     309    box-shadow: 0 7px 24px 0 var(--formico-color-background);
     310}
     311
     312.formico__setting_panel .formico__section_title {
     313    padding: 12px 18px;
     314    border-bottom: 1px solid rgba(92, 49, 254, .1);
     315    font-size: 15px;
     316    font-weight: 500;
     317    margin: 0;
     318    color: #333333;
     319    letter-spacing: .2px;
     320}
     321
     322.formico__setting_content_panel {
     323    padding: 16px;
     324    display: grid;
     325    grid-template-columns: 1fr;
     326    gap: 20px;
     327}
     328
     329.formico_setting_field_header {
     330    display: block;
     331    margin-bottom: 5px;
     332}
     333
     334.formico__setting_content_panel select,
     335.formico__setting_content_panel input[type=text],
     336.formico__setting_content_panel input[type=number] {
     337    border: 1px solid #b1b1b1;
     338    font-size: 14px;
     339    color: #333;
     340    border-radius: 3px;
     341    height: 44px;
     342    padding: 6px 15px;
     343    transition: 0.3s;
     344    box-shadow: none;
     345    width: 100%;
     346    max-width: 100%;
     347}
     348
     349.formico__setting_content_panel select:focus,
     350.formico__setting_content_panel input[type=number]:focus,
     351.formico_setting_field_container input[type=text]:focus,
     352.formico__setting_content_panel select:hover,
     353.formico__setting_content_panel input[type=text]:hover,
     354.formico__setting_content_panel input[type=number]:hover {
     355    color: var(--formico-color-text);
     356    box-shadow: none;
     357    border-color: var(--formico-color-primary);
     358}
     359
     360.formico_setting_field_container {
     361    display: block;
     362    width: 100%;
     363    margin-top: 5px;
     364}
     365
     366.formico_setting_field_description {
     367    font-size: 13px;
     368    color: #606266;
     369}
     370
     371form.formico__settings_form {
     372    display: grid;
     373    grid-template-columns: 1fr 1fr;
     374    gap: 16px;
     375}
     376
     377.formico_setting_field_header label {
     378    font-size: 14px;
     379    display: flex;
     380    align-items: center;
     381    gap: 6px;
     382    color: #222222;
     383}
     384
     385.formico__settings_panel_full {
     386    grid-column: span 2;
     387}
     388
     389.formico_input_feedback_success input[type=text] {
     390    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgY2xhc3M9Im5jLWljb24td3JhcHBlciI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAyNmM3LjE4IDAgMTMtNS44MiAxMy0xM1MyMC4xOCAwIDEzIDAgMCA1LjgyIDAgMTNzNS44MiAxMyAxMyAxM3oiIGZpbGw9IiMyMkE3NTMiLz48cGF0aCBkPSJtMTEgMTQuNTg2IDYuMjkzLTYuMjkzYTEgMSAwIDEgMSAxLjQxNCAxLjQxNEwxMSAxNy40MTRsLTMuNzA3LTMuNzA3YTEgMSAwIDEgMSAxLjQxNC0xLjQxNEwxMSAxNC41ODZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==);
     391}
     392
     393.formico_input_feedback_failed input[type=text] {
     394    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgY2xhc3M9Im5jLWljb24td3JhcHBlciI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAyNmM3LjE4IDAgMTMtNS44MiAxMy0xM1MyMC4xOCAwIDEzIDAgMCA1LjgyIDAgMTNzNS44MiAxMyAxMyAxM3oiIGZpbGw9IiNDQjI0MzEiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTguMTgzIDguMTgzYS42MjUuNjI1IDAgMCAwIDAgLjg4NEwxMi4xMTYgMTNsLTMuOTMzIDMuOTMzYS42MjUuNjI1IDAgMSAwIC44ODQuODg0TDEzIDEzLjg4NGwzLjkzMyAzLjkzM2EuNjI1LjYyNSAwIDEgMCAuODg0LS44ODRMMTMuODg0IDEzbDMuOTMzLTMuOTMzYS42MjUuNjI1IDAgMSAwLS44ODQtLjg4NEwxMyAxMi4xMTYgOS4wNjcgOC4xODNhLjYyNS42MjUgMCAwIDAtLjg4NCAweiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Im04LjE4MyA5LjA2Ny0uMzUzLjM1NC4zNTMtLjM1NHptMC0uODg0TDcuODMgNy44M2wuMzUzLjM1M3pNMTIuMTE2IDEzbC4zNTQuMzU0LjM1My0uMzU0LS4zNTMtLjM1NC0uMzU0LjM1NHptLTMuOTMzIDMuOTMzLS4zNTMtLjM1NC4zNTMuMzU0em0wIC44ODQtLjM1My4zNTQuMzUzLS4zNTR6TTEzIDEzLjg4NGwuMzU0LS4zNTQtLjM1NC0uMzUzLS4zNTQuMzUzLjM1NC4zNTR6bTMuOTMzIDMuOTMzLjM1NC0uMzU0LS4zNTQuMzU0em0uODg0LS44ODQtLjM1NC4zNTQuMzU0LS4zNTR6TTEzLjg4NCAxM2wtLjM1NC0uMzU0LS4zNTMuMzU0LjM1My4zNTQuMzU0LS4zNTR6bTMuOTMzLTQuODE3LjM1NC0uMzUzLS4zNTQuMzUzem0tLjg4NCAwLS4zNTQtLjM1My4zNTQuMzUzek0xMyAxMi4xMTZsLS4zNTQuMzU0LjM1NC4zNTMuMzU0LS4zNTMtLjM1NC0uMzU0ek05LjA2NyA4LjE4M2wuMzU0LS4zNTMtLjM1NC4zNTN6bS0uNTMuNTNhLjEyNS4xMjUgMCAwIDEgMC0uMTc2bC0uNzA4LS43MDhhMS4xMjcgMS4xMjcgMCAwIDAgMCAxLjU5MmwuNzA4LS43MDh6bTMuOTMzIDMuOTMzTDguNTM3IDguNzEzbC0uNzA4LjcwOCAzLjkzNCAzLjkzMy43MDctLjcwOHptLTMuOTMzIDQuNjQgMy45MzMtMy45MzItLjcwNy0uNzA4TDcuODMgMTYuNThsLjcwNy43MDh6bTAgLjE3N2EuMTI1LjEyNSAwIDAgMSAwLS4xNzZsLS43MDgtLjcwN2ExLjEyNCAxLjEyNCAwIDAgMCAwIDEuNTlsLjcwOC0uNzA3em0uMTc2IDBhLjEyNS4xMjUgMCAwIDEtLjE3NiAwbC0uNzA4LjcwN2MuNDQuNDQgMS4xNTIuNDQgMS41OTIgMGwtLjcwOC0uNzA3em0zLjkzMy0zLjkzMy0zLjkzMyAzLjkzMy43MDguNzA3IDMuOTMzLTMuOTMzLS43MDgtLjcwN3ptNC42NCAzLjkzMy0zLjkzMi0zLjkzMy0uNzA4LjcwNyAzLjkzMyAzLjkzNC43MDgtLjcwOHptLjE3NyAwYS4xMjUuMTI1IDAgMCAxLS4xNzYgMGwtLjcwNy43MDdjLjQzOS40NCAxLjE1MS40NCAxLjU5IDBsLS43MDctLjcwN3ptMC0uMTc2YS4xMjUuMTI1IDAgMCAxIDAgLjE3NmwuNzA3LjcwN2MuNDQtLjQzOS40NC0xLjE1MSAwLTEuNTlsLS43MDcuNzA3em0tMy45MzMtMy45MzMgMy45MzMgMy45MzMuNzA3LS43MDctMy45MzMtMy45MzQtLjcwNy43MDh6bTMuOTMzLTQuNjQtMy45MzMgMy45MzIuNzA3LjcwOCAzLjkzNC0zLjkzMy0uNzA4LS43MDh6bTAtLjE3N2EuMTI1LjEyNSAwIDAgMSAwIC4xNzZsLjcwNy43MDhjLjQ0LS40NC40NC0xLjE1MiAwLTEuNTkxbC0uNzA3LjcwN3ptLS4xNzYgMGEuMTI1LjEyNSAwIDAgMSAuMTc2IDBsLjcwNy0uNzA4YTEuMTI1IDEuMTI1IDAgMCAwLTEuNTkgMGwuNzA3LjcwOHptLTMuOTMzIDMuOTMzIDMuOTMzLTMuOTMzLS43MDctLjcwOC0zLjkzNCAzLjkzNC43MDguNzA3em0tNC42NC0zLjkzMyAzLjkzMiAzLjkzMy43MDgtLjcwN0w5LjQyIDcuODNsLS43MDguNzA3em0tLjE3NyAwYS4xMjUuMTI1IDAgMCAxIC4xNzYgMGwuNzA4LS43MDhhMS4xMjUgMS4xMjUgMCAwIDAtMS41OTEgMGwuNzA3LjcwOHoiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+);
     395}
     396
     397.formico_input_feedback_success input[type=text],
     398.formico_input_feedback_failed input[type=text] {
     399    background-position: 98.5% 50%;
     400    background-repeat: no-repeat;
     401    background-size: 1.25rem;
     402    padding-right: 3.25rem;
     403}
     404
     405.formico__setting_field_switch input[type=checkbox] {
     406    position: absolute;
     407    z-index: -999;
     408    visibility: hidden;
    120409    opacity: 0;
    121410}
    122411
    123 .formico_tab_nav ul li.tabscroll_activeNavi:before {
    124     opacity: 1;
    125 }
    126 
    127 .formico_logo img {
    128     max-width: 250px;
    129     margin-bottom: 12px;
    130 }
    131 
    132 .formico_admin_header_section .formico_section_title {
    133     margin: 0;
    134     font-size: 25px;
    135     color: #0077FF;
    136 }
    137 
    138 .formico_admin_header_section {
    139     display: flex;
    140     justify-content: space-between;
    141     align-items: center;
    142     margin-bottom: 20px;
    143     padding-bottom: 20px;
    144     border-bottom: 1px solid #E0E4EA;
    145 }
    146 
    147 button.formico_save_form_data {
    148     background: #0077FF;
     412.formico__setting_field_switch label {
     413    padding-left: 46px;
     414    position: relative;
     415    cursor: pointer;
    149416    font-size: 14px;
    150     text-transform: uppercase;
    151     color: #fff;
    152     border: 1px solid #0077FF;
    153     padding: 14px 25px;
    154     font-weight: 600;
    155     letter-spacing: 1px;
    156     border-radius: 50px;
     417    display: inline-flex;
     418    gap: 5px;
     419    align-items: center;
     420}
     421
     422.formico__setting_field_switch label:before {
     423    position: absolute;
     424    content: '';
     425    height: 20px;
     426    width: 40px;
     427    background: #EBECF0;
     428    display: block;
     429    border-radius: 30px;
    157430    transition: 0.3s;
    158431    cursor: pointer;
    159 }
    160 
    161 button.formico_save_form_data:hover {
    162     box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    163     background: #005ac1;
    164 }
    165 
    166 .formico__fields {
    167     display: grid;
    168     grid-template-columns: repeat(12, 1fr);
    169     gap: 20px;
    170 }
    171 
    172 .formico_input__switch {
    173     grid-column: span 4;
    174 }
    175 
    176 .formico_input__switch input[type=checkbox] {
     432    top: 0;
     433    left: 0;
     434}
     435
     436.formico__setting_field_switch label:after {
    177437    position: absolute;
     438    content: '';
     439    height: 14px;
     440    width: 14px;
     441    background: #fff;
     442    border-radius: 50%;
     443    -webkit-transition: ease-in-out .35s;
     444    transition: ease-in-out .35s;
     445    left: 3px;
     446    top: 3px;
     447}
     448
     449.formico__setting_field_switch input:checked+label:before {
     450    background: rgba(92, 49, 254);
     451}
     452
     453.formico__setting_field_switch input:checked+label:after {
     454    left: 23px;
     455}
     456
     457.formico__saved_notification {
     458    position: fixed;
     459    bottom: 45px;
     460    right: 45px;
     461    width: 400px;
    178462    opacity: 0;
    179463    visibility: hidden;
     
    181465}
    182466
    183 .formico_input__switch label {
    184     border: 1px solid #f3f3f3;
     467.formico__saved_notification.open {
     468    visibility: visible;
     469    opacity: 1;
     470    z-index: 999;
     471}
     472
     473.formico__notification_content {
     474    background: #fff;
     475    display: flex;
     476    align-items: center;
     477    padding: 18px 16px 20px;
     478    border-radius: 4px;
     479    gap: 8px;
     480    -webkit-box-shadow: 0 20px 36px 0 #00012314;
     481    box-shadow: 0 20px 36px #00012314;
     482    position: relative;
     483    overflow: hidden;
     484}
     485
     486.formico__notification_content svg {
     487    width: 22px;
     488    fill: #52cb98;
     489}
     490
     491.formico__notification_content p {
     492    margin: 0;
     493    font-size: 15px;
     494}
     495
     496.formico__notification_content:after {
     497    content: "";
     498    position: absolute;
     499    bottom: 0;
     500    left: 0;
     501    width: 100%;
     502    height: 3px;
     503    border-radius: 0 0 4px 4px;
     504    background-color: #52cb98;
     505}
     506
     507.formico__notification_content.formico__success svg {
     508    fill: #52cb98;
     509}
     510
     511.formico__notification_content.formico__warning svg {
     512    fill: #ffb545;
     513}
     514
     515.formico__notification_content.formico__error svg {
     516    fill: #CB2431;
     517}
     518
     519.formico__notification_content.formico__error:after {
     520    background-color: #CB2431;
     521}
     522
     523.formico__hero_wrap {
     524    background: linear-gradient(89.99deg, #fff 30%, rgba(92, 49, 254, .1) 115%);
     525    border-radius: 8px;
     526    display: grid;
     527    grid-template-columns: auto 340px;
     528    align-items: center;
     529    gap: 20px;
     530    margin-bottom: 20px;
     531}
     532
     533.formico__hero_wrap .addons_warp {
     534    display: grid;
     535    grid-template-columns: repeat(3, 1fr);
     536    gap: 10px;
     537}
     538
     539.addons_warp .addons {
     540    background: var(--formico-color-background);
     541    color: var(--formico-color-text);
     542    padding: 12px;
    185543    border-radius: 5px;
    186     padding: 15px 70px 15px 22px;
     544    font-size: 14px;
     545    line-height: 14px;
     546}
     547
     548.addons_warp .addons .addons_num {
     549    font-size: 24px;
     550    font-weight: 600;
    187551    display: block;
    188     background: #F9f9f9;
     552    color: var(--formico-color-primary);
     553    line-height: 25px;
     554    margin-bottom: 4px;
     555}
     556
     557.formico__hero_wrap .hero_title {
     558    font-size: 30px;
     559    line-height: 40px;
     560    margin-bottom: 30px;
     561}
     562
     563.formico__hero_wrap .hero_title span {
     564    color: var(--formico-color-primary);
     565}
     566
     567.formico__hero_wrap .hero_content {
     568    padding: 25px;
     569}
     570
     571.formico__connect_content {
     572    display: grid;
     573    grid-template-columns: repeat(4, 1fr);
     574    gap: 20px;
     575}
     576
     577.formico__connect_content .connect_others {
     578    background: #fff;
     579    border-radius: 8px;
     580    padding: 20px;
     581}
     582
     583.formico__connect_content .connect_others .icon {
     584    margin-bottom: 15px;
     585    width: 24px;
     586    background: var(--formico-color-background);
     587    display: flex;
     588    justify-content: center;
     589    align-items: center;
     590    border-radius: 8px;
     591    padding: 10px;
     592}
     593
     594.connect_others .icon svg {
     595    color: var(--formico-color-primary);
     596}
     597
     598.connect_others h4 {
     599    font-size: 14px;
     600    font-weight: 600;
     601    margin-bottom: 12px;
     602}
     603
     604.connect_others p {
     605    margin: 0;
     606    font-size: 13px;
     607    line-height: 20px;
     608}
     609
     610.formico__connect_content .connect_others a {
     611    color: var(--formico-color-primary);
     612    text-decoration: underline;
     613    display: inline-block;
     614    margin-top: 5px;
     615    font-size: 14px;
     616}
     617
     618.formico__support_wrapper {
     619    display: grid;
     620    grid-template-columns: repeat(3, 1fr);
     621    gap: 20px;
     622}
     623
     624.formico__support_wrapper .support_box {
     625    background: #fff;
     626    border-radius: 8px;
     627    padding: 20px;
     628}
     629
     630.support_box .icon_box {
     631    height: 60px;
     632    display: flex;
     633    background: var(--formico-color-background);
     634    width: 60px;
     635    align-items: center;
     636    justify-content: center;
     637    border-radius: 8px;
     638    margin-bottom: 12px;
     639}
     640
     641.support_box .icon_box svg {
     642    height: 34px;
     643    color: var(--formico-color-primary);
     644}
     645
     646.support_box h3 {
     647    font-size: 18px;
     648    font-weight: 500;
     649    margin: 22px 0px 20px;
     650    line-height: 18px;
     651}
     652
     653.support_box p {
     654    margin: 0 0 15px;
     655}
     656
     657.support_box a {
     658    color: var(--formico-color-primary);
     659    font-size: 15px;
     660}
     661
     662.formico_setting_field_header label .formico_tooltips_text,
     663.formico__setting_field_switch label .formico_tooltips_text {
     664    position: absolute;
     665    max-width: 250px;
     666    width: max-content;
     667    top: -41px;
     668    padding: 10px;
     669    background: #555;
     670    font-size: 12px;
     671    border-radius: 3px;
     672    line-height: 13px;
     673    left: 50%;
     674    transform: translateX(-50%);
     675    z-index: 99;
     676    color: #fff;
     677    transition: 0.3s;
     678    visibility: hidden;
     679    opacity: 0;
     680    letter-spacing: .3px;
     681}
     682
     683.formico_setting_field_description a {
     684    color: var(--formico-color-primary);
     685}
     686
     687.formico__setting_field_switch .formico_setting_field_tooltips {
     688    height: 18px;
     689    display: inline-block;
     690    position: relative;
     691}
     692
     693.formico_setting_field_header label .formico_setting_field_tooltips {
     694    display: flex;
    189695    position: relative;
    190696    transition: 0.3s;
    191 }
    192 
    193 .formico_input__switch label .formico_field__name {
    194     display: inline-block;
    195     font-size: 15px;
    196     font-weight: 500;
    197     color: #000;
    198     margin-bottom: 2px;
     697    cursor: pointer;
     698}
     699
     700.formico_tooltips_text:before {
     701    position: absolute;
     702    content: '';
     703    height: 12px;
     704    width: 12px;
     705    background: #555;
     706    left: 50%;
     707    transform: translateX(-50%) rotate(45deg);
     708    bottom: -4px;
     709    border-radius: 2px;
     710}
     711
     712.formico_setting_field_header label .formico_setting_field_tooltips:hover .formico_tooltips_text,
     713.formico__setting_field_switch label .formico_setting_field_tooltips:hover .formico_tooltips_text {
     714    opacity: 1;
     715    visibility: visible;
     716}
     717
     718
     719/* Api connection validation */
     720
     721.formico_api_validation {
     722    display: flex;
     723    align-items: center;
     724    justify-content: space-between;
     725    margin-top: 15px;
     726}
     727
     728.formico_validation_message {
     729    font-size: 14px;
     730    margin: 0;
     731    background-repeat: no-repeat;
     732    padding: 5px 0 5px 30px;
     733    background-position: 0 center;
     734    background-size: 1.25rem;
     735}
     736
     737
     738.formico_input_feedback_success .formico_validation_message {
     739    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgY2xhc3M9Im5jLWljb24td3JhcHBlciI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAyNmM3LjE4IDAgMTMtNS44MiAxMy0xM1MyMC4xOCAwIDEzIDAgMCA1LjgyIDAgMTNzNS44MiAxMyAxMyAxM3oiIGZpbGw9IiMyMkE3NTMiLz48cGF0aCBkPSJtMTEgMTQuNTg2IDYuMjkzLTYuMjkzYTEgMSAwIDEgMSAxLjQxNCAxLjQxNEwxMSAxNy40MTRsLTMuNzA3LTMuNzA3YTEgMSAwIDEgMSAxLjQxNC0xLjQxNEwxMSAxNC41ODZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==);
     740}
     741
     742.formico_input_feedback_failed .formico_validation_message {
     743    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgY2xhc3M9Im5jLWljb24td3JhcHBlciI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAyNmM3LjE4IDAgMTMtNS44MiAxMy0xM1MyMC4xOCAwIDEzIDAgMCA1LjgyIDAgMTNzNS44MiAxMyAxMyAxM3oiIGZpbGw9IiNDQjI0MzEiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTguMTgzIDguMTgzYS42MjUuNjI1IDAgMCAwIDAgLjg4NEwxMi4xMTYgMTNsLTMuOTMzIDMuOTMzYS42MjUuNjI1IDAgMSAwIC44ODQuODg0TDEzIDEzLjg4NGwzLjkzMyAzLjkzM2EuNjI1LjYyNSAwIDEgMCAuODg0LS44ODRMMTMuODg0IDEzbDMuOTMzLTMuOTMzYS42MjUuNjI1IDAgMSAwLS44ODQtLjg4NEwxMyAxMi4xMTYgOS4wNjcgOC4xODNhLjYyNS42MjUgMCAwIDAtLjg4NCAweiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Im04LjE4MyA5LjA2Ny0uMzUzLjM1NC4zNTMtLjM1NHptMC0uODg0TDcuODMgNy44M2wuMzUzLjM1M3pNMTIuMTE2IDEzbC4zNTQuMzU0LjM1My0uMzU0LS4zNTMtLjM1NC0uMzU0LjM1NHptLTMuOTMzIDMuOTMzLS4zNTMtLjM1NC4zNTMuMzU0em0wIC44ODQtLjM1My4zNTQuMzUzLS4zNTR6TTEzIDEzLjg4NGwuMzU0LS4zNTQtLjM1NC0uMzUzLS4zNTQuMzUzLjM1NC4zNTR6bTMuOTMzIDMuOTMzLjM1NC0uMzU0LS4zNTQuMzU0em0uODg0LS44ODQtLjM1NC4zNTQuMzU0LS4zNTR6TTEzLjg4NCAxM2wtLjM1NC0uMzU0LS4zNTMuMzU0LjM1My4zNTQuMzU0LS4zNTR6bTMuOTMzLTQuODE3LjM1NC0uMzUzLS4zNTQuMzUzem0tLjg4NCAwLS4zNTQtLjM1My4zNTQuMzUzek0xMyAxMi4xMTZsLS4zNTQuMzU0LjM1NC4zNTMuMzU0LS4zNTMtLjM1NC0uMzU0ek05LjA2NyA4LjE4M2wuMzU0LS4zNTMtLjM1NC4zNTN6bS0uNTMuNTNhLjEyNS4xMjUgMCAwIDEgMC0uMTc2bC0uNzA4LS43MDhhMS4xMjcgMS4xMjcgMCAwIDAgMCAxLjU5MmwuNzA4LS43MDh6bTMuOTMzIDMuOTMzTDguNTM3IDguNzEzbC0uNzA4LjcwOCAzLjkzNCAzLjkzMy43MDctLjcwOHptLTMuOTMzIDQuNjQgMy45MzMtMy45MzItLjcwNy0uNzA4TDcuODMgMTYuNThsLjcwNy43MDh6bTAgLjE3N2EuMTI1LjEyNSAwIDAgMSAwLS4xNzZsLS43MDgtLjcwN2ExLjEyNCAxLjEyNCAwIDAgMCAwIDEuNTlsLjcwOC0uNzA3em0uMTc2IDBhLjEyNS4xMjUgMCAwIDEtLjE3NiAwbC0uNzA4LjcwN2MuNDQuNDQgMS4xNTIuNDQgMS41OTIgMGwtLjcwOC0uNzA3em0zLjkzMy0zLjkzMy0zLjkzMyAzLjkzMy43MDguNzA3IDMuOTMzLTMuOTMzLS43MDgtLjcwN3ptNC42NCAzLjkzMy0zLjkzMi0zLjkzMy0uNzA4LjcwNyAzLjkzMyAzLjkzNC43MDgtLjcwOHptLjE3NyAwYS4xMjUuMTI1IDAgMCAxLS4xNzYgMGwtLjcwNy43MDdjLjQzOS40NCAxLjE1MS40NCAxLjU5IDBsLS43MDctLjcwN3ptMC0uMTc2YS4xMjUuMTI1IDAgMCAxIDAgLjE3NmwuNzA3LjcwN2MuNDQtLjQzOS40NC0xLjE1MSAwLTEuNTlsLS43MDcuNzA3em0tMy45MzMtMy45MzMgMy45MzMgMy45MzMuNzA3LS43MDctMy45MzMtMy45MzQtLjcwNy43MDh6bTMuOTMzLTQuNjQtMy45MzMgMy45MzIuNzA3LjcwOCAzLjkzNC0zLjkzMy0uNzA4LS43MDh6bTAtLjE3N2EuMTI1LjEyNSAwIDAgMSAwIC4xNzZsLjcwNy43MDhjLjQ0LS40NC40NC0xLjE1MiAwLTEuNTkxbC0uNzA3LjcwN3ptLS4xNzYgMGEuMTI1LjEyNSAwIDAgMSAuMTc2IDBsLjcwNy0uNzA4YTEuMTI1IDEuMTI1IDAgMCAwLTEuNTkgMGwuNzA3LjcwOHptLTMuOTMzIDMuOTMzIDMuOTMzLTMuOTMzLS43MDctLjcwOC0zLjkzNCAzLjkzNC43MDguNzA3em0tNC42NC0zLjkzMyAzLjkzMiAzLjkzMy43MDgtLjcwN0w5LjQyIDcuODNsLS43MDguNzA3em0tLjE3NyAwYS4xMjUuMTI1IDAgMCAxIC4xNzYgMGwuNzA4LS43MDhhMS4xMjUgMS4xMjUgMCAwIDAtMS41OTEgMGwuNzA3LjcwOHoiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+);
     744}
     745
     746.formico_setting_field_html {
     747    border: 1px dashed rgba(92, 49, 254, .3);
     748    padding: 10px;
     749    border-radius: 5px
     750}
     751
     752.formico_setting_field_html div {
     753    margin: 0;
     754    color: #616266;
     755}
     756
     757.formico_setting_field_container a {
     758    color: var(--formico-color-primary);
     759    text-decoration: underline;
     760}
     761
     762.formico__menu_items li .f_icon {
     763    font-size: 20px;
     764    width: 20px;
     765}
     766
     767span.f_icon.icon-brevo {
     768    font-size: 16px;
     769}
     770
     771span.f_icon.icon-klaviyo {
     772    font-size: 18px;
     773}
     774
     775.formico_setting_field_tooltips .f_icon {
     776    font-size: 18px;
     777}
     778
     779.formico__connect_content .f_icon {
     780    font-size: 24px;
     781    color: var(--formico-color-primary);
     782}
     783
     784.support_box .f_icon {
     785    font-size: 30px;
     786    color: var(--formico-color-primary);
     787}
     788
     789.support_box .support_link {
     790    text-decoration: underline;
    199791    position: relative;
    200792}
    201793
    202 .formico_input__switch label .formico_fields_links {
    203     display: flex;
    204     align-items: center;
    205     justify-content: start;
    206     gap: 20px;
    207 }
    208 
    209 
    210 .formico_fields_links a {
    211     text-decoration: none;
    212     font-size: 13px;
    213     color: #666;
    214     position: relative;
    215     font-weight: 400;
    216     transition: 0.3s;
    217     outline: none;
    218 }
    219 
    220 .formico_fields_links a:before {
     794.support_box .support_link:before {
    221795    position: absolute;
    222     content: "";
     796    content: '';
    223797    height: 6px;
    224798    width: 6px;
    225     background: #666;
    226     border-radius: 50%;
    227     left: -12px;
     799    right: -10px;
     800    border-top: 2px solid;
     801    transform: rotate(45deg) translateY(-50%);
    228802    top: 50%;
    229     transform: translateY(-50%);
    230 }
    231 
    232 .formico_fields_links a:first-child:before {
    233     display: none;
    234 }
    235 
    236 .formico_input__switch label .formico_field__name .pro_tag {
    237     color: #FFAE01;
    238     text-transform: uppercase;
    239     font-size: 12px;
    240     position: absolute;
    241     top: -3px;
    242     right: -30px;
    243 }
    244 
    245 .formico_input__switch label:before {
    246     position: absolute;
    247     height: 24px;
    248     width: 50px;
    249     border: 1px solid #333;
    250     content: '';
    251     border-radius: 100px;
    252     right: 16px;
    253     top: 50%;
    254     transform: translateY(-50%);
    255     transition: 0.3s;
    256 }
    257 
    258 .formico_input__switch label:after {
    259     position: absolute;
    260     content: '';
    261     height: 18px;
    262     width: 18px;
    263     background: #333;
    264     border-radius: 50%;
    265     top: 50%;
    266     transform: translateY(-50%);
    267     right: 45px;
    268     transition: 0.3s;
    269 }
    270 
    271 .formico_input__switch input:checked+label:after {
    272     right: 21px;
    273     background: #fff;
    274 }
    275 
    276 .formico_input__switch input:checked+label:before {
    277     background: #0077FF;
    278     border-color: #0077FF;
    279 }
    280 
    281 .formico-field-type-pro-disabled label,
    282 .formico-extension-type-pro-disabled label {
    283     background: rgba(255, 174, 1, .15);
    284     border-color: rgba(255, 174, 1, .2);
    285 }
    286 
    287 .formico_input__switch input:checked+label {
    288     border-color: rgba(0, 119, 255, .3);
    289 }
    290 
    291 .formico_fields_links a:hover {
    292     color: #0077FF;
    293 }
    294 
    295 
    296 .formico_input__switch.formico-field-type-pro-disabled label:before,
    297 .formico_input__switch.formico-field-type-pro-disabled label:after,
    298 .formico_input__switch.formico-extension-type-pro-disabled label:before,
    299 .formico_input__switch.formico-extension-type-pro-disabled label:after {
    300     opacity: .5;
    301 }
    302 
    303 .formico_field_wrapper .formico_desc {
    304     margin: 25px 0 30px;
    305     font-size: 16px;
    306 }
    307 
    308 .formico_user_setting {
    309     background: #F5F5F5;
    310     padding: 26px;
    311     border-radius: 8px;
    312 }
    313 
    314 .formico_user_setting h3 {
    315     font-size: 16px;
    316     text-transform: uppercase;
    317     margin: 0 0 20px;
    318     letter-spacing: .5px;
    319     position: relative;
    320     padding-bottom: 20px;
    321 }
    322 
    323 .formico_input__text label {
    324     display: block;
    325     font-size: 14px;
    326     font-weight: 500;
    327     color: #000;
    328     margin-bottom: 6px;
    329 }
    330 
    331 .formico_input__text input[type=text] {
    332     width: 100%;
    333     padding: 10px 20px;
    334     margin: 0;
    335     outline: none;
    336     transition: 0.3s;
    337     border: 1px solid #f0f0f0;
    338     background: #fff;
    339 }
    340 
    341 .formico_input__text input[type=text]:focus {
    342     box-shadow: none;
    343     border-color: #0077FF;
    344 }
    345 
    346 .formico_user_setting h3:after {
    347     position: absolute;
    348     content: '';
    349     height: 3px;
    350     width: 50px;
    351     background: #0077FF;
    352     bottom: 0;
    353     left: 0;
    354 }
    355 
    356 .formico_user_setting h3:before {
    357     position: absolute;
    358     content: '';
    359     height: 3px;
    360     width: 100%;
    361     background: #fff;
    362     bottom: 0;
    363 }
    364 
    365 .formico_input__text:not(:last-child) {
    366     margin-bottom: 20px;
    367 }
    368 
    369 .formico__fields_title.top-m-60 {
    370     margin-top: 60px;
    371 }
    372 
    373 .tabscroll_activeNavi .formico_tab_icon svg {
    374     transition: 0.2s;
    375 }
    376 
    377 .tabscroll_activeNavi .formico_tab_icon svg path {
    378     fill: #0077FF;
    379 }
    380 
    381 .formico_logo {
    382     margin-bottom: 25px;
    383 }
    384 
    385 .formico_logo h2 {
    386     font-size: 40px;
    387     margin: 0;
    388     line-height: 40px;
    389     color: #0077FF;
    390     font-weight: 700;
    391 }
     803    border-right: 2px solid;
     804}
  • formico/trunk/assets/css/formico_style.css

    r3093701 r3187716  
    1 .elementor-field-type-frmc_spf .iti {
     1.dialog-type-lightbox {
     2    z-index: 999;
     3}
     4
     5.elementor-field-type-formico_spf .iti {
    26    display: block;
    37    width: 100%;
     
    59}
    610
    7 .elementor-field-type-frmc_spf .iti .elementor-message-danger {
     11.elementor-field-type-formico_spf .iti:before,
     12.elementor-field-type-formico_spf .iti:after {
    813    position: absolute;
    9     width: 100%;
    10     left: 0;
    11     bottom: -28px;
    12     margin: 0;
     14    content: '';
     15    height: 20px;
     16    width: 20px;
     17    background-size: cover;
     18    z-index: 9;
     19    right: 10px;
     20    top: 50%;
     21    transform: translateY(-50%);
    1322}
    1423
    15 .elementor-field-type-frmc_spf .iti.elementor-error {
    16     margin-bottom: 38px;
     24.elementor-field-type-formico_spf .iti.valid:before {
     25    background-image: url('data: image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="green" ><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" /></svg>');
    1726}
     27
     28.elementor-field-type-formico_spf .iti.invalid:after {
     29    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="red"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" /></svg>');
     30}
     31
     32
     33/* Signature */
     34.formico_signature_pad {
     35    width: 100%;
     36    display: grid;
     37    grid-template-columns: auto 30px;
     38    justify-content: start;
     39    align-items: end;
     40    gap: 5px;
     41}
     42
     43.formico_signature_canvas {
     44    border: 2px dashed #dddddd;
     45    position: relative;
     46    height: 200px;
     47}
     48
     49.formico_signature_canvas canvas {
     50    position: absolute;
     51    left: 0;
     52    top: 0;
     53    width: 100%;
     54    height: 100%;
     55    border-radius: 4px;
     56    box-shadow: 0 0 5px rgba(0, 0, 0, 0.02) inset;
     57}
     58
     59.signature_clear {
     60    cursor: pointer;
     61    width: 24px;
     62}
  • formico/trunk/assets/css/lib/intlTelInput.min.css

    r3093701 r3187716  
    1 .iti {
    2     position: relative;
    3     display: inline-block;
    4 }
    5 
    6 .iti * {
    7     box-sizing: border-box;
    8 }
    9 
    10 .iti__hide {
    11     display: none;
    12 }
    13 
    14 .iti__v-hide {
    15     visibility: hidden;
    16 }
    17 
    18 .iti__a11y-text {
    19     width: 1px;
    20     height: 1px;
    21     clip: rect(1px, 1px, 1px, 1px);
    22     overflow: hidden;
    23     position: absolute;
    24 }
    25 
    26 .iti input.iti__tel-input,
    27 .iti input.iti__tel-input[type=text],
    28 .iti input.iti__tel-input[type=tel] {
    29     position: relative;
    30     z-index: 0;
    31     margin-top: 0 !important;
    32     margin-bottom: 0 !important;
    33     padding-right: 36px;
    34     margin-right: 0;
    35 }
    36 
    37 .iti__flag-container {
    38     position: absolute;
    39     top: 0;
    40     bottom: 0;
    41     right: 0;
    42     padding: 1px;
    43 }
    44 
    45 .iti__selected-flag {
    46     z-index: 1;
    47     position: relative;
    48     display: flex;
    49     align-items: center;
    50     height: 100%;
    51     padding: 0 6px 0 8px;
    52 }
    53 
    54 .iti__arrow {
    55     margin-left: 6px;
    56     width: 0;
    57     height: 0;
    58     border-left: 3px solid transparent;
    59     border-right: 3px solid transparent;
    60     border-top: 4px solid #555;
    61 }
    62 
    63 [dir=rtl] .iti__arrow {
    64     margin-right: 6px;
    65     margin-left: 0;
    66 }
    67 
    68 .iti__arrow--up {
    69     border-top: none;
    70     border-bottom: 4px solid #555;
    71 }
    72 
    73 .iti__dropdown-content {
    74     border-radius: 3px;
    75     background-color: white;
    76 }
    77 
    78 .iti--inline-dropdown .iti__dropdown-content {
    79     position: absolute;
    80     z-index: 2;
    81     margin-top: 3px;
    82     margin-left: -1px;
    83     border: 1px solid #ccc;
    84     box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
    85 }
    86 
    87 .iti__dropdown-content--dropup {
    88     bottom: 100%;
    89     margin-bottom: 3px;
    90 }
    91 
    92 .iti__search-input {
    93     width: 100%;
    94     border-width: 0;
    95     border-radius: 3px;
    96     padding: 9px 12px;
    97 }
    98 
    99 .iti__search-input+.iti__country-list {
    100     border-top: 1px solid #ccc;
    101 }
    102 
    103 .iti__country-list {
    104     list-style: none;
    105     padding: 0;
    106     margin: 0;
    107     overflow-y: scroll;
    108     -webkit-overflow-scrolling: touch;
    109 }
    110 
    111 .iti--inline-dropdown .iti__country-list {
    112     max-height: 185px;
    113 }
    114 
    115 .iti--flexible-dropdown-width .iti__country-list {
    116     white-space: nowrap;
    117 }
    118 
    119 @media (max-width: 500px) {
    120     .iti--flexible-dropdown-width .iti__country-list {
    121         white-space: normal;
    122     }
    123 }
    124 
    125 .iti__flag-box {
    126     display: inline-block;
    127     width: 20px;
    128 }
    129 
    130 .iti__divider {
    131     padding-bottom: 5px;
    132     margin-bottom: 5px;
    133     border-bottom: 1px solid #ccc;
    134 }
    135 
    136 .iti__country {
    137     display: flex;
    138     align-items: center;
    139     padding: 8px 8px;
    140     outline: none;
    141 }
    142 
    143 .iti__dial-code {
    144     color: #999;
    145 }
    146 
    147 .iti__country.iti__highlight {
    148     background-color: rgba(0, 0, 0, 0.05);
    149 }
    150 
    151 .iti__flag-box,
    152 .iti__country-name {
    153     margin-right: 8px;
    154 }
    155 
    156 [dir=rtl] .iti__flag-box,
    157 [dir=rtl] .iti__country-name {
    158     margin-right: 0;
    159     margin-left: 8px;
    160 }
    161 
    162 .iti--allow-dropdown input.iti__tel-input,
    163 .iti--allow-dropdown input.iti__tel-input[type=text],
    164 .iti--allow-dropdown input.iti__tel-input[type=tel],
    165 .iti--show-selected-dial-code input.iti__tel-input,
    166 .iti--show-selected-dial-code input.iti__tel-input[type=text],
    167 .iti--show-selected-dial-code input.iti__tel-input[type=tel] {
    168     padding-right: 6px;
    169     padding-left: 52px;
    170     margin-left: 0;
    171 }
    172 
    173 [dir=rtl] .iti--allow-dropdown input.iti__tel-input,
    174 [dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=text],
    175 [dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel],
    176 [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input,
    177 [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=text],
    178 [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=tel] {
    179     padding-right: 52px;
    180     padding-left: 6px;
    181     margin-right: 0;
    182 }
    183 
    184 .iti--allow-dropdown .iti__flag-container,
    185 .iti--show-selected-dial-code .iti__flag-container {
    186     right: auto;
    187     left: 0;
    188 }
    189 
    190 [dir=rtl] .iti--allow-dropdown .iti__flag-container,
    191 [dir=rtl] .iti--show-selected-dial-code .iti__flag-container {
    192     right: 0;
    193     left: auto;
    194 }
    195 
    196 .iti--allow-dropdown .iti__flag-container:hover {
    197     cursor: pointer;
    198 }
    199 
    200 .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
    201     background-color: rgba(0, 0, 0, 0.05);
    202 }
    203 
    204 .iti--allow-dropdown .iti__flag-container:has(+ input[disabled]):hover,
    205 .iti--allow-dropdown .iti__flag-container:has(+ input[readonly]):hover {
    206     cursor: default;
    207 }
    208 
    209 .iti--allow-dropdown .iti__flag-container:has(+ input[disabled]):hover .iti__selected-flag,
    210 .iti--allow-dropdown .iti__flag-container:has(+ input[readonly]):hover .iti__selected-flag {
    211     background-color: transparent;
    212 }
    213 
    214 .iti--show-selected-dial-code .iti__selected-flag {
    215     background-color: rgba(0, 0, 0, 0.05);
    216 }
    217 
    218 .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code {
    219     margin-left: 6px;
    220 }
    221 
    222 [dir=rtl] .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code {
    223     margin-left: 0;
    224     margin-right: 6px;
    225 }
    226 
    227 .iti--container {
    228     position: fixed;
    229     top: -1000px;
    230     left: -1000px;
    231     z-index: 1060;
    232     padding: 1px;
    233 }
    234 
    235 .iti--container:hover {
    236     cursor: pointer;
    237 }
    238 
    239 .iti--fullscreen-popup.iti--container {
    240     background-color: rgba(0, 0, 0, 0.5);
    241     top: 0;
    242     bottom: 0;
    243     left: 0;
    244     right: 0;
    245     position: fixed;
    246     padding: 30px;
    247     display: flex;
    248     flex-direction: column;
    249     justify-content: center;
    250 }
    251 
    252 .iti--fullscreen-popup.iti--container.iti--country-search {
    253     justify-content: flex-start;
    254 }
    255 
    256 .iti--fullscreen-popup .iti__dropdown-content {
    257     display: flex;
    258     flex-direction: column;
    259     max-height: 100%;
    260     position: relative;
    261 }
    262 
    263 .iti--fullscreen-popup .iti__country {
    264     padding: 10px 10px;
    265     line-height: 1.5em;
    266 }
    267 
    268 .iti__flag {
    269     width: 20px;
    270 }
    271 
    272 .iti__flag.iti__be {
    273     width: 18px;
    274 }
    275 
    276 .iti__flag.iti__ch {
    277     width: 15px;
    278 }
    279 
    280 .iti__flag.iti__mc {
    281     width: 19px;
    282 }
    283 
    284 .iti__flag.iti__ne {
    285     width: 18px;
    286 }
    287 
    288 .iti__flag.iti__np {
    289     width: 13px;
    290 }
    291 
    292 .iti__flag.iti__va {
    293     width: 15px;
    294 }
    295 
    296 @media (min-resolution: 2x) {
    297     .iti__flag {
    298         background-size: 5762px 15px;
    299     }
    300 }
    301 
    302 .iti__flag.iti__ac {
    303     height: 10px;
    304     background-position: 0px 0px;
    305 }
    306 
    307 .iti__flag.iti__ad {
    308     height: 14px;
    309     background-position: -22px 0px;
    310 }
    311 
    312 .iti__flag.iti__ae {
    313     height: 10px;
    314     background-position: -44px 0px;
    315 }
    316 
    317 .iti__flag.iti__af {
    318     height: 14px;
    319     background-position: -66px 0px;
    320 }
    321 
    322 .iti__flag.iti__ag {
    323     height: 14px;
    324     background-position: -88px 0px;
    325 }
    326 
    327 .iti__flag.iti__ai {
    328     height: 10px;
    329     background-position: -110px 0px;
    330 }
    331 
    332 .iti__flag.iti__al {
    333     height: 15px;
    334     background-position: -132px 0px;
    335 }
    336 
    337 .iti__flag.iti__am {
    338     height: 10px;
    339     background-position: -154px 0px;
    340 }
    341 
    342 .iti__flag.iti__ao {
    343     height: 14px;
    344     background-position: -176px 0px;
    345 }
    346 
    347 .iti__flag.iti__aq {
    348     height: 14px;
    349     background-position: -198px 0px;
    350 }
    351 
    352 .iti__flag.iti__ar {
    353     height: 13px;
    354     background-position: -220px 0px;
    355 }
    356 
    357 .iti__flag.iti__as {
    358     height: 10px;
    359     background-position: -242px 0px;
    360 }
    361 
    362 .iti__flag.iti__at {
    363     height: 14px;
    364     background-position: -264px 0px;
    365 }
    366 
    367 .iti__flag.iti__au {
    368     height: 10px;
    369     background-position: -286px 0px;
    370 }
    371 
    372 .iti__flag.iti__aw {
    373     height: 14px;
    374     background-position: -308px 0px;
    375 }
    376 
    377 .iti__flag.iti__ax {
    378     height: 13px;
    379     background-position: -330px 0px;
    380 }
    381 
    382 .iti__flag.iti__az {
    383     height: 10px;
    384     background-position: -352px 0px;
    385 }
    386 
    387 .iti__flag.iti__ba {
    388     height: 10px;
    389     background-position: -374px 0px;
    390 }
    391 
    392 .iti__flag.iti__bb {
    393     height: 14px;
    394     background-position: -396px 0px;
    395 }
    396 
    397 .iti__flag.iti__bd {
    398     height: 12px;
    399     background-position: -418px 0px;
    400 }
    401 
    402 .iti__flag.iti__be {
    403     height: 15px;
    404     background-position: -440px 0px;
    405 }
    406 
    407 .iti__flag.iti__bf {
    408     height: 14px;
    409     background-position: -460px 0px;
    410 }
    411 
    412 .iti__flag.iti__bg {
    413     height: 12px;
    414     background-position: -482px 0px;
    415 }
    416 
    417 .iti__flag.iti__bh {
    418     height: 12px;
    419     background-position: -504px 0px;
    420 }
    421 
    422 .iti__flag.iti__bi {
    423     height: 12px;
    424     background-position: -526px 0px;
    425 }
    426 
    427 .iti__flag.iti__bj {
    428     height: 14px;
    429     background-position: -548px 0px;
    430 }
    431 
    432 .iti__flag.iti__bl {
    433     height: 14px;
    434     background-position: -570px 0px;
    435 }
    436 
    437 .iti__flag.iti__bm {
    438     height: 10px;
    439     background-position: -592px 0px;
    440 }
    441 
    442 .iti__flag.iti__bn {
    443     height: 10px;
    444     background-position: -614px 0px;
    445 }
    446 
    447 .iti__flag.iti__bo {
    448     height: 14px;
    449     background-position: -636px 0px;
    450 }
    451 
    452 .iti__flag.iti__bq {
    453     height: 14px;
    454     background-position: -658px 0px;
    455 }
    456 
    457 .iti__flag.iti__br {
    458     height: 14px;
    459     background-position: -680px 0px;
    460 }
    461 
    462 .iti__flag.iti__bs {
    463     height: 10px;
    464     background-position: -702px 0px;
    465 }
    466 
    467 .iti__flag.iti__bt {
    468     height: 14px;
    469     background-position: -724px 0px;
    470 }
    471 
    472 .iti__flag.iti__bv {
    473     height: 15px;
    474     background-position: -746px 0px;
    475 }
    476 
    477 .iti__flag.iti__bw {
    478     height: 14px;
    479     background-position: -768px 0px;
    480 }
    481 
    482 .iti__flag.iti__by {
    483     height: 10px;
    484     background-position: -790px 0px;
    485 }
    486 
    487 .iti__flag.iti__bz {
    488     height: 12px;
    489     background-position: -812px 0px;
    490 }
    491 
    492 .iti__flag.iti__ca {
    493     height: 10px;
    494     background-position: -834px 0px;
    495 }
    496 
    497 .iti__flag.iti__cc {
    498     height: 10px;
    499     background-position: -856px 0px;
    500 }
    501 
    502 .iti__flag.iti__cd {
    503     height: 15px;
    504     background-position: -878px 0px;
    505 }
    506 
    507 .iti__flag.iti__cf {
    508     height: 14px;
    509     background-position: -900px 0px;
    510 }
    511 
    512 .iti__flag.iti__cg {
    513     height: 14px;
    514     background-position: -922px 0px;
    515 }
    516 
    517 .iti__flag.iti__ch {
    518     height: 15px;
    519     background-position: -944px 0px;
    520 }
    521 
    522 .iti__flag.iti__ci {
    523     height: 14px;
    524     background-position: -961px 0px;
    525 }
    526 
    527 .iti__flag.iti__ck {
    528     height: 10px;
    529     background-position: -983px 0px;
    530 }
    531 
    532 .iti__flag.iti__cl {
    533     height: 14px;
    534     background-position: -1005px 0px;
    535 }
    536 
    537 .iti__flag.iti__cm {
    538     height: 14px;
    539     background-position: -1027px 0px;
    540 }
    541 
    542 .iti__flag.iti__cn {
    543     height: 14px;
    544     background-position: -1049px 0px;
    545 }
    546 
    547 .iti__flag.iti__co {
    548     height: 14px;
    549     background-position: -1071px 0px;
    550 }
    551 
    552 .iti__flag.iti__cp {
    553     height: 14px;
    554     background-position: -1093px 0px;
    555 }
    556 
    557 .iti__flag.iti__cq {
    558     height: 12px;
    559     background-position: -1115px 0px;
    560 }
    561 
    562 .iti__flag.iti__cr {
    563     height: 12px;
    564     background-position: -1137px 0px;
    565 }
    566 
    567 .iti__flag.iti__cu {
    568     height: 10px;
    569     background-position: -1159px 0px;
    570 }
    571 
    572 .iti__flag.iti__cv {
    573     height: 12px;
    574     background-position: -1181px 0px;
    575 }
    576 
    577 .iti__flag.iti__cw {
    578     height: 14px;
    579     background-position: -1203px 0px;
    580 }
    581 
    582 .iti__flag.iti__cx {
    583     height: 10px;
    584     background-position: -1225px 0px;
    585 }
    586 
    587 .iti__flag.iti__cy {
    588     height: 14px;
    589     background-position: -1247px 0px;
    590 }
    591 
    592 .iti__flag.iti__cz {
    593     height: 14px;
    594     background-position: -1269px 0px;
    595 }
    596 
    597 .iti__flag.iti__de {
    598     height: 12px;
    599     background-position: -1291px 0px;
    600 }
    601 
    602 .iti__flag.iti__dg {
    603     height: 10px;
    604     background-position: -1313px 0px;
    605 }
    606 
    607 .iti__flag.iti__dj {
    608     height: 14px;
    609     background-position: -1335px 0px;
    610 }
    611 
    612 .iti__flag.iti__dk {
    613     height: 15px;
    614     background-position: -1357px 0px;
    615 }
    616 
    617 .iti__flag.iti__dm {
    618     height: 10px;
    619     background-position: -1379px 0px;
    620 }
    621 
    622 .iti__flag.iti__do {
    623     height: 14px;
    624     background-position: -1401px 0px;
    625 }
    626 
    627 .iti__flag.iti__dz {
    628     height: 14px;
    629     background-position: -1423px 0px;
    630 }
    631 
    632 .iti__flag.iti__ea {
    633     height: 14px;
    634     background-position: -1445px 0px;
    635 }
    636 
    637 .iti__flag.iti__ec {
    638     height: 14px;
    639     background-position: -1467px 0px;
    640 }
    641 
    642 .iti__flag.iti__ee {
    643     height: 13px;
    644     background-position: -1489px 0px;
    645 }
    646 
    647 .iti__flag.iti__eg {
    648     height: 14px;
    649     background-position: -1511px 0px;
    650 }
    651 
    652 .iti__flag.iti__eh {
    653     height: 10px;
    654     background-position: -1533px 0px;
    655 }
    656 
    657 .iti__flag.iti__er {
    658     height: 10px;
    659     background-position: -1555px 0px;
    660 }
    661 
    662 .iti__flag.iti__es {
    663     height: 14px;
    664     background-position: -1577px 0px;
    665 }
    666 
    667 .iti__flag.iti__et {
    668     height: 10px;
    669     background-position: -1599px 0px;
    670 }
    671 
    672 .iti__flag.iti__eu {
    673     height: 14px;
    674     background-position: -1621px 0px;
    675 }
    676 
    677 .iti__flag.iti__ez {
    678     height: 14px;
    679     background-position: -1643px 0px;
    680 }
    681 
    682 .iti__flag.iti__fi {
    683     height: 12px;
    684     background-position: -1665px 0px;
    685 }
    686 
    687 .iti__flag.iti__fj {
    688     height: 10px;
    689     background-position: -1687px 0px;
    690 }
    691 
    692 .iti__flag.iti__fk {
    693     height: 10px;
    694     background-position: -1709px 0px;
    695 }
    696 
    697 .iti__flag.iti__fm {
    698     height: 11px;
    699     background-position: -1731px 0px;
    700 }
    701 
    702 .iti__flag.iti__fo {
    703     height: 15px;
    704     background-position: -1753px 0px;
    705 }
    706 
    707 .iti__flag.iti__fr {
    708     height: 14px;
    709     background-position: -1775px 0px;
    710 }
    711 
    712 .iti__flag.iti__fx {
    713     height: 14px;
    714     background-position: -1797px 0px;
    715 }
    716 
    717 .iti__flag.iti__ga {
    718     height: 15px;
    719     background-position: -1819px 0px;
    720 }
    721 
    722 .iti__flag.iti__gb {
    723     height: 10px;
    724     background-position: -1841px 0px;
    725 }
    726 
    727 .iti__flag.iti__gd {
    728     height: 12px;
    729     background-position: -1863px 0px;
    730 }
    731 
    732 .iti__flag.iti__ge {
    733     height: 14px;
    734     background-position: -1885px 0px;
    735 }
    736 
    737 .iti__flag.iti__gf {
    738     height: 14px;
    739     background-position: -1907px 0px;
    740 }
    741 
    742 .iti__flag.iti__gg {
    743     height: 14px;
    744     background-position: -1929px 0px;
    745 }
    746 
    747 .iti__flag.iti__gh {
    748     height: 14px;
    749     background-position: -1951px 0px;
    750 }
    751 
    752 .iti__flag.iti__gi {
    753     height: 10px;
    754     background-position: -1973px 0px;
    755 }
    756 
    757 .iti__flag.iti__gl {
    758     height: 14px;
    759     background-position: -1995px 0px;
    760 }
    761 
    762 .iti__flag.iti__gm {
    763     height: 14px;
    764     background-position: -2017px 0px;
    765 }
    766 
    767 .iti__flag.iti__gn {
    768     height: 14px;
    769     background-position: -2039px 0px;
    770 }
    771 
    772 .iti__flag.iti__gp {
    773     height: 14px;
    774     background-position: -2061px 0px;
    775 }
    776 
    777 .iti__flag.iti__gq {
    778     height: 14px;
    779     background-position: -2083px 0px;
    780 }
    781 
    782 .iti__flag.iti__gr {
    783     height: 14px;
    784     background-position: -2105px 0px;
    785 }
    786 
    787 .iti__flag.iti__gs {
    788     height: 10px;
    789     background-position: -2127px 0px;
    790 }
    791 
    792 .iti__flag.iti__gt {
    793     height: 13px;
    794     background-position: -2149px 0px;
    795 }
    796 
    797 .iti__flag.iti__gu {
    798     height: 11px;
    799     background-position: -2171px 0px;
    800 }
    801 
    802 .iti__flag.iti__gw {
    803     height: 10px;
    804     background-position: -2193px 0px;
    805 }
    806 
    807 .iti__flag.iti__gy {
    808     height: 12px;
    809     background-position: -2215px 0px;
    810 }
    811 
    812 .iti__flag.iti__hk {
    813     height: 14px;
    814     background-position: -2237px 0px;
    815 }
    816 
    817 .iti__flag.iti__hm {
    818     height: 10px;
    819     background-position: -2259px 0px;
    820 }
    821 
    822 .iti__flag.iti__hn {
    823     height: 10px;
    824     background-position: -2281px 0px;
    825 }
    826 
    827 .iti__flag.iti__hr {
    828     height: 10px;
    829     background-position: -2303px 0px;
    830 }
    831 
    832 .iti__flag.iti__ht {
    833     height: 12px;
    834     background-position: -2325px 0px;
    835 }
    836 
    837 .iti__flag.iti__hu {
    838     height: 10px;
    839     background-position: -2347px 0px;
    840 }
    841 
    842 .iti__flag.iti__ic {
    843     height: 14px;
    844     background-position: -2369px 0px;
    845 }
    846 
    847 .iti__flag.iti__id {
    848     height: 14px;
    849     background-position: -2391px 0px;
    850 }
    851 
    852 .iti__flag.iti__ie {
    853     height: 10px;
    854     background-position: -2413px 0px;
    855 }
    856 
    857 .iti__flag.iti__il {
    858     height: 15px;
    859     background-position: -2435px 0px;
    860 }
    861 
    862 .iti__flag.iti__im {
    863     height: 10px;
    864     background-position: -2457px 0px;
    865 }
    866 
    867 .iti__flag.iti__in {
    868     height: 14px;
    869     background-position: -2479px 0px;
    870 }
    871 
    872 .iti__flag.iti__io {
    873     height: 10px;
    874     background-position: -2501px 0px;
    875 }
    876 
    877 .iti__flag.iti__iq {
    878     height: 14px;
    879     background-position: -2523px 0px;
    880 }
    881 
    882 .iti__flag.iti__ir {
    883     height: 12px;
    884     background-position: -2545px 0px;
    885 }
    886 
    887 .iti__flag.iti__is {
    888     height: 15px;
    889     background-position: -2567px 0px;
    890 }
    891 
    892 .iti__flag.iti__it {
    893     height: 14px;
    894     background-position: -2589px 0px;
    895 }
    896 
    897 .iti__flag.iti__je {
    898     height: 12px;
    899     background-position: -2611px 0px;
    900 }
    901 
    902 .iti__flag.iti__jm {
    903     height: 10px;
    904     background-position: -2633px 0px;
    905 }
    906 
    907 .iti__flag.iti__jo {
    908     height: 10px;
    909     background-position: -2655px 0px;
    910 }
    911 
    912 .iti__flag.iti__jp {
    913     height: 14px;
    914     background-position: -2677px 0px;
    915 }
    916 
    917 .iti__flag.iti__ke {
    918     height: 14px;
    919     background-position: -2699px 0px;
    920 }
    921 
    922 .iti__flag.iti__kg {
    923     height: 12px;
    924     background-position: -2721px 0px;
    925 }
    926 
    927 .iti__flag.iti__kh {
    928     height: 13px;
    929     background-position: -2743px 0px;
    930 }
    931 
    932 .iti__flag.iti__ki {
    933     height: 10px;
    934     background-position: -2765px 0px;
    935 }
    936 
    937 .iti__flag.iti__km {
    938     height: 12px;
    939     background-position: -2787px 0px;
    940 }
    941 
    942 .iti__flag.iti__kn {
    943     height: 14px;
    944     background-position: -2809px 0px;
    945 }
    946 
    947 .iti__flag.iti__kp {
    948     height: 10px;
    949     background-position: -2831px 0px;
    950 }
    951 
    952 .iti__flag.iti__kr {
    953     height: 14px;
    954     background-position: -2853px 0px;
    955 }
    956 
    957 .iti__flag.iti__kw {
    958     height: 10px;
    959     background-position: -2875px 0px;
    960 }
    961 
    962 .iti__flag.iti__ky {
    963     height: 10px;
    964     background-position: -2897px 0px;
    965 }
    966 
    967 .iti__flag.iti__kz {
    968     height: 10px;
    969     background-position: -2919px 0px;
    970 }
    971 
    972 .iti__flag.iti__la {
    973     height: 14px;
    974     background-position: -2941px 0px;
    975 }
    976 
    977 .iti__flag.iti__lb {
    978     height: 14px;
    979     background-position: -2963px 0px;
    980 }
    981 
    982 .iti__flag.iti__lc {
    983     height: 10px;
    984     background-position: -2985px 0px;
    985 }
    986 
    987 .iti__flag.iti__li {
    988     height: 12px;
    989     background-position: -3007px 0px;
    990 }
    991 
    992 .iti__flag.iti__lk {
    993     height: 10px;
    994     background-position: -3029px 0px;
    995 }
    996 
    997 .iti__flag.iti__lr {
    998     height: 11px;
    999     background-position: -3051px 0px;
    1000 }
    1001 
    1002 .iti__flag.iti__ls {
    1003     height: 14px;
    1004     background-position: -3073px 0px;
    1005 }
    1006 
    1007 .iti__flag.iti__lt {
    1008     height: 12px;
    1009     background-position: -3095px 0px;
    1010 }
    1011 
    1012 .iti__flag.iti__lu {
    1013     height: 12px;
    1014     background-position: -3117px 0px;
    1015 }
    1016 
    1017 .iti__flag.iti__lv {
    1018     height: 10px;
    1019     background-position: -3139px 0px;
    1020 }
    1021 
    1022 .iti__flag.iti__ly {
    1023     height: 10px;
    1024     background-position: -3161px 0px;
    1025 }
    1026 
    1027 .iti__flag.iti__ma {
    1028     height: 14px;
    1029     background-position: -3183px 0px;
    1030 }
    1031 
    1032 .iti__flag.iti__mc {
    1033     height: 15px;
    1034     background-position: -3205px 0px;
    1035 }
    1036 
    1037 .iti__flag.iti__md {
    1038     height: 10px;
    1039     background-position: -3226px 0px;
    1040 }
    1041 
    1042 .iti__flag.iti__me {
    1043     height: 10px;
    1044     background-position: -3248px 0px;
    1045 }
    1046 
    1047 .iti__flag.iti__mf {
    1048     height: 14px;
    1049     background-position: -3270px 0px;
    1050 }
    1051 
    1052 .iti__flag.iti__mg {
    1053     height: 14px;
    1054     background-position: -3292px 0px;
    1055 }
    1056 
    1057 .iti__flag.iti__mh {
    1058     height: 11px;
    1059     background-position: -3314px 0px;
    1060 }
    1061 
    1062 .iti__flag.iti__mk {
    1063     height: 10px;
    1064     background-position: -3336px 0px;
    1065 }
    1066 
    1067 .iti__flag.iti__ml {
    1068     height: 14px;
    1069     background-position: -3358px 0px;
    1070 }
    1071 
    1072 .iti__flag.iti__mm {
    1073     height: 14px;
    1074     background-position: -3380px 0px;
    1075 }
    1076 
    1077 .iti__flag.iti__mn {
    1078     height: 10px;
    1079     background-position: -3402px 0px;
    1080 }
    1081 
    1082 .iti__flag.iti__mo {
    1083     height: 14px;
    1084     background-position: -3424px 0px;
    1085 }
    1086 
    1087 .iti__flag.iti__mp {
    1088     height: 10px;
    1089     background-position: -3446px 0px;
    1090 }
    1091 
    1092 .iti__flag.iti__mq {
    1093     height: 14px;
    1094     background-position: -3468px 0px;
    1095 }
    1096 
    1097 .iti__flag.iti__mr {
    1098     height: 14px;
    1099     background-position: -3490px 0px;
    1100 }
    1101 
    1102 .iti__flag.iti__ms {
    1103     height: 10px;
    1104     background-position: -3512px 0px;
    1105 }
    1106 
    1107 .iti__flag.iti__mt {
    1108     height: 14px;
    1109     background-position: -3534px 0px;
    1110 }
    1111 
    1112 .iti__flag.iti__mu {
    1113     height: 14px;
    1114     background-position: -3556px 0px;
    1115 }
    1116 
    1117 .iti__flag.iti__mv {
    1118     height: 14px;
    1119     background-position: -3578px 0px;
    1120 }
    1121 
    1122 .iti__flag.iti__mw {
    1123     height: 14px;
    1124     background-position: -3600px 0px;
    1125 }
    1126 
    1127 .iti__flag.iti__mx {
    1128     height: 12px;
    1129     background-position: -3622px 0px;
    1130 }
    1131 
    1132 .iti__flag.iti__my {
    1133     height: 10px;
    1134     background-position: -3644px 0px;
    1135 }
    1136 
    1137 .iti__flag.iti__mz {
    1138     height: 14px;
    1139     background-position: -3666px 0px;
    1140 }
    1141 
    1142 .iti__flag.iti__na {
    1143     height: 14px;
    1144     background-position: -3688px 0px;
    1145 }
    1146 
    1147 .iti__flag.iti__nc {
    1148     height: 10px;
    1149     background-position: -3710px 0px;
    1150 }
    1151 
    1152 .iti__flag.iti__ne {
    1153     height: 15px;
    1154     background-position: -3732px 0px;
    1155 }
    1156 
    1157 .iti__flag.iti__nf {
    1158     height: 10px;
    1159     background-position: -3752px 0px;
    1160 }
    1161 
    1162 .iti__flag.iti__ng {
    1163     height: 10px;
    1164     background-position: -3774px 0px;
    1165 }
    1166 
    1167 .iti__flag.iti__ni {
    1168     height: 12px;
    1169     background-position: -3796px 0px;
    1170 }
    1171 
    1172 .iti__flag.iti__nl {
    1173     height: 14px;
    1174     background-position: -3818px 0px;
    1175 }
    1176 
    1177 .iti__flag.iti__no {
    1178     height: 15px;
    1179     background-position: -3840px 0px;
    1180 }
    1181 
    1182 .iti__flag.iti__np {
    1183     height: 15px;
    1184     background-position: -3862px 0px;
    1185 }
    1186 
    1187 .iti__flag.iti__nr {
    1188     height: 10px;
    1189     background-position: -3877px 0px;
    1190 }
    1191 
    1192 .iti__flag.iti__nu {
    1193     height: 10px;
    1194     background-position: -3899px 0px;
    1195 }
    1196 
    1197 .iti__flag.iti__nz {
    1198     height: 10px;
    1199     background-position: -3921px 0px;
    1200 }
    1201 
    1202 .iti__flag.iti__om {
    1203     height: 10px;
    1204     background-position: -3943px 0px;
    1205 }
    1206 
    1207 .iti__flag.iti__pa {
    1208     height: 14px;
    1209     background-position: -3965px 0px;
    1210 }
    1211 
    1212 .iti__flag.iti__pe {
    1213     height: 14px;
    1214     background-position: -3987px 0px;
    1215 }
    1216 
    1217 .iti__flag.iti__pf {
    1218     height: 14px;
    1219     background-position: -4009px 0px;
    1220 }
    1221 
    1222 .iti__flag.iti__pg {
    1223     height: 15px;
    1224     background-position: -4031px 0px;
    1225 }
    1226 
    1227 .iti__flag.iti__ph {
    1228     height: 10px;
    1229     background-position: -4053px 0px;
    1230 }
    1231 
    1232 .iti__flag.iti__pk {
    1233     height: 14px;
    1234     background-position: -4075px 0px;
    1235 }
    1236 
    1237 .iti__flag.iti__pl {
    1238     height: 13px;
    1239     background-position: -4097px 0px;
    1240 }
    1241 
    1242 .iti__flag.iti__pm {
    1243     height: 14px;
    1244     background-position: -4119px 0px;
    1245 }
    1246 
    1247 .iti__flag.iti__pn {
    1248     height: 10px;
    1249     background-position: -4141px 0px;
    1250 }
    1251 
    1252 .iti__flag.iti__pr {
    1253     height: 14px;
    1254     background-position: -4163px 0px;
    1255 }
    1256 
    1257 .iti__flag.iti__ps {
    1258     height: 10px;
    1259     background-position: -4185px 0px;
    1260 }
    1261 
    1262 .iti__flag.iti__pt {
    1263     height: 14px;
    1264     background-position: -4207px 0px;
    1265 }
    1266 
    1267 .iti__flag.iti__pw {
    1268     height: 13px;
    1269     background-position: -4229px 0px;
    1270 }
    1271 
    1272 .iti__flag.iti__py {
    1273     height: 11px;
    1274     background-position: -4251px 0px;
    1275 }
    1276 
    1277 .iti__flag.iti__qa {
    1278     height: 8px;
    1279     background-position: -4273px 0px;
    1280 }
    1281 
    1282 .iti__flag.iti__re {
    1283     height: 14px;
    1284     background-position: -4295px 0px;
    1285 }
    1286 
    1287 .iti__flag.iti__ro {
    1288     height: 14px;
    1289     background-position: -4317px 0px;
    1290 }
    1291 
    1292 .iti__flag.iti__rs {
    1293     height: 14px;
    1294     background-position: -4339px 0px;
    1295 }
    1296 
    1297 .iti__flag.iti__ru {
    1298     height: 14px;
    1299     background-position: -4361px 0px;
    1300 }
    1301 
    1302 .iti__flag.iti__rw {
    1303     height: 14px;
    1304     background-position: -4383px 0px;
    1305 }
    1306 
    1307 .iti__flag.iti__sa {
    1308     height: 14px;
    1309     background-position: -4405px 0px;
    1310 }
    1311 
    1312 .iti__flag.iti__sb {
    1313     height: 10px;
    1314     background-position: -4427px 0px;
    1315 }
    1316 
    1317 .iti__flag.iti__sc {
    1318     height: 10px;
    1319     background-position: -4449px 0px;
    1320 }
    1321 
    1322 .iti__flag.iti__sd {
    1323     height: 10px;
    1324     background-position: -4471px 0px;
    1325 }
    1326 
    1327 .iti__flag.iti__se {
    1328     height: 13px;
    1329     background-position: -4493px 0px;
    1330 }
    1331 
    1332 .iti__flag.iti__sg {
    1333     height: 14px;
    1334     background-position: -4515px 0px;
    1335 }
    1336 
    1337 .iti__flag.iti__sh {
    1338     height: 10px;
    1339     background-position: -4537px 0px;
    1340 }
    1341 
    1342 .iti__flag.iti__si {
    1343     height: 10px;
    1344     background-position: -4559px 0px;
    1345 }
    1346 
    1347 .iti__flag.iti__sj {
    1348     height: 15px;
    1349     background-position: -4581px 0px;
    1350 }
    1351 
    1352 .iti__flag.iti__sk {
    1353     height: 14px;
    1354     background-position: -4603px 0px;
    1355 }
    1356 
    1357 .iti__flag.iti__sl {
    1358     height: 14px;
    1359     background-position: -4625px 0px;
    1360 }
    1361 
    1362 .iti__flag.iti__sm {
    1363     height: 15px;
    1364     background-position: -4647px 0px;
    1365 }
    1366 
    1367 .iti__flag.iti__sn {
    1368     height: 14px;
    1369     background-position: -4669px 0px;
    1370 }
    1371 
    1372 .iti__flag.iti__so {
    1373     height: 14px;
    1374     background-position: -4691px 0px;
    1375 }
    1376 
    1377 .iti__flag.iti__sr {
    1378     height: 14px;
    1379     background-position: -4713px 0px;
    1380 }
    1381 
    1382 .iti__flag.iti__ss {
    1383     height: 10px;
    1384     background-position: -4735px 0px;
    1385 }
    1386 
    1387 .iti__flag.iti__st {
    1388     height: 10px;
    1389     background-position: -4757px 0px;
    1390 }
    1391 
    1392 .iti__flag.iti__su {
    1393     height: 10px;
    1394     background-position: -4779px 0px;
    1395 }
    1396 
    1397 .iti__flag.iti__sv {
    1398     height: 12px;
    1399     background-position: -4801px 0px;
    1400 }
    1401 
    1402 .iti__flag.iti__sx {
    1403     height: 14px;
    1404     background-position: -4823px 0px;
    1405 }
    1406 
    1407 .iti__flag.iti__sy {
    1408     height: 14px;
    1409     background-position: -4845px 0px;
    1410 }
    1411 
    1412 .iti__flag.iti__sz {
    1413     height: 14px;
    1414     background-position: -4867px 0px;
    1415 }
    1416 
    1417 .iti__flag.iti__ta {
    1418     height: 10px;
    1419     background-position: -4889px 0px;
    1420 }
    1421 
    1422 .iti__flag.iti__tc {
    1423     height: 10px;
    1424     background-position: -4911px 0px;
    1425 }
    1426 
    1427 .iti__flag.iti__td {
    1428     height: 14px;
    1429     background-position: -4933px 0px;
    1430 }
    1431 
    1432 .iti__flag.iti__tf {
    1433     height: 14px;
    1434     background-position: -4955px 0px;
    1435 }
    1436 
    1437 .iti__flag.iti__tg {
    1438     height: 13px;
    1439     background-position: -4977px 0px;
    1440 }
    1441 
    1442 .iti__flag.iti__th {
    1443     height: 14px;
    1444     background-position: -4999px 0px;
    1445 }
    1446 
    1447 .iti__flag.iti__tj {
    1448     height: 10px;
    1449     background-position: -5021px 0px;
    1450 }
    1451 
    1452 .iti__flag.iti__tk {
    1453     height: 10px;
    1454     background-position: -5043px 0px;
    1455 }
    1456 
    1457 .iti__flag.iti__tl {
    1458     height: 10px;
    1459     background-position: -5065px 0px;
    1460 }
    1461 
    1462 .iti__flag.iti__tm {
    1463     height: 14px;
    1464     background-position: -5087px 0px;
    1465 }
    1466 
    1467 .iti__flag.iti__tn {
    1468     height: 14px;
    1469     background-position: -5109px 0px;
    1470 }
    1471 
    1472 .iti__flag.iti__to {
    1473     height: 10px;
    1474     background-position: -5131px 0px;
    1475 }
    1476 
    1477 .iti__flag.iti__tr {
    1478     height: 14px;
    1479     background-position: -5153px 0px;
    1480 }
    1481 
    1482 .iti__flag.iti__tt {
    1483     height: 12px;
    1484     background-position: -5175px 0px;
    1485 }
    1486 
    1487 .iti__flag.iti__tv {
    1488     height: 10px;
    1489     background-position: -5197px 0px;
    1490 }
    1491 
    1492 .iti__flag.iti__tw {
    1493     height: 14px;
    1494     background-position: -5219px 0px;
    1495 }
    1496 
    1497 .iti__flag.iti__tz {
    1498     height: 14px;
    1499     background-position: -5241px 0px;
    1500 }
    1501 
    1502 .iti__flag.iti__ua {
    1503     height: 14px;
    1504     background-position: -5263px 0px;
    1505 }
    1506 
    1507 .iti__flag.iti__ug {
    1508     height: 14px;
    1509     background-position: -5285px 0px;
    1510 }
    1511 
    1512 .iti__flag.iti__uk {
    1513     height: 10px;
    1514     background-position: -5307px 0px;
    1515 }
    1516 
    1517 .iti__flag.iti__um {
    1518     height: 11px;
    1519     background-position: -5329px 0px;
    1520 }
    1521 
    1522 .iti__flag.iti__un {
    1523     height: 14px;
    1524     background-position: -5351px 0px;
    1525 }
    1526 
    1527 .iti__flag.iti__us {
    1528     height: 11px;
    1529     background-position: -5373px 0px;
    1530 }
    1531 
    1532 .iti__flag.iti__uy {
    1533     height: 14px;
    1534     background-position: -5395px 0px;
    1535 }
    1536 
    1537 .iti__flag.iti__uz {
    1538     height: 10px;
    1539     background-position: -5417px 0px;
    1540 }
    1541 
    1542 .iti__flag.iti__va {
    1543     height: 15px;
    1544     background-position: -5439px 0px;
    1545 }
    1546 
    1547 .iti__flag.iti__vc {
    1548     height: 14px;
    1549     background-position: -5456px 0px;
    1550 }
    1551 
    1552 .iti__flag.iti__ve {
    1553     height: 14px;
    1554     background-position: -5478px 0px;
    1555 }
    1556 
    1557 .iti__flag.iti__vg {
    1558     height: 10px;
    1559     background-position: -5500px 0px;
    1560 }
    1561 
    1562 .iti__flag.iti__vi {
    1563     height: 14px;
    1564     background-position: -5522px 0px;
    1565 }
    1566 
    1567 .iti__flag.iti__vn {
    1568     height: 14px;
    1569     background-position: -5544px 0px;
    1570 }
    1571 
    1572 .iti__flag.iti__vu {
    1573     height: 12px;
    1574     background-position: -5566px 0px;
    1575 }
    1576 
    1577 .iti__flag.iti__wf {
    1578     height: 14px;
    1579     background-position: -5588px 0px;
    1580 }
    1581 
    1582 .iti__flag.iti__ws {
    1583     height: 10px;
    1584     background-position: -5610px 0px;
    1585 }
    1586 
    1587 .iti__flag.iti__xk {
    1588     height: 15px;
    1589     background-position: -5632px 0px;
    1590 }
    1591 
    1592 .iti__flag.iti__ye {
    1593     height: 14px;
    1594     background-position: -5654px 0px;
    1595 }
    1596 
    1597 .iti__flag.iti__yt {
    1598     height: 14px;
    1599     background-position: -5676px 0px;
    1600 }
    1601 
    1602 .iti__flag.iti__za {
    1603     height: 14px;
    1604     background-position: -5698px 0px;
    1605 }
    1606 
    1607 .iti__flag.iti__zm {
    1608     height: 14px;
    1609     background-position: -5720px 0px;
    1610 }
    1611 
    1612 .iti__flag.iti__zw {
    1613     height: 10px;
    1614     background-position: -5742px 0px;
    1615 }
    1616 
    1617 .iti__flag {
    1618     height: 15px;
    1619     box-shadow: 0px 0px 1px 0px #888;
    1620     background-image: url("../img/flags.png?1");
    1621     background-repeat: no-repeat;
    1622     background-position: 20px 0;
    1623 }
    1624 
    1625 @media (min-resolution: 2x) {
    1626     .iti__flag {
    1627         background-image: url("../img/[email protected]?1");
    1628     }
    1629 }
    1630 
    1631 .iti__globe {
    1632     background-image: url("../img/globe.png");
    1633     background-size: contain;
    1634     background-position: right;
    1635     box-shadow: none;
    1636     height: 19px;
    1637 }
    1638 
    1639 @media (min-resolution: 2x) {
    1640     .iti__globe {
    1641         background-image: url("../img/[email protected]");
    1642     }
    1643 }
     1:root{--iti-border-gray:#ccc;--iti-text-gray:#999;--iti-hover-color:rgba(0, 0, 0, 0.05);--iti-border-color:var(--iti-border-gray);--iti-dialcode-color:var(--iti-text-gray);--iti-dropdown-bg:white;--iti-spacer-horizontal:8px;--iti-flag-height:15px;--iti-flag-width:20px;--iti-border-width:1px;--iti-arrow-height:4px;--iti-arrow-width:6px;--iti-triangle-border:calc(var(--iti-arrow-width) / 2);--iti-arrow-padding:6px;--iti-arrow-color:#555;--iti-input-padding:6px;--iti-right-hand-selected-country-padding:calc(var(--iti-spacer-horizontal) + var(--iti-spacer-horizontal) + var(--iti-flag-width));--iti-selected-country-arrow-padding:calc(var(--iti-arrow-padding) + var(--iti-arrow-padding) + var(--iti-flag-width) + var(--iti-spacer-horizontal) + var(--iti-arrow-width) + var(--iti-input-padding));--iti-path-flags-1x:url("../img/flags.webp");--iti-path-flags-2x:url("../img/[email protected]");--iti-path-globe-1x:url("../img/globe.webp");--iti-path-globe-2x:url("../img/[email protected]");--iti-flag-sprite-width:5762px;--iti-flag-sprite-height:15px;--iti-mobile-popup-margin:30px}.iti{position:relative;display:inline-block}.iti *{box-sizing:border-box}.iti__hide{display:none}.iti__v-hide{visibility:hidden}.iti__a11y-text{width:1px;height:1px;clip:rect(1px,1px,1px,1px);overflow:hidden;position:absolute}.iti input.iti__tel-input,.iti input.iti__tel-input[type=tel],.iti input.iti__tel-input[type=text]{position:relative;z-index:0;margin-top:0!important;margin-bottom:0!important;padding-right:var(--iti-right-hand-selected-country-padding);margin-right:0}.iti__country-container{position:absolute;top:0;bottom:0;right:0;padding:var(--iti-border-width)}.iti__selected-country{z-index:1;position:relative;display:flex;align-items:center;height:100%;background:0 0;border:0;margin:0;padding:0;font-family:inherit;font-size:inherit;color:inherit;border-radius:0;font-weight:inherit;line-height:inherit;text-decoration:none}.iti__selected-country-primary{display:flex;align-items:center;height:100%;padding:0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal)}.iti__arrow{margin-left:var(--iti-arrow-padding);width:0;height:0;border-left:var(--iti-triangle-border) solid transparent;border-right:var(--iti-triangle-border) solid transparent;border-top:var(--iti-arrow-height) solid var(--iti-arrow-color)}[dir=rtl] .iti__arrow{margin-right:var(--iti-arrow-padding);margin-left:0}.iti__arrow--up{border-top:none;border-bottom:var(--iti-arrow-height) solid var(--iti-arrow-color)}.iti__dropdown-content{border-radius:3px;background-color:var(--iti-dropdown-bg)}.iti--inline-dropdown .iti__dropdown-content{position:absolute;z-index:2;margin-top:3px;margin-left:calc(var(--iti-border-width) * -1);border:var(--iti-border-width) solid var(--iti-border-color);box-shadow:1px 1px 4px rgba(0,0,0,.2)}.iti__search-input{width:100%;border-width:0;border-radius:3px;padding:9px 12px}.iti__search-input+.iti__country-list{border-top:1px solid var(--iti-border-color)}.iti__country-list{list-style:none;padding:0;margin:0;overflow-y:scroll;-webkit-overflow-scrolling:touch}.iti--inline-dropdown .iti__country-list{max-height:185px}.iti--flexible-dropdown-width .iti__country-list{white-space:nowrap}@media (max-width:500px){.iti--flexible-dropdown-width .iti__country-list{white-space:normal}}.iti__flag-box{display:inline-block;width:var(--iti-flag-width)}.iti__country{display:flex;align-items:center;padding:8px var(--iti-spacer-horizontal);outline:0}.iti__dial-code{color:var(--iti-dialcode-color)}.iti__country.iti__highlight{background-color:var(--iti-hover-color)}.iti__country-name,.iti__flag-box{margin-right:var(--iti-spacer-horizontal)}[dir=rtl] .iti__country-name,[dir=rtl] .iti__flag-box{margin-right:0;margin-left:var(--iti-spacer-horizontal)}.iti--allow-dropdown input.iti__tel-input,.iti--allow-dropdown input.iti__tel-input[type=tel],.iti--allow-dropdown input.iti__tel-input[type=text]{padding-right:var(--iti-input-padding);padding-left:var(--iti-selected-country-arrow-padding);margin-left:0}[dir=rtl] .iti--allow-dropdown input.iti__tel-input,[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel],[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=text]{padding-right:var(--iti-selected-country-arrow-padding);padding-left:var(--iti-input-padding);margin-right:0}.iti--allow-dropdown .iti__country-container{right:auto;left:0}[dir=rtl] .iti--allow-dropdown .iti__country-container{right:0;left:auto}.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover,.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover button{cursor:pointer}.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary:hover,.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country:has(+ .iti__dropdown-content:hover) .iti__selected-country-primary{background-color:var(--iti-hover-color)}.iti .iti__selected-dial-code{margin-left:4px}[dir=rtl] .iti .iti__selected-dial-code{margin-left:0;margin-right:4px}.iti--container{position:fixed;top:-1000px;left:-1000px;z-index:1060;padding:var(--iti-border-width)}.iti--container:hover{cursor:pointer}.iti--fullscreen-popup.iti--container{background-color:rgba(0,0,0,.5);top:0;bottom:0;left:0;right:0;position:fixed;padding:var(--iti-mobile-popup-margin);display:flex;flex-direction:column;justify-content:flex-start}.iti--fullscreen-popup .iti__dropdown-content{display:flex;flex-direction:column;max-height:100%;position:relative}.iti--fullscreen-popup .iti__country{padding:10px 10px;line-height:1.5em}.iti__flag{--iti-flag-offset:0px;--iti-flag-width:20px;--iti-flag-height:14px;height:var(--iti-flag-height);width:var(--iti-flag-width);box-shadow:0 0 1px 0 #888;background-image:var(--iti-path-flags-1x);background-repeat:no-repeat;background-position:var(--iti-flag-offset) 0;background-size:var(--iti-flag-sprite-width) var(--iti-flag-sprite-height)}.iti__np{--iti-flag-width:13px}.iti__ch,.iti__va{--iti-flag-width:15px}.iti__be,.iti__ne{--iti-flag-width:18px}.iti__mc{--iti-flag-width:19px}.iti__ac,.iti__ae,.iti__ai,.iti__am,.iti__as,.iti__au,.iti__az,.iti__ba,.iti__bm,.iti__bn,.iti__bs,.iti__by,.iti__ca,.iti__cc,.iti__ck,.iti__cu,.iti__cx,.iti__dg,.iti__dm,.iti__eh,.iti__er,.iti__et,.iti__fj,.iti__fk,.iti__gb,.iti__gi,.iti__gs,.iti__gw,.iti__hm,.iti__hn,.iti__hr,.iti__hu,.iti__ie,.iti__im,.iti__io,.iti__jm,.iti__jo,.iti__ki,.iti__kp,.iti__kw,.iti__ky,.iti__kz,.iti__lc,.iti__lk,.iti__lv,.iti__ly,.iti__md,.iti__me,.iti__mk,.iti__mn,.iti__mp,.iti__ms,.iti__my,.iti__nc,.iti__nf,.iti__ng,.iti__nr,.iti__nu,.iti__nz,.iti__om,.iti__ph,.iti__pn,.iti__ps,.iti__sb,.iti__sc,.iti__sd,.iti__sh,.iti__si,.iti__ss,.iti__st,.iti__su,.iti__ta,.iti__tc,.iti__tj,.iti__tk,.iti__tl,.iti__to,.iti__tv,.iti__uk,.iti__uz,.iti__vg,.iti__ws,.iti__zw{--iti-flag-height:10px}.iti__fm,.iti__gu,.iti__lr,.iti__mh,.iti__py,.iti__um,.iti__us{--iti-flag-height:11px}.iti__bd,.iti__bg,.iti__bh,.iti__bi,.iti__bz,.iti__cq,.iti__cr,.iti__cv,.iti__de,.iti__fi,.iti__gd,.iti__gy,.iti__ht,.iti__ir,.iti__je,.iti__kg,.iti__km,.iti__li,.iti__lt,.iti__lu,.iti__mx,.iti__ni,.iti__sv,.iti__tt,.iti__vu{--iti-flag-height:12px}.iti__ar,.iti__ax,.iti__ee,.iti__gt,.iti__kh,.iti__pl,.iti__pw,.iti__se,.iti__tg{--iti-flag-height:13px}.iti__al,.iti__be,.iti__bv,.iti__cd,.iti__ch,.iti__dk,.iti__fo,.iti__ga,.iti__il,.iti__is,.iti__mc,.iti__ne,.iti__no,.iti__np,.iti__pg,.iti__sj,.iti__sm,.iti__va,.iti__xk{--iti-flag-height:15px}.iti__qa{--iti-flag-height:8px}.iti__ac{--iti-flag-offset:0px}.iti__ad{--iti-flag-offset:-22px}.iti__ae{--iti-flag-offset:-44px}.iti__af{--iti-flag-offset:-66px}.iti__ag{--iti-flag-offset:-88px}.iti__ai{--iti-flag-offset:-110px}.iti__al{--iti-flag-offset:-132px}.iti__am{--iti-flag-offset:-154px}.iti__ao{--iti-flag-offset:-176px}.iti__aq{--iti-flag-offset:-198px}.iti__ar{--iti-flag-offset:-220px}.iti__as{--iti-flag-offset:-242px}.iti__at{--iti-flag-offset:-264px}.iti__au{--iti-flag-offset:-286px}.iti__aw{--iti-flag-offset:-308px}.iti__ax{--iti-flag-offset:-330px}.iti__az{--iti-flag-offset:-352px}.iti__ba{--iti-flag-offset:-374px}.iti__bb{--iti-flag-offset:-396px}.iti__bd{--iti-flag-offset:-418px}.iti__be{--iti-flag-offset:-440px}.iti__bf{--iti-flag-offset:-460px}.iti__bg{--iti-flag-offset:-482px}.iti__bh{--iti-flag-offset:-504px}.iti__bi{--iti-flag-offset:-526px}.iti__bj{--iti-flag-offset:-548px}.iti__bl{--iti-flag-offset:-570px}.iti__bm{--iti-flag-offset:-592px}.iti__bn{--iti-flag-offset:-614px}.iti__bo{--iti-flag-offset:-636px}.iti__bq{--iti-flag-offset:-658px}.iti__br{--iti-flag-offset:-680px}.iti__bs{--iti-flag-offset:-702px}.iti__bt{--iti-flag-offset:-724px}.iti__bv{--iti-flag-offset:-746px}.iti__bw{--iti-flag-offset:-768px}.iti__by{--iti-flag-offset:-790px}.iti__bz{--iti-flag-offset:-812px}.iti__ca{--iti-flag-offset:-834px}.iti__cc{--iti-flag-offset:-856px}.iti__cd{--iti-flag-offset:-878px}.iti__cf{--iti-flag-offset:-900px}.iti__cg{--iti-flag-offset:-922px}.iti__ch{--iti-flag-offset:-944px}.iti__ci{--iti-flag-offset:-961px}.iti__ck{--iti-flag-offset:-983px}.iti__cl{--iti-flag-offset:-1005px}.iti__cm{--iti-flag-offset:-1027px}.iti__cn{--iti-flag-offset:-1049px}.iti__co{--iti-flag-offset:-1071px}.iti__cp{--iti-flag-offset:-1093px}.iti__cq{--iti-flag-offset:-1115px}.iti__cr{--iti-flag-offset:-1137px}.iti__cu{--iti-flag-offset:-1159px}.iti__cv{--iti-flag-offset:-1181px}.iti__cw{--iti-flag-offset:-1203px}.iti__cx{--iti-flag-offset:-1225px}.iti__cy{--iti-flag-offset:-1247px}.iti__cz{--iti-flag-offset:-1269px}.iti__de{--iti-flag-offset:-1291px}.iti__dg{--iti-flag-offset:-1313px}.iti__dj{--iti-flag-offset:-1335px}.iti__dk{--iti-flag-offset:-1357px}.iti__dm{--iti-flag-offset:-1379px}.iti__do{--iti-flag-offset:-1401px}.iti__dz{--iti-flag-offset:-1423px}.iti__ea{--iti-flag-offset:-1445px}.iti__ec{--iti-flag-offset:-1467px}.iti__ee{--iti-flag-offset:-1489px}.iti__eg{--iti-flag-offset:-1511px}.iti__eh{--iti-flag-offset:-1533px}.iti__er{--iti-flag-offset:-1555px}.iti__es{--iti-flag-offset:-1577px}.iti__et{--iti-flag-offset:-1599px}.iti__eu{--iti-flag-offset:-1621px}.iti__ez{--iti-flag-offset:-1643px}.iti__fi{--iti-flag-offset:-1665px}.iti__fj{--iti-flag-offset:-1687px}.iti__fk{--iti-flag-offset:-1709px}.iti__fm{--iti-flag-offset:-1731px}.iti__fo{--iti-flag-offset:-1753px}.iti__fr{--iti-flag-offset:-1775px}.iti__fx{--iti-flag-offset:-1797px}.iti__ga{--iti-flag-offset:-1819px}.iti__gb{--iti-flag-offset:-1841px}.iti__gd{--iti-flag-offset:-1863px}.iti__ge{--iti-flag-offset:-1885px}.iti__gf{--iti-flag-offset:-1907px}.iti__gg{--iti-flag-offset:-1929px}.iti__gh{--iti-flag-offset:-1951px}.iti__gi{--iti-flag-offset:-1973px}.iti__gl{--iti-flag-offset:-1995px}.iti__gm{--iti-flag-offset:-2017px}.iti__gn{--iti-flag-offset:-2039px}.iti__gp{--iti-flag-offset:-2061px}.iti__gq{--iti-flag-offset:-2083px}.iti__gr{--iti-flag-offset:-2105px}.iti__gs{--iti-flag-offset:-2127px}.iti__gt{--iti-flag-offset:-2149px}.iti__gu{--iti-flag-offset:-2171px}.iti__gw{--iti-flag-offset:-2193px}.iti__gy{--iti-flag-offset:-2215px}.iti__hk{--iti-flag-offset:-2237px}.iti__hm{--iti-flag-offset:-2259px}.iti__hn{--iti-flag-offset:-2281px}.iti__hr{--iti-flag-offset:-2303px}.iti__ht{--iti-flag-offset:-2325px}.iti__hu{--iti-flag-offset:-2347px}.iti__ic{--iti-flag-offset:-2369px}.iti__id{--iti-flag-offset:-2391px}.iti__ie{--iti-flag-offset:-2413px}.iti__il{--iti-flag-offset:-2435px}.iti__im{--iti-flag-offset:-2457px}.iti__in{--iti-flag-offset:-2479px}.iti__io{--iti-flag-offset:-2501px}.iti__iq{--iti-flag-offset:-2523px}.iti__ir{--iti-flag-offset:-2545px}.iti__is{--iti-flag-offset:-2567px}.iti__it{--iti-flag-offset:-2589px}.iti__je{--iti-flag-offset:-2611px}.iti__jm{--iti-flag-offset:-2633px}.iti__jo{--iti-flag-offset:-2655px}.iti__jp{--iti-flag-offset:-2677px}.iti__ke{--iti-flag-offset:-2699px}.iti__kg{--iti-flag-offset:-2721px}.iti__kh{--iti-flag-offset:-2743px}.iti__ki{--iti-flag-offset:-2765px}.iti__km{--iti-flag-offset:-2787px}.iti__kn{--iti-flag-offset:-2809px}.iti__kp{--iti-flag-offset:-2831px}.iti__kr{--iti-flag-offset:-2853px}.iti__kw{--iti-flag-offset:-2875px}.iti__ky{--iti-flag-offset:-2897px}.iti__kz{--iti-flag-offset:-2919px}.iti__la{--iti-flag-offset:-2941px}.iti__lb{--iti-flag-offset:-2963px}.iti__lc{--iti-flag-offset:-2985px}.iti__li{--iti-flag-offset:-3007px}.iti__lk{--iti-flag-offset:-3029px}.iti__lr{--iti-flag-offset:-3051px}.iti__ls{--iti-flag-offset:-3073px}.iti__lt{--iti-flag-offset:-3095px}.iti__lu{--iti-flag-offset:-3117px}.iti__lv{--iti-flag-offset:-3139px}.iti__ly{--iti-flag-offset:-3161px}.iti__ma{--iti-flag-offset:-3183px}.iti__mc{--iti-flag-offset:-3205px}.iti__md{--iti-flag-offset:-3226px}.iti__me{--iti-flag-offset:-3248px}.iti__mf{--iti-flag-offset:-3270px}.iti__mg{--iti-flag-offset:-3292px}.iti__mh{--iti-flag-offset:-3314px}.iti__mk{--iti-flag-offset:-3336px}.iti__ml{--iti-flag-offset:-3358px}.iti__mm{--iti-flag-offset:-3380px}.iti__mn{--iti-flag-offset:-3402px}.iti__mo{--iti-flag-offset:-3424px}.iti__mp{--iti-flag-offset:-3446px}.iti__mq{--iti-flag-offset:-3468px}.iti__mr{--iti-flag-offset:-3490px}.iti__ms{--iti-flag-offset:-3512px}.iti__mt{--iti-flag-offset:-3534px}.iti__mu{--iti-flag-offset:-3556px}.iti__mv{--iti-flag-offset:-3578px}.iti__mw{--iti-flag-offset:-3600px}.iti__mx{--iti-flag-offset:-3622px}.iti__my{--iti-flag-offset:-3644px}.iti__mz{--iti-flag-offset:-3666px}.iti__na{--iti-flag-offset:-3688px}.iti__nc{--iti-flag-offset:-3710px}.iti__ne{--iti-flag-offset:-3732px}.iti__nf{--iti-flag-offset:-3752px}.iti__ng{--iti-flag-offset:-3774px}.iti__ni{--iti-flag-offset:-3796px}.iti__nl{--iti-flag-offset:-3818px}.iti__no{--iti-flag-offset:-3840px}.iti__np{--iti-flag-offset:-3862px}.iti__nr{--iti-flag-offset:-3877px}.iti__nu{--iti-flag-offset:-3899px}.iti__nz{--iti-flag-offset:-3921px}.iti__om{--iti-flag-offset:-3943px}.iti__pa{--iti-flag-offset:-3965px}.iti__pe{--iti-flag-offset:-3987px}.iti__pf{--iti-flag-offset:-4009px}.iti__pg{--iti-flag-offset:-4031px}.iti__ph{--iti-flag-offset:-4053px}.iti__pk{--iti-flag-offset:-4075px}.iti__pl{--iti-flag-offset:-4097px}.iti__pm{--iti-flag-offset:-4119px}.iti__pn{--iti-flag-offset:-4141px}.iti__pr{--iti-flag-offset:-4163px}.iti__ps{--iti-flag-offset:-4185px}.iti__pt{--iti-flag-offset:-4207px}.iti__pw{--iti-flag-offset:-4229px}.iti__py{--iti-flag-offset:-4251px}.iti__qa{--iti-flag-offset:-4273px}.iti__re{--iti-flag-offset:-4295px}.iti__ro{--iti-flag-offset:-4317px}.iti__rs{--iti-flag-offset:-4339px}.iti__ru{--iti-flag-offset:-4361px}.iti__rw{--iti-flag-offset:-4383px}.iti__sa{--iti-flag-offset:-4405px}.iti__sb{--iti-flag-offset:-4427px}.iti__sc{--iti-flag-offset:-4449px}.iti__sd{--iti-flag-offset:-4471px}.iti__se{--iti-flag-offset:-4493px}.iti__sg{--iti-flag-offset:-4515px}.iti__sh{--iti-flag-offset:-4537px}.iti__si{--iti-flag-offset:-4559px}.iti__sj{--iti-flag-offset:-4581px}.iti__sk{--iti-flag-offset:-4603px}.iti__sl{--iti-flag-offset:-4625px}.iti__sm{--iti-flag-offset:-4647px}.iti__sn{--iti-flag-offset:-4669px}.iti__so{--iti-flag-offset:-4691px}.iti__sr{--iti-flag-offset:-4713px}.iti__ss{--iti-flag-offset:-4735px}.iti__st{--iti-flag-offset:-4757px}.iti__su{--iti-flag-offset:-4779px}.iti__sv{--iti-flag-offset:-4801px}.iti__sx{--iti-flag-offset:-4823px}.iti__sy{--iti-flag-offset:-4845px}.iti__sz{--iti-flag-offset:-4867px}.iti__ta{--iti-flag-offset:-4889px}.iti__tc{--iti-flag-offset:-4911px}.iti__td{--iti-flag-offset:-4933px}.iti__tf{--iti-flag-offset:-4955px}.iti__tg{--iti-flag-offset:-4977px}.iti__th{--iti-flag-offset:-4999px}.iti__tj{--iti-flag-offset:-5021px}.iti__tk{--iti-flag-offset:-5043px}.iti__tl{--iti-flag-offset:-5065px}.iti__tm{--iti-flag-offset:-5087px}.iti__tn{--iti-flag-offset:-5109px}.iti__to{--iti-flag-offset:-5131px}.iti__tr{--iti-flag-offset:-5153px}.iti__tt{--iti-flag-offset:-5175px}.iti__tv{--iti-flag-offset:-5197px}.iti__tw{--iti-flag-offset:-5219px}.iti__tz{--iti-flag-offset:-5241px}.iti__ua{--iti-flag-offset:-5263px}.iti__ug{--iti-flag-offset:-5285px}.iti__uk{--iti-flag-offset:-5307px}.iti__um{--iti-flag-offset:-5329px}.iti__un{--iti-flag-offset:-5351px}.iti__us{--iti-flag-offset:-5373px}.iti__uy{--iti-flag-offset:-5395px}.iti__uz{--iti-flag-offset:-5417px}.iti__va{--iti-flag-offset:-5439px}.iti__vc{--iti-flag-offset:-5456px}.iti__ve{--iti-flag-offset:-5478px}.iti__vg{--iti-flag-offset:-5500px}.iti__vi{--iti-flag-offset:-5522px}.iti__vn{--iti-flag-offset:-5544px}.iti__vu{--iti-flag-offset:-5566px}.iti__wf{--iti-flag-offset:-5588px}.iti__ws{--iti-flag-offset:-5610px}.iti__xk{--iti-flag-offset:-5632px}.iti__ye{--iti-flag-offset:-5654px}.iti__yt{--iti-flag-offset:-5676px}.iti__za{--iti-flag-offset:-5698px}.iti__zm{--iti-flag-offset:-5720px}.iti__zw{--iti-flag-offset:-5742px}.iti__globe{background-image:var(--iti-path-globe-1x);background-size:contain;background-position:right;box-shadow:none;height:19px}@media (min-resolution:2x){.iti__flag{background-image:var(--iti-path-flags-2x)}.iti__globe{background-image:var(--iti-path-globe-2x)}}
  • formico/trunk/assets/images/formico.svg

    r3093701 r3187716  
    1 <svg width="230" height="58" viewBox="0 0 230 58" fill="none" xmlns="http://www.w3.org/2000/svg">
    2 <g clip-path="url(#clip0_54_2)">
    3 <path fill-rule="evenodd" clip-rule="evenodd" d="M58 29C58 45.0163 45.0163 58 29 58C27.295 58 25.6243 57.8529 24 57.5706V41H37C39.7614 41 42 38.7614 42 36C42 33.2386 39.7614 31 37 31H21C17.134 31 14 34.134 14 38V53.8244C5.60836 48.7429 0 39.5264 0 29C0 26.5414 0.305958 24.1542 0.881878 21.8745C1.24137 21.9566 1.61562 22 2 22H42C44.7614 22 47 19.7614 47 17C47 14.2386 44.7614 12 42 12H5.50273C10.7722 4.72918 19.3338 0 29 0C45.0163 0 58 12.9837 58 29Z" fill="#0077FF"/>
    4 <path d="M82.546 19.128H71.206V27.024H81.16C82.798 27.024 84.1 28.284 84.1 29.88C84.1 31.518 82.798 32.82 81.16 32.82H71.206V42.018C71.206 43.992 69.61 45.588 67.678 45.588C65.704 45.588 64.15 43.992 64.15 42.018V16.818C64.15 14.844 65.704 13.29 67.678 13.29H82.546C84.184 13.29 85.486 14.55 85.486 16.188C85.486 17.826 84.184 19.128 82.546 19.128ZM87.4964 34.878V32.106C87.4964 24.714 92.3684 21.354 98.7944 21.354C105.22 21.354 110.134 24.714 110.134 32.106V34.878C110.134 42.27 105.22 45.63 98.7944 45.63C92.3684 45.63 87.4964 42.27 87.4964 34.878ZM94.5944 32.19V34.794C94.5944 38.784 96.0644 40.422 98.7944 40.422C101.524 40.422 103.036 38.784 103.036 34.794V32.19C103.036 28.2 101.524 26.562 98.7944 26.562C96.0644 26.562 94.5944 28.2 94.5944 32.19ZM114.504 42.228V24.798C114.504 22.866 115.974 21.354 117.906 21.354C119.796 21.354 121.35 22.866 121.35 24.798V25.638C122.61 23.16 124.542 21.48 126.768 21.48C128.7 21.48 129.498 22.782 129.498 24.756C129.498 27.906 127.524 28.2 126.18 28.242C123.282 28.368 121.434 31.056 121.35 35.55V42.228C121.35 44.16 119.796 45.63 117.906 45.63C115.974 45.63 114.504 44.16 114.504 42.228ZM147.043 42.228V32.82C147.043 29.124 146.035 27.402 143.137 27.402C140.701 27.402 139.315 29.334 139.315 33.072V42.228C139.315 44.16 137.761 45.63 135.871 45.63C133.939 45.63 132.469 44.16 132.469 42.228V24.798C132.469 22.866 133.939 21.354 135.871 21.354C137.761 21.354 139.315 22.866 139.315 24.798V24.924C140.701 22.74 142.759 21.354 145.951 21.354C149.815 21.354 152.209 22.992 153.259 26.016C154.645 23.202 156.829 21.354 160.525 21.354C165.985 21.354 168.463 24.546 168.463 30.426V42.228C168.463 44.16 166.909 45.63 165.019 45.63C163.087 45.63 161.617 44.16 161.617 42.228V32.82C161.617 29.124 160.609 27.402 157.711 27.402C155.401 27.402 154.015 29.166 153.889 32.526V42.228C153.889 44.16 152.335 45.63 150.445 45.63C148.513 45.63 147.043 44.16 147.043 42.228ZM173.526 42.228V24.798C173.526 22.866 174.996 21.354 176.928 21.354C178.818 21.354 180.372 22.866 180.372 24.798V42.228C180.372 44.16 178.818 45.63 176.928 45.63C174.996 45.63 173.526 44.16 173.526 42.228ZM173.526 15.768V14.634C173.526 12.786 175.038 11.358 176.928 11.358C178.776 11.358 180.372 12.786 180.372 14.634V15.768C180.372 17.7 178.818 19.17 176.928 19.17C174.996 19.17 173.526 17.7 173.526 15.768ZM196.253 21.354C198.605 21.354 201.293 21.732 203.015 22.908C203.939 23.538 204.485 24.462 204.485 25.68C204.485 27.024 203.435 28.242 202.007 28.242C201.797 28.242 201.587 28.242 201.377 28.158C200.033 27.822 198.731 26.898 196.925 26.898C193.691 26.898 191.801 28.704 191.801 32.19V34.794C191.801 38.196 193.691 40.086 196.883 40.086C198.773 40.086 200.033 39.078 201.545 38.7C201.713 38.616 201.881 38.574 202.091 38.574C203.519 38.574 204.443 39.876 204.443 41.052C204.443 42.27 203.897 43.194 203.015 43.824C201.335 45.084 198.857 45.63 196.127 45.63C188.441 45.63 184.703 41.598 184.703 34.668V32.316C184.703 25.554 188.189 21.354 196.253 21.354ZM207.18 34.878V32.106C207.18 24.714 212.052 21.354 218.478 21.354C224.904 21.354 229.818 24.714 229.818 32.106V34.878C229.818 42.27 224.904 45.63 218.478 45.63C212.052 45.63 207.18 42.27 207.18 34.878ZM214.278 32.19V34.794C214.278 38.784 215.748 40.422 218.478 40.422C221.208 40.422 222.72 38.784 222.72 34.794V32.19C222.72 28.2 221.208 26.562 218.478 26.562C215.748 26.562 214.278 28.2 214.278 32.19Z" fill="#0077FF"/>
    5 </g>
    6 <defs>
    7 <clipPath id="clip0_54_2">
    8 <rect width="230" height="58" fill="white"/>
    9 </clipPath>
    10 </defs>
     1<svg width="207" height="55" viewBox="0 0 207 55" fill="none" xmlns="http://www.w3.org/2000/svg">
     2<path d="M66.368 41V19.873C66.368 18.6643 66.553 17.653 66.923 16.839C67.293 16.025 67.7863 15.3837 68.403 14.915C69.0197 14.4463 69.698 14.1133 70.438 13.916C71.178 13.7187 71.9057 13.62 72.621 13.62C73.509 13.62 74.6067 13.6323 75.914 13.657C77.246 13.657 78.652 13.694 80.132 13.768C81.6367 13.842 83.0797 13.953 84.461 14.101V18.689H74.138C73.3733 18.689 72.7937 18.8987 72.399 19.318C72.029 19.7127 71.844 20.243 71.844 20.909V25.571L82.685 25.867V30.196L71.844 30.492V41H66.368ZM95.2508 41.185C93.6228 41.185 92.2292 41.0247 91.0698 40.704C89.9105 40.3587 88.9608 39.7913 88.2208 39.002C87.5055 38.2127 86.9752 37.1643 86.6298 35.857C86.3092 34.5497 86.1488 32.934 86.1488 31.01C86.1488 28.9873 86.3092 27.3223 86.6298 26.015C86.9752 24.683 87.5055 23.647 88.2208 22.907C88.9608 22.1423 89.9105 21.612 91.0698 21.316C92.2538 20.9953 93.6475 20.835 95.2508 20.835C96.9035 20.835 98.3095 20.9953 99.4688 21.316C100.628 21.6367 101.566 22.1793 102.281 22.944C103.021 23.684 103.551 24.72 103.872 26.052C104.217 27.3593 104.39 29.012 104.39 31.01C104.39 32.9833 104.23 34.636 103.909 35.968C103.588 37.2753 103.07 38.3113 102.355 39.076C101.64 39.8407 100.69 40.3833 99.5058 40.704C98.3465 41.0247 96.9282 41.185 95.2508 41.185ZM95.2508 36.819C95.9168 36.819 96.4718 36.7573 96.9158 36.634C97.3845 36.5107 97.7545 36.264 98.0258 35.894C98.3218 35.4993 98.5438 34.9073 98.6918 34.118C98.8398 33.3287 98.9138 32.2927 98.9138 31.01C98.9138 29.7027 98.8398 28.6667 98.6918 27.902C98.5438 27.1127 98.3218 26.533 98.0258 26.163C97.7545 25.7683 97.3845 25.5093 96.9158 25.386C96.4718 25.2627 95.9168 25.201 95.2508 25.201C94.6095 25.201 94.0545 25.2627 93.5858 25.386C93.1418 25.5093 92.7718 25.7683 92.4758 26.163C92.1798 26.533 91.9578 27.1127 91.8098 27.902C91.6865 28.6667 91.6248 29.7027 91.6248 31.01C91.6248 32.2927 91.6865 33.3287 91.8098 34.118C91.9578 34.9073 92.1798 35.4993 92.4758 35.894C92.7718 36.264 93.1418 36.5107 93.5858 36.634C94.0545 36.7573 94.6095 36.819 95.2508 36.819ZM108.023 41V21.131H112.241L113.499 24.165C114.214 23.2523 115.016 22.4753 115.904 21.834C116.817 21.1927 117.89 20.872 119.123 20.872C119.394 20.872 119.666 20.8843 119.937 20.909C120.233 20.9337 120.504 20.983 120.751 21.057V26.681C120.381 26.6317 119.986 26.5947 119.567 26.57C119.172 26.5207 118.79 26.496 118.42 26.496C117.705 26.496 117.051 26.5823 116.459 26.755C115.892 26.903 115.361 27.1373 114.868 27.458C114.399 27.754 113.943 28.1487 113.499 28.642V41H108.023ZM123.669 41V21.131H128.183L129.145 23.166C130.008 22.5247 130.945 21.9697 131.957 21.501C132.993 21.0323 134.263 20.798 135.768 20.798C137.026 20.798 138.062 21.057 138.876 21.575C139.714 22.093 140.343 22.7713 140.763 23.61C141.33 23.166 141.984 22.7343 142.724 22.315C143.488 21.8957 144.302 21.538 145.166 21.242C146.029 20.946 146.88 20.798 147.719 20.798C149.322 20.798 150.58 21.1063 151.493 21.723C152.43 22.315 153.084 23.166 153.454 24.276C153.824 25.3613 154.009 26.644 154.009 28.124V41H148.533V28.605C148.533 27.9637 148.409 27.4333 148.163 27.014C147.941 26.5947 147.62 26.274 147.201 26.052C146.781 25.83 146.276 25.719 145.684 25.719C144.944 25.719 144.191 25.8793 143.427 26.2C142.687 26.496 142.021 26.8537 141.429 27.273C141.478 27.5197 141.515 27.7663 141.54 28.013C141.564 28.235 141.577 28.4693 141.577 28.716V41H136.101V28.605C136.101 27.9637 135.977 27.4333 135.731 27.014C135.509 26.5947 135.188 26.274 134.769 26.052C134.349 25.83 133.844 25.719 133.252 25.719C132.734 25.719 132.228 25.7807 131.735 25.904C131.266 26.0273 130.81 26.2 130.366 26.422C129.946 26.644 129.539 26.903 129.145 27.199V41H123.669ZM158.769 18.208C158.251 18.208 157.992 17.9613 157.992 17.468V13.842C157.992 13.324 158.251 13.065 158.769 13.065H162.987C163.209 13.065 163.382 13.139 163.505 13.287C163.628 13.435 163.69 13.62 163.69 13.842V17.468C163.69 17.9613 163.456 18.208 162.987 18.208H158.769ZM158.103 41V21.131H163.579V41H158.103ZM175.52 41.222C174.311 41.222 173.189 41.0617 172.153 40.741C171.141 40.4203 170.266 39.89 169.526 39.15C168.786 38.3853 168.206 37.3617 167.787 36.079C167.392 34.7717 167.195 33.1313 167.195 31.158C167.195 29.1353 167.38 27.458 167.75 26.126C168.12 24.794 168.662 23.7457 169.378 22.981C170.118 22.1917 171.018 21.6367 172.079 21.316C173.139 20.9953 174.336 20.835 175.668 20.835C176.876 20.835 178.023 20.909 179.109 21.057C180.219 21.1803 181.378 21.4147 182.587 21.76V24.905H177.37C176.235 24.905 175.322 25.0777 174.632 25.423C173.941 25.7437 173.435 26.3603 173.115 27.273C172.819 28.161 172.671 29.4437 172.671 31.121C172.671 32.7737 172.819 34.0317 173.115 34.895C173.435 35.7583 173.941 36.338 174.632 36.634C175.347 36.93 176.284 37.078 177.444 37.078H182.883V40.186C182.266 40.3833 181.551 40.5683 180.737 40.741C179.923 40.889 179.059 41 178.147 41.074C177.259 41.1727 176.383 41.222 175.52 41.222ZM194.435 41.185C192.807 41.185 191.414 41.0247 190.254 40.704C189.095 40.3587 188.145 39.7913 187.405 39.002C186.69 38.2127 186.16 37.1643 185.814 35.857C185.494 34.5497 185.333 32.934 185.333 31.01C185.333 28.9873 185.494 27.3223 185.814 26.015C186.16 24.683 186.69 23.647 187.405 22.907C188.145 22.1423 189.095 21.612 190.254 21.316C191.438 20.9953 192.832 20.835 194.435 20.835C196.088 20.835 197.494 20.9953 198.653 21.316C199.813 21.6367 200.75 22.1793 201.465 22.944C202.205 23.684 202.736 24.72 203.056 26.052C203.402 27.3593 203.574 29.012 203.574 31.01C203.574 32.9833 203.414 34.636 203.093 35.968C202.773 37.2753 202.255 38.3113 201.539 39.076C200.824 39.8407 199.874 40.3833 198.69 40.704C197.531 41.0247 196.113 41.185 194.435 41.185ZM194.435 36.819C195.101 36.819 195.656 36.7573 196.1 36.634C196.569 36.5107 196.939 36.264 197.21 35.894C197.506 35.4993 197.728 34.9073 197.876 34.118C198.024 33.3287 198.098 32.2927 198.098 31.01C198.098 29.7027 198.024 28.6667 197.876 27.902C197.728 27.1127 197.506 26.533 197.21 26.163C196.939 25.7683 196.569 25.5093 196.1 25.386C195.656 25.2627 195.101 25.201 194.435 25.201C193.794 25.201 193.239 25.2627 192.77 25.386C192.326 25.5093 191.956 25.7683 191.66 26.163C191.364 26.533 191.142 27.1127 190.994 27.902C190.871 28.6667 190.809 29.7027 190.809 31.01C190.809 32.2927 190.871 33.3287 190.994 34.118C191.142 34.9073 191.364 35.4993 191.66 35.894C191.956 36.264 192.326 36.5107 192.77 36.634C193.239 36.7573 193.794 36.819 194.435 36.819Z" fill="#232323"/>
     3<path d="M43 0H12C5.37258 0 0 5.37258 0 12V43C0 49.6274 5.37258 55 12 55H43C49.6274 55 55 49.6274 55 43V12C55 5.37258 49.6274 0 43 0Z" fill="#5C31FE"/>
     4<path d="M30.8774 37.4257H27.4868C25.6714 37.4257 24.1998 38.8973 24.1998 40.7127C24.1998 42.5281 25.6714 43.9998 27.4868 43.9998H30.8774C32.6928 43.9998 34.1645 42.5281 34.1645 40.7127C34.1645 38.8973 32.6928 37.4257 30.8774 37.4257Z" fill="white"/>
     5<path d="M40.7128 24.2515H27.4869C25.6715 24.2515 24.1998 25.7231 24.1998 27.5385C24.1998 29.3539 25.6715 30.8256 27.4869 30.8256H40.7128C42.5282 30.8256 43.9998 29.3539 43.9998 27.5385C43.9998 25.7231 42.5282 24.2515 40.7128 24.2515Z" fill="white"/>
     6<path d="M44 14.3129C44 16.1506 42.5247 17.6259 40.6871 17.6259H27.1247C21.8706 17.6259 17.6259 21.8706 17.6259 27.1247V40.6871C17.6259 42.5247 16.1506 44 14.3129 44C12.4753 44 11 42.5247 11 40.6871V26.0894C11 17.7553 17.7553 11 26.0894 11H40.6871C42.5247 11 44 12.4753 44 14.3129Z" fill="white"/>
    117</svg>
  • formico/trunk/assets/js/formico_admin_js.js

    r3093701 r3187716  
    11; (function ($) {
    22    $(document).ready(function () {
    3         $("#formico_settings_form").on('submit', function (e) {
     3
     4        $('.formico__settings_form').on('submit', function (e) {
    45            e.preventDefault();
    56
    6             let saved = $('.formico_data_saved'),
    7                 button = $('.formico_save_form_data'),
    8                 task = $(this).serialize();
     7            let spinner         = $(this).find('.formico__spin'),
     8                toaster         = $(this).parent().parent().find('.formico__saved_notification'),
     9                content         = $(this).parent().parent().find('.formico__notification_content'),
     10                task            = $(this).serialize(),
     11                apiField        = $(this).parent().find('.api_key_field'),
     12                messageWrapper  = $(this).parent().find('.formico_validation_message'),
     13                validMessage    = $(this).find('.formico_setting_field').data('valid_message'),
     14                invalidMessage  = $(this).find('.formico_setting_field').data('invalid_message'),
     15                nonce           = $('#formico_settings_save_nonce').val();
     16                task            += "&nonce=" + nonce + "&action=formico_settings_save_nonce";
    917
    10             console.log(task);
    11 
    12             task += "&nonce=" + formico_data.nonce;
    13 
    14             $.post(formico_data.ajax_url + "?action=formico_admin_action", task, function (data) {
    15                 button.attr('disabled', true);
    16                 saved.addClass('active');
    17 
    18                 setTimeout(() => {
    19                     saved.removeClass('active');
    20                     button.attr('disabled', false);
    21                 }, 1500);
    22                
    23                 console.log(data);
     18            $.ajax({
     19                type: 'POST',
     20                url: formico_data.ajax_url,
     21                data: task,
     22                beforeSend: function(){
     23                    spinner.addClass('active');
     24                    console.log(validMessage);
     25                },
     26                success: function( response ) {
     27                    if( response.success === true ) {
     28                        content.removeClass('formico__error').addClass('formico__success');
     29                        content.find('p').html(response.data.message);
     30                        messageWrapper.html(validMessage);
     31                        apiField.removeClass('formico_input_feedback_failed').addClass('formico_input_feedback_success');
     32                    } else {
     33                        content.removeClass('formico__success').addClass('formico__error');
     34                        content.find('p').html(response.data.message);
     35                        messageWrapper.html(invalidMessage);
     36                        apiField.removeClass('formico_input_feedback_success').addClass('formico_input_feedback_failed');
     37                    }
     38                    toaster.addClass('open');
     39                },
     40                complete: function(){
     41                    spinner.removeClass('active');
     42                    setTimeout(() => {
     43                        toaster.removeClass('open');
     44                    }, 2000);
     45                }
    2446            });
    2547        });
    2648
    27         /* Tab */
     49        $('.formico__addons_form').on('submit', function( e ) {
     50            e.preventDefault();
     51
     52            var spinner = $(this).find('.formico__spin');
     53            var toaster = $(this).parent().parent().find('.formico__saved_notification');
     54            var content = $(this).parent().parent().find('.formico__notification_content');
     55            var task = $(this).serialize();
     56                task += "&action=formico_addons_action";
     57
     58            $.ajax({
     59                type: 'POST',
     60                url: formico_data.ajax_url,
     61                data: task,
     62                beforeSend: function(){
     63                    spinner.addClass('active');
     64                },
     65                success: function( response ) {
     66                    toaster.addClass('open');
     67                    content.addClass('formico__success');
     68                },
     69                complete: function() {
     70                    spinner.removeClass('active');
     71                    setTimeout(() => {
     72                        toaster.removeClass('open');
     73                        toaster.removeClass('formico__success');
     74                    }, 2000);
     75                }
     76            });
     77
     78        });
    2879
    2980    });
  • formico/trunk/assets/js/tabscroll.js

    r3093701 r3187716  
    77   
    88    // adds the active class to the first tab-navigation
    9     jQuery(jQuerytabscroll_anchors[0]).parent().addClass("tabscroll_activeNavi");
     9    jQuery(jQuerytabscroll_anchors[0]).parent().addClass("active");
    1010
    1111    for (jQueryi = 0; jQueryi < jQuerytabscroll_anchors.length; jQueryi++){
     
    8181
    8282            // removes any active navi class from natigation
    83             jQuery("[data-tabscrollnavi]").removeClass("tabscroll_activeNavi");
     83            jQuery("[data-tabscrollnavi]").removeClass("active");
    8484            // and sets one only on the link's parent that was clicked.
    85             jQuery("[data-tabscrollnavi='"+jQuerylocation+"']").addClass("tabscroll_activeNavi");
     85            jQuery("[data-tabscrollnavi='"+jQuerylocation+"']").addClass("active");
    8686        }
    8787    // triggers the hashchange manually on pageload. Adapted from http://stackoverflow.com/questions/20652020/the-hashchange-event-of-jquery-doesnt-work-if-i-open-a-page-with-hash-directly
  • formico/trunk/formico.php

    r3093701 r3187716  
    22
    33/**
    4  * Plugin Name: Formico
    5  * Plugin Url: https://pluginscafe.com/
    6  * Description: Formico adds some extensions and fields that allow users to add to the Elementor form widgets.
     4 * Plugin Name: Formico - Elementor Form Extensions, Fields & Integrations
     5 * Plugin Url: https://formico.net/
     6 * Description: Formico adds some extensions, fields and integrations that allow users to add to the Elementor form widgets.
    77 * Author: KaisarAhmmed
    88 * Author URI: https://pluginscafe.com/
    9  * Version: 1.0.0
     9 * Version: 1.0.1
    1010 * Requires at least: 5.4
    1111 * Requires PHP: 5.6
     
    3131        return trailingslashit(plugin_dir_path(__FILE__)) . 'includes/';
    3232    }
    33    
     33
    3434    private function __construct() {
    3535        $this->define_constants();
     36        require_once FORMICO_PATH . '/includes/core/common.php';
    3637
    3738        // Init required modules.
    38         add_action('init', array($this, 'init'), -999);
     39        add_action('init', [$this, 'init'], -999);
    3940
    4041        add_action('plugins_loaded', [$this, 'init_plugin']);
    4142
     43        add_action('activated_plugin', [$this, 'formico_activation_redirect']);
     44
    4245        // Register activation and deactivation hook.
    43         register_activation_hook(__FILE__,   array($this, 'activation'));
    44         register_deactivation_hook(__FILE__, array($this, 'deactivation'));
     46        register_activation_hook(__FILE__,   [$this, 'activation']);
     47        register_deactivation_hook(__FILE__, [$this, 'deactivation']);
    4548    }
    4649
     
    7376
    7477        Formico\Config\Build_Field::instance();
     78        Formico\Config\Build_Integration::instance();
    7579    }
    7680
     
    96100    }
    97101
     102    public function formico_activation_redirect() {
     103
     104        if (get_transient('formico_dashboard_redirect')) {
     105            return;
     106        }
     107
     108        set_transient('formico_dashboard_redirect', true, 10 * DAY_IN_SECONDS);
     109
     110        if (isset($_GET['activate-multi']) && $_GET['activate-multi'] !== '') {
     111            return;
     112        }
     113
     114        wp_safe_redirect(admin_url('admin.php?page=formico'));
     115        die();
     116    }
     117
    98118    /**
    99119     * Show recommended plugins notice.
     
    110130
    111131        $message = sprintf(
     132            /* translators: 1: Name of plugin 2: Elementor Pro */
    112133            esc_html__(
    113134                '"%1$s" requires "%2$s" to be installed and activated.',
     
    118139        );
    119140
    120         printf('<div class="notice notice-warning is-dismissible"><p>%s</p></div>', wp_kses_post($message));
     141        printf('<div class="notice kaise notice-warning is-dismissible"><p>%s</p></div>', wp_kses_post($message));
    121142    }
    122143
  • formico/trunk/includes/admin/ajax.php

    r3093701 r3187716  
    88
    99    public function __construct() {
    10         add_action('wp_ajax_formico_admin_action', array($this, 'formico_admin_action'));
     10        add_action('wp_ajax_formico_addons_action', array($this, 'formico_addons_action'));
     11        add_action('wp_ajax_formico_settings_save_nonce', array($this, 'formico_settings_save_nonce'));
    1112        $this->utils = Utils::instance();
    1213    }
    1314
    14     public function formico_admin_action() {
     15    public function formico_settings_save_nonce() {
     16        if (!isset($_POST['formico_settings_save_nonce']) || !wp_verify_nonce(sanitize_key(wp_unslash($_POST['formico_settings_save_nonce'])), 'formico_settings_save_nonce')) {
     17            return;
     18        }
    1519
    16         if (!isset($_POST['nonce']) || !wp_verify_nonce(sanitize_key(wp_unslash($_POST['nonce'])), 'formico_save_fields')) {
     20        if (isset($_POST['key'])) {
     21            $data = $_POST;
     22            unset($data['formico_settings_save_nonce']);
     23            unset($data['_wp_http_referer']);
     24            unset($data['key']);
     25            unset($data['nonce']);
     26            $this->utils->save_settings(sanitize_key(wp_unslash($_POST['key'])), $data);
     27            if (! isset($_POST['connection_checker']) && ! sanitize_text_field(wp_unslash($_POST['connection_checker']))) {
     28                wp_send_json_success(['message' => 'Your changes have been saved sucessfully.']);
     29            }
     30        }
     31
     32        do_action('formico_api_connection_check', $_POST);
     33
     34        die();
     35    }
     36
     37    public function formico_addons_action() {
     38
     39        if (!isset($_POST['formico_addons_nonce']) || !wp_verify_nonce(sanitize_key(wp_unslash($_POST['formico_addons_nonce'])), 'formico_addons_nonce')) {
    1740            return;
    1841        }
     
    2043        if (isset($_POST['extension_list'])) {
    2144            $active_extension = map_deep(wp_unslash($_POST['extension_list']), 'sanitize_text_field');
    22 
    23             print_r($active_extension);
    2445
    2546            $this->utils->save_in_option('active_extension', $active_extension);
     
    2950            $active_field = map_deep(wp_unslash($_POST['field_list']), 'sanitize_text_field');
    3051
    31             print_r($active_field);
    32 
    3352            $this->utils->save_in_option('active_field', $active_field);
    3453        }
    3554
    36         if (isset($_POST['user_data'])) {
    37             $user_setting = map_deep(wp_unslash($_POST['user_data']), 'sanitize_text_field');
     55        if (isset($_POST['integration_list'])) {
     56            $active_field = map_deep(wp_unslash($_POST['integration_list']), 'sanitize_text_field');
    3857
    39             print_r($user_setting);
    40 
    41             $this->utils->save_in_option('user_setting', $user_setting);
     58            $this->utils->save_in_option('active_integration', $active_field);
    4259        }
    4360
  • formico/trunk/includes/admin/menu.php

    r3093701 r3187716  
    33namespace Formico\Admin;
    44
     5use Formico\Core\Settings as CoreSettings;
     6
    57class Menu {
     8    public $utils;
    69
    7     public $utils;
     10    public $settings;
    811
    912    function __construct() {
    1013        $this->utils = Utils::instance();
     14        $this->settings = Settings::instance();
    1115        new Ajax();
    1216
    1317        add_action('admin_menu', [$this, 'admin_menu']);
    14         add_action('admin_enqueue_scripts', array($this, 'admin_assets'));
     18        add_action('admin_enqueue_scripts', [$this, 'admin_assets']);
     19        add_filter('admin_footer_text', [$this, 'admin_footer'], 1, 2);
    1520    }
    1621
     
    1823        $parent_slug    = 'formico';
    1924        $capability     = 'manage_options';
     25        $icon_url           = FORMICO_AEESTS . '/images/icon.svg';
    2026
    21         add_menu_page(__('Formico', 'formico'), __('Formico', 'formico'), $capability, $parent_slug, [$this, 'plugin_page'], 'dashicons-embed-generic');
     27        add_menu_page(__('Formico', 'formico'), __('Formico', 'formico'), $capability, $parent_slug, [$this, 'plugin_page'], $icon_url, '59');
     28        add_submenu_page($parent_slug, __('All Addons', 'formico'), __('All Addons', 'formico'), $capability, $parent_slug, [$this, 'plugin_page']);
     29        add_submenu_page($parent_slug, __('Settings', 'formico'), __('Settings', 'formico'), $capability, 'formico_settings', [$this, 'settings_page']);
    2230    }
    2331
    2432
    2533    public function plugin_page() {
    26         include FORMICO_PATH . '/includes/view/settings.php';
     34        $this->settings->dashboard_page();
     35    }
     36
     37    public function settings_page() {
     38        CoreSettings::settings_page();
    2739    }
    2840
    2941    public function admin_assets() {
    3042
    31         wp_enqueue_style('formico_admin_css', FORMICO_AEESTS . '/css/formico_admin.css', '', FORMICO_VERSION);
     43        wp_enqueue_style('formico_admin_css', FORMICO_AEESTS . '/css/formico_admin.css', array(), FORMICO_VERSION);
    3244
    33         wp_enqueue_script('formico_tabs', FORMICO_AEESTS . '/js/tabscroll.js', array('jquery'), FORMICO_VERSION);
    34         wp_enqueue_script('formico_admin_js', FORMICO_AEESTS . '/js/formico_admin_js.js', array('jquery'), FORMICO_VERSION);
    35 
    36         $nonce = wp_create_nonce('formico_save_fields');
     45        wp_enqueue_script('formico_tabs', FORMICO_AEESTS . '/js/tabscroll.js', array('jquery'), FORMICO_VERSION, true);
     46        wp_enqueue_script('formico_admin_js', FORMICO_AEESTS . '/js/formico_admin_js.js', array('jquery'), time(), true);
    3747
    3848        wp_localize_script(
    3949            'formico_admin_js',
    4050            'formico_data',
    41             array('ajax_url' => admin_url('admin-ajax.php'), 'nonce' => $nonce)
     51            array('ajax_url' => admin_url('admin-ajax.php'))
    4252        );
    4353    }
     54
     55    public function admin_footer($text) {
     56        global $current_screen;
     57
     58        if (! empty($current_screen->id) && strpos($current_screen->id, 'formico') !== false) {
     59            $url  = 'https://wordpress.org/support/plugin/formico/reviews/#new-post';
     60            $text = sprintf(
     61                wp_kses(
     62                    /* translators: $1$s - WPForms plugin name; $2$s - WP.org review link; $3$s - WP.org review link. */
     63                    __('Thank you for using %1$s. Please rate us <a href="%2$s" target="_blank" rel="noopener noreferrer">&#9733;&#9733;&#9733;&#9733;&#9733;</a> on <a href="%3$s" target="_blank" rel="noopener">WordPress.org</a> to boost our motivation.', 'formico'),
     64                    array(
     65                        'a' => array(
     66                            'href'   => array(),
     67                            'target' => array(),
     68                            'rel'    => array(),
     69                        ),
     70                    )
     71                ),
     72                '<strong>Formico - Elementor Form Extensions, Fields & Integrations</strong>',
     73                $url,
     74                $url
     75            );
     76        }
     77
     78        return $text;
     79    }
    4480}
  • formico/trunk/includes/admin/utils.php

    r3093701 r3187716  
    55class Utils {
    66    public static $instance = null;
    7     private static $key     = 'formico_options';
     7    private static $key     = 'formico_addons';
     8
     9    private static $prefix = 'formico_';
    810
    911    public static function make_classname($dirname) {
     
    2931        $data_all           = get_option(self::$key);
    3032        $data_all[$key]     = $value;
    31         update_option('formico_options', $data_all);
    32     }
    33 
    34     public function inputField($input_options) {
    35         $default = array(
    36             'type'      => null,
     33        update_option(self::$key, $data_all);
     34    }
     35
     36    public function addons($options) {
     37        $default = [
    3738            'name'      => '',
    3839            'value'     => '',
    39             'class'     => '',
     40            'status'    => '',
    4041            'label'     => '',
    4142            'attr'      => false,
    42             'options'   => array(),
    43         );
    44 
    45         $input_options = array_merge($default, $input_options);
    46 
    47         if (file_exists(FORMICO_PATH . '/includes/view/controls/' . $input_options['type'] . '.php')) {
    48             extract($input_options);
    49             include FORMICO_PATH . '/includes/view/controls/' . $input_options['type'] . '.php';
     43            'options'   => [],
     44        ];
     45
     46        $options = array_merge($default, $options);
     47
     48        if (file_exists(FORMICO_PATH . '/includes/view/components/single_addon.php')) {
     49            extract($options);
     50            include FORMICO_PATH . '/includes/view/components/single_addon.php';
    5051        }
    5152    }
     
    342343    }
    343344
     345    public function save_settings($key, $data) {
     346        update_option(self::$prefix . $key, $data);
     347    }
     348
     349    public function formico_get_settings($key) {
     350        return get_option(self::$prefix . $key, []);
     351    }
     352
    344353    public static function instance() {
    345354
  • formico/trunk/includes/config/build_field.php

    r3093701 r3187716  
    66
    77class Build_Field {
     8    use \Formico\Traits\Helper;
    89
    910    private static $instance = null;
     
    2425        foreach ($this->fields as $field) {
    2526
    26             $field_dir = \Formico_Elementor::field_dir() . 'fields/' . $field['slug'] . '/';
     27            $field_dir = isset($field['path']) ? $field['path'] : \Formico_Elementor::field_dir() . 'fields/' . $field['slug'] . '/';
     28
     29            // echo $field_dir . '<br>';
    2730
    2831            if (!file_exists($field_dir . $field['slug'] . '.php')) {
     
    4144        }
    4245    }
    43 
    44     public static function instance() {
    45         // If the single instance hasn't been set, set it now.
    46         if (null == self::$instance) {
    47             self::$instance = new self();
    48         }
    49 
    50         return self::$instance;
    51     }
    5246}
  • formico/trunk/includes/config/enqueue_scripts.php

    r3093701 r3187716  
    77class Enqueue_Scripts {
    88
    9     function __construct() {
    10         add_action('wp_enqueue_scripts', [$this, 'formico_frontend_js']);
    11         add_action('wp_enqueue_scripts', [$this, 'formico_frontend_css'], 99);
     9    public function __construct() {
     10        add_action('wp_enqueue_scripts', [$this, 'frontend_js']);
     11        add_action('wp_enqueue_scripts', [$this, 'frontend_css'], 99);
     12        add_action('admin_enqueue_scripts', [$this, 'admin_css'], 99);
     13        add_action('elementor/frontend/after_enqueue_scripts', [$this, 'elementor_js']);
    1214    }
    1315
    14     public function formico_frontend_js() {
    15         wp_register_script('frmc_intlTelInput', FORMICO_AEESTS . '/js/lib/intlTelInput-jquery.min.js', array(), FORMICO_VERSION, true);
    16         wp_register_script('frmc_utils', FORMICO_AEESTS . '/js/lib/utils.js', array(), FORMICO_VERSION, true);
    17         wp_register_script('frmc_active', FORMICO_AEESTS . '/js/formico_active.js', array(), FORMICO_VERSION, true);
    18         wp_register_script('frmc_noUiSlider', FORMICO_AEESTS . '/js/lib/nouislider.min.js', array(), FORMICO_VERSION, true);
    19         wp_register_script('frmc_mask', FORMICO_AEESTS . '/js/lib/jquery.mask.js', array(), FORMICO_VERSION, true);
    20         wp_register_script('frmc_wNumb', FORMICO_AEESTS . '/js/lib/wNumb.js', array(), FORMICO_VERSION, true);
    21 
    22         wp_register_script('formico_range', FORMICO_AEESTS . '/js/range.js', array('jquery'), FORMICO_VERSION, true);
    23 
    24         wp_localize_script('frmc_active', 'formico_util_scripts', array(
    25             'utilsScript' => FORMICO_AEESTS . '/js/lib/utils.js'
    26         ));
     16    public function admin_css() {
     17        wp_enqueue_style('formico_fonts', FORMICO_AEESTS . '/css/style.css', array(), FORMICO_VERSION);
    2718    }
    2819
     20    public function frontend_css() {
     21        wp_register_style('formico_intlTelInput', FORMICO_AEESTS . '/css/lib/intlTelInput.min.css', array(), FORMICO_VERSION);
     22        wp_register_style('formico_noUiSlider', FORMICO_AEESTS . '/css/lib/nouislider.min.css', array(), FORMICO_VERSION);
     23        wp_register_style('formico_style', FORMICO_AEESTS . '/css/formico_style.css', array(), FORMICO_VERSION);
     24        wp_register_style('formico_signature_pad', FORMICO_AEESTS . '/css/lib/signature-pad.css', array(), FORMICO_VERSION);
     25    }
    2926
    30     public function formico_frontend_css() {
    31         wp_register_style('frmc_intlTelInput', FORMICO_AEESTS . '/css/lib/intlTelInput.min.css', array(), FORMICO_VERSION);
    32         wp_register_style('frmc_noUiSlider', FORMICO_AEESTS . '/css/lib/nouislider.min.css', array(), FORMICO_VERSION);
    33         wp_register_style('frmc_style', FORMICO_AEESTS . '/css/formico_style.css', array(), FORMICO_VERSION);
     27    public function frontend_js() {
     28        wp_register_script('formico_intlTelInput', FORMICO_AEESTS . '/js/lib/intlTelInputWithUtils.min.js', array('jquery'), FORMICO_VERSION, true);
     29        wp_register_script('formico_noUiSlider', FORMICO_AEESTS . '/js/lib/nouislider.min.js', array(), FORMICO_VERSION, true);
     30        wp_register_script('brevo_field', FORMICO_AEESTS . '/js/brevo.js', array('jquery'), time(), true);
     31        wp_register_script('formico_mask', FORMICO_AEESTS . '/js/lib/jquery.mask.js', array(), FORMICO_VERSION, true);
     32        wp_register_script('formico_wNumb', FORMICO_AEESTS . '/js/lib/wNumb.js', array(), FORMICO_VERSION, true);
     33        wp_register_script('formico_im', FORMICO_AEESTS . '/js/formico_mask.js', array('elementor-frontend', 'jquery', 'formico_mask'), FORMICO_VERSION, true);
     34        wp_register_script('formico_signature_pad', FORMICO_AEESTS . '/js/lib/signature_pad.umd.min.js', array('jquery'), FORMICO_VERSION, true);
     35    }
     36
     37    public function elementor_js() {
     38        wp_register_script('formico_range', FORMICO_AEESTS . '/js/formico_range.js', array('elementor-frontend', 'jquery', 'formico_noUiSlider'), FORMICO_VERSION, true);
     39        wp_register_script('formico_sp', FORMICO_AEESTS . '/js/sp.js', array('elementor-frontend', 'jquery', 'formico_signature_pad'), FORMICO_VERSION, true);
     40        wp_register_script('formico_spf', FORMICO_AEESTS . '/js/formico_spf.js', ['elementor-frontend', 'jquery', 'formico_intlTelInput'], FORMICO_VERSION, true);
    3441    }
    3542}
  • formico/trunk/includes/config/extension_list.php

    r3093701 r3187716  
    1212                'slug'      =>  'input-mask',
    1313                'title'     =>  'Input Mask',
    14                 'package'   =>  'free'
     14                'package'   =>  'free',
     15                'status'    =>  'updated'
    1516            ),
    1617            'address_ac_free' => array(
    1718                'slug'      =>  'address-autocomplete',
    1819                'title'     =>  'Address Auto Complete',
    19                 'package'   =>  'free'
     20                'package'   =>  'free',
     21                'status'    =>  'updated'
    2022            )
    2123        ));
  • formico/trunk/includes/config/field_list.php

    r3093701 r3187716  
    1212                'slug'      =>  'smart-phone-field',
    1313                'title'     =>  'Smart Phone Field',
    14                 'package'   =>  'free'
     14                'package'   =>  'free',
     15                'status'    =>  'updated',
     16                'is_pro'    =>   true
    1517            ),
    1618            'range_slider' => array(
    1719                'slug'      =>  'range-slider',
    18                 'title'     =>  'Range Slider',
    19                 'package'   =>  'free'
     20                'title'     =>  'Range Slider Field',
     21                'package'   =>  'free',
     22                'status'    =>  'updated'
     23            ),
     24            'signature' => array(
     25                'slug'      =>  'signature',
     26                'title'     =>  'Signature Field',
     27                'package'   =>  'free',
     28                'status'    =>  'new'
    2029            )
    2130        ));
  • formico/trunk/includes/extensions/address-autocomplete/address-autocomplete.php

    r3093701 r3187716  
    88
    99use Formico\Admin\Utils;
     10use Formico\Core\Extension_Base;
     11use Formico\Core\Formico_Common;
    1012
    11 class Formico_Address_Autocomplete {
     13class Formico_Address_Autocomplete extends Extension_Base {
     14
     15    public function get_name() {
     16        return 'gaa';
     17    }
     18
     19    public function get_label() {
     20        return 'Google API Key';
     21    }
     22
    1223    private $utils;
    13     private $map_key;
     24    private $map_key = '';
    1425
    1526    public $allowed_fields = [
     
    1829
    1930    public function __construct() {
    20         $this->utils = Utils::instance();
    21         $this->map_key = $this->utils->get_in_option('user_setting')['google_api']['map_key'];
     31        parent::__construct();
    2232
    23         add_action('wp_enqueue_scripts', [$this, 'formico_gaa_script']);
    24         add_action('elementor/element/form/section_form_fields/before_section_end', [$this, 'formico_add_gaa'], 100, 2);
    25         add_filter('elementor_pro/forms/render/item', [$this, 'formico_gaa_atributes'], 10, 3);
     33        // $this->utils = Utils::instance();
     34
     35        $settings   = $this->get_plugin_settings();
     36        $this->map_key = $settings['gaa_api_key'] ?? '';
     37
     38        add_action('elementor/frontend/after_enqueue_scripts', array($this, 'gaa_script'));
     39        add_action('elementor/element/form/section_form_fields/before_section_end', [$this, 'add_gaa_control'], 100, 2);
     40        add_filter('elementor_pro/forms/render/item', [$this, 'add_gaa_attributes'], 10, 3);
    2641    }
    2742
    28     public function formico_add_gaa($element, $args) {
     43    public function plugin_settings_fields() {
     44        return [
     45            [
     46                'id'        => 'section_api_key',
     47                'title'     => esc_html__('Google Map API Key', 'formico'),
     48                'class'     => 'formico__settings_panel_full',
     49                'fields'    => [
     50                    [
     51                        'name'  => 'gaa_api_key',
     52                        'label' => esc_html__('API Key', 'formico'),
     53                        'type'  => 'text',
     54                        'placeholder' => esc_html__('Add your google map api key', 'formico'),
     55                    ]
     56                ]
     57            ]
     58        ];
     59    }
     60
     61    public function get_menu_icon() {
     62        return 'icon-map-pin';
     63    }
     64
     65    public function add_gaa_control($element, $args) {
    2966        $elementor = ElementorPlugin::instance();
    3067        $control_data = $elementor->controls_manager->get_control_from_stack($element->get_name(), 'form_fields');
     
    4178                [
    4279                    'label' => esc_html__('Google Map API Key', 'formico'),
    43                     'type' => \Elementor\Controls_Manager::RAW_HTML,
     80                    'type' => ElementorControls::RAW_HTML,
    4481                    'raw' => esc_html__('Please add your google map api key.', 'formico'),
    4582                    'tab'           => 'content',
     
    6299
    63100            $gaa->add_control(
    64                 'frmc_enable_gaa',
     101                'formico_enable_gaa',
    65102                [
    66103                    'label'         =>  esc_html__('Address AutoComplete', 'formico'),
    67                     'name'          => 'frmc_enable_gaa',
     104                    'name'          => 'formico_enable_gaa',
    68105                    'type'          =>  ElementorControls::SWITCHER,
    69106                    'default'       => '',
     
    85122
    86123            $gaa->add_control(
    87                 'frmc_gaaa_type',
    88                 [
    89                     'label'         =>  esc_html__('Address Type', 'formico'),
    90                     'name'          => 'frmc_gaaa_type',
    91                     'type'          =>  ElementorControls::SELECT,
    92                     'options'       =>  [
    93                         'geocode'           => esc_html__('GeoCode', 'formico'),
    94                         'establishment'     => esc_html__('Establishment', 'formico'),
    95                         'address'           => esc_html__('Address', 'formico'),
    96                         '(regions)'         => esc_html__('Regions', 'formico'),
    97                         '(cities)'          => esc_html__('Cities', 'formico'),
    98                     ],
    99                     'default'       => 'geocode',
    100                     'tab'           => 'content',
    101                     'inner_tab'     => 'form_fields_content_tab',
    102                     'tabs_wrapper'  => 'form_fields_tabs',
    103                     'conditions'    => [
    104                         'terms' => [
    105                             [
    106                                 'name' => 'field_type',
    107                                 'operator' => 'in',
    108                                 'value' => $this->allowed_fields,
    109                             ]
    110                         ],
    111                     ],
    112                     'condition' => ['frmc_enable_gaa' => 'yes']
    113                 ]
    114             );
    115 
    116 
    117             $gaa->add_control(
    118                 'frmc_gaa_country',
     124                'formico_gaa_country',
    119125                [
    120126                    'label'         =>  esc_html__('Country', 'formico'),
    121                     'name'          => 'frmc_gaa_country',
     127                    'name'          => 'formico_gaa_country',
    122128                    'type'          =>  ElementorControls::SELECT,
    123                     'options'       =>  $this->utils->get_countries(),
     129                    'options'       =>  Formico_Common::get_countries(),
    124130                    'default'       => 'US',
    125131                    'tab'           => 'content',
     
    135141                        ],
    136142                    ],
    137                     'condition' => ['frmc_enable_gaa' => 'yes']
     143                    'condition' => ['formico_enable_gaa' => 'yes']
    138144
    139145                ]
     
    169175
    170176
    171     public function formico_gaa_atributes($field, $field_index, $form_widget) {
     177    public function add_gaa_attributes($field, $field_index, $form_widget) {
    172178
    173         if (isset($field['frmc_enable_gaa']) && $field['frmc_enable_gaa'] == 'yes' && !empty($this->map_key)) {
     179        if (isset($field['formico_enable_gaa']) && $field['formico_enable_gaa'] == 'yes' && !empty($this->map_key)) {
    174180            $form_widget->add_render_attribute('input' . $field_index, 'class', 'formico_gaa');
    175181
    176             if (isset($field['frmc_gaaa_type'])) {
    177                 $form_widget->add_render_attribute('input' . $field_index, 'data-frmc_gaaa_type', $field['frmc_gaaa_type']);
    178             }
    179 
    180             if (isset($field['frmc_gaa_country'])) {
    181                 $form_widget->add_render_attribute('input' . $field_index, 'data-frmc_gaa_country', $field['frmc_gaa_country']);
     182            if (isset($field['formico_gaa_country'])) {
     183                $form_widget->add_render_attribute('input' . $field_index, 'data-gaa_country', $field['formico_gaa_country']);
    182184            }
    183185        }
     
    186188    }
    187189
    188     public function formico_gaa_script() {
    189 
    190         if (empty($this->map_key)) {
     190    public function gaa_script() {
     191        if ($this->map_key == '') {
    191192            return;
    192193        }
    193 
    194         wp_register_script('frmc_map_api', 'https://maps.googleapis.com/maps/api/js?v=3.exp&key=' . $this->map_key . '&libraries=places');
    195 
    196         wp_enqueue_script('frmc_map_api');
    197         wp_enqueue_script('frmc_active');
     194        wp_enqueue_script('formico_gaa_map', 'https://maps.googleapis.com/maps/api/js?v=3.exp&key=' . $this->map_key . '&libraries=places', array('jquery'), FORMICO_VERSION, false);
     195        wp_enqueue_script('formico_gaa', FORMICO_AEESTS . '/js/formico_gaa.js', array('elementor-frontend', 'jquery'), FORMICO_VERSION, true);
    198196    }
    199197}
  • formico/trunk/includes/extensions/input-mask/input-mask.php

    r3093701 r3187716  
    1313
    1414    public function __construct() {
    15         add_action('wp_enqueue_scripts', [$this, 'formico_input_mask']);
    16         add_action('elementor/element/form/section_form_fields/before_section_end', [$this, 'formico_add_mask_control'], 100, 2);
    17         add_filter('elementor_pro/forms/render/item', [$this, 'formico_add_mask_data'], 10, 3);
     15        add_action('elementor/frontend/after_enqueue_scripts', [$this, 'input_mask']);
     16        add_action('elementor/element/form/section_form_fields/before_section_end', [$this, 'add_mask_control'], 100, 2);
     17        add_filter('elementor_pro/forms/render/item', [$this, 'add_mask_data'], 10, 3);
    1818    }
    1919
    20     public function formico_add_mask_control($element, $args) {
     20    public function add_mask_control($element, $args) {
    2121
    2222        $elementor = ElementorPlugin::instance();
     
    3636            'options' => [
    3737                'mask' => __('Select Mask', 'formico'),
    38                 'frmc-tel_ddd' => __('Phone (8 dig) + DDD', 'formico'),
    39                 'frmc-tel_ddd9' => __('Phone (9 dig) + DDD', 'formico'),
    40                 'frmc-tel_us' => __('Phone USA', 'formico'),
    41                 'frmc-cpf' => __('CPF', 'formico'),
    42                 'frmc-cnpj' => __('CNPJ', 'formico'),
    43                 'frmc-money' => __('Money', 'formico'),
    44                 'frmc-ccard' => __('Credit Card', 'formico'),
    45                 'frmc-ccard_valid' => __('Credit Card Date', 'formico'),
    46                 'frmc-cep' => __('CEP', 'formico'),
    47                 'frmc-time' => __('Time', 'formico'),
    48                 'frmc-date' => __('Date', 'formico'),
    49                 'frmc-date_time' => __('Date and Time', 'formico'),
    50                 'frmc-ip_address' => __('IP Address', 'formico'),
     38                'f_tel_ddd' => __('Phone (8 dig) + DDD', 'formico'),
     39                'f_tel_ddd9' => __('Phone (9 dig) + DDD', 'formico'),
     40                'f_tel_us' => __('Phone USA', 'formico'),
     41                'f_cpf' => __('CPF', 'formico'),
     42                'f_cnpj' => __('CNPJ', 'formico'),
     43                'f_money' => __('Money', 'formico'),
     44                'f_ccard' => __('Credit Card', 'formico'),
     45                'f_ccard_valid' => __('Credit Card Date', 'formico'),
     46                'f_cep' => __('CEP', 'formico'),
     47                'f_time' => __('Time', 'formico'),
     48                'f_date' => __('Date', 'formico'),
     49                'f_date_time' => __('Date and Time', 'formico'),
     50                'f_ip_address' => __('IP Address', 'formico'),
    5151            ],
    5252            'conditions' => [
     
    6262
    6363        $mask_control = new ElementorRepeater();
    64         $mask_control->add_control('frmc_mask_control', $new_control);
     64        $mask_control->add_control('formico_mask_control', $new_control);
    6565
    6666        $pattern_field = $mask_control->get_controls();
     
    9292    }
    9393
    94     public function formico_add_mask_data($field, $field_index, $form_widget) {
     94    public function add_mask_data($field, $field_index, $form_widget) {
    9595
    96         if (!empty($field['frmc_mask_control']) && in_array($field['field_type'], $this->allowed_fields) && $field['frmc_mask_control'] != 'mask') {
     96        if (!empty($field['formico_mask_control']) && in_array($field['field_type'], $this->allowed_fields) && $field['formico_mask_control'] != 'mask') {
    9797
    98             $form_widget->add_render_attribute('input' . $field_index, 'data-frmc_mask', $field['frmc_mask_control']);
     98            $form_widget->add_render_attribute('input' . $field_index, 'data-input_mask', $field['formico_mask_control']);
    9999            $form_widget->add_render_attribute('input' . $field_index, 'class', 'formico_input_mask');
    100100        }
     
    103103    }
    104104
    105     public function formico_input_mask() {
    106         wp_enqueue_script('frmc_mask');
    107         wp_enqueue_script('frmc_active');
     105    public function input_mask() {
     106        wp_enqueue_script('formico_mask');
     107        wp_enqueue_script('formico_im');
    108108    }
    109109}
  • formico/trunk/includes/fields/range-slider/range-slider.php

    r3093701 r3187716  
    88use Elementor\Controls_Manager;
    99use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
     10use Elementor\Repeater;
    1011
    1112class Formico_Range_slider extends \ElementorPro\Modules\Forms\Fields\Field_Base {
    12     public $depended_scripts = [
    13         'frmc_noUiSlider',
    14         'frmc_wNumb',
    15         'frmc_active'
    16     ];
    17 
    18     public $depended_styles = [
    19         'frmc_noUiSlider'
    20     ];
     13
     14    public $depended_scripts = ['formico_noUiSlider', 'formico_wNumb', 'formico_range'];
     15    public $depended_styles = ['formico_noUiSlider'];
    2116
    2217    public function get_type() {
    23         return 'frmc_range';
     18        return 'formico_range';
    2419    }
    2520
     
    2823    }
    2924
     25    public function __construct() {
     26        parent::__construct();
     27
     28        add_action('elementor/element/form/section_form_style/before_section_end', [$this, 'formico_add_style_controls'], 10, 2);
     29        add_action('elementor/preview/init', [$this, 'editor_preview_footer']);
     30    }
    3031
    3132    public function render($item, $item_index, $form) {
     
    3940        );
    4041
    41         if (filter_var($item['frmc_range_min_value'], FILTER_VALIDATE_INT)) {
    42             $form->add_render_attribute('input' . $item_index, 'data-frmc_rminval', esc_attr($item['frmc_range_min_value']));
    43         }
    44 
    45         if (filter_var($item['frmc_range_max_value'], FILTER_VALIDATE_INT)) {
    46             $form->add_render_attribute('input' . $item_index, 'data-frmc_rmaxval', esc_attr($item['frmc_range_max_value']));
    47         }
    48 
    49         if (filter_var($item['frmc_range_default_value'], FILTER_VALIDATE_INT)) {
    50             $form->add_render_attribute('input' . $item_index, 'data-frmc_rdefaultval', esc_attr($item['frmc_range_default_value']));
    51         }
    52 
    53         if (filter_var($item['frmc_range_step'], FILTER_VALIDATE_INT)) {
    54             $form->add_render_attribute('input' . $item_index, 'data-frmc_rstep', esc_attr($item['frmc_range_step']));
    55         }
    56 
    57         if (isset($item['frmc_range_prefix'])) {
    58             $form->add_render_attribute('input' . $item_index, 'data-frmc_rprefix', esc_attr($item['frmc_range_prefix']));
    59         }
    60 
    61         if (filter_var($item['frmc_range_tooltip'], FILTER_VALIDATE_BOOLEAN)) {
    62             $form->add_render_attribute('input' . $item_index, 'data-frmc_rtooltip', esc_attr($item['frmc_range_tooltip']));
     42        if (filter_var($item['formico_range_min'], FILTER_VALIDATE_INT)) {
     43            $form->add_render_attribute('input' . $item_index, 'data-min', esc_attr($item['formico_range_min']));
     44        }
     45
     46        if (filter_var($item['formico_range_max'], FILTER_VALIDATE_INT)) {
     47            $form->add_render_attribute('input' . $item_index, 'data-max', esc_attr($item['formico_range_max']));
     48        }
     49
     50        if (filter_var($item['formico_range_devalue'], FILTER_VALIDATE_INT)) {
     51            $form->add_render_attribute('input' . $item_index, 'data-de-value', esc_attr($item['formico_range_devalue']));
     52        }
     53
     54        if (filter_var($item['formico_range_step'], FILTER_VALIDATE_INT)) {
     55            $form->add_render_attribute('input' . $item_index, 'data-step', esc_attr($item['formico_range_step']));
     56        }
     57
     58        if (isset($item['formico_range_prefix'])) {
     59            $form->add_render_attribute('input' . $item_index, 'data-prefix', esc_attr($item['formico_range_prefix']));
     60        }
     61
     62        if (isset($item['formico_range_tooltip'])) {
     63            $form->add_render_attribute('input' . $item_index, 'data-tooltip', esc_attr($item['formico_range_tooltip']));
    6364        }
    6465
    6566        $form->add_render_attribute('input' . $item_index, 'type', 'hidden', true);
    6667
    67         echo '<input ' . $form->get_render_attribute_string('input' . esc_attr($item_index)) . ' data-range_id="' . esc_attr($item['custom_id']) . '"><div style="width:100%" id="formico_range_' . esc_attr($item['custom_id']) . '"></div><div id="formico_range_' . esc_attr($item['custom_id']) . '_show"></div>';
     68        echo '<input ' . $form->get_render_attribute_string('input' . esc_attr($item_index)) . ' data-range_id="' . esc_attr($item['custom_id']) . '"><div style="width:100%" id="formico_range_' . esc_attr($item['custom_id']) . '"></div>';
    6869    }
    6970
     
    8283
    8384        $field_controls = [
    84             'frmc_range_min_value'  => [
    85                 'name'          => 'frmc_range_min_value',
     85            'formico_range_min'  => [
     86                'name'          => 'formico_range_min',
    8687                'label'         => esc_html__('Minimum Value', 'formico'),
    8788                'type'          => Controls_Manager::NUMBER,
     
    9596                'tabs_wrapper'  => 'form_fields_tabs',
    9697            ],
    97             'frmc_range_max_value'  => [
    98                 'name'          => 'frmc_range_max_value',
     98            'formico_range_max'  => [
     99                'name'          => 'formico_range_max',
    99100                'label'         => esc_html__('Maximum Value', 'formico'),
    100101                'type'          => Controls_Manager::NUMBER,
     
    108109                'tabs_wrapper'  => 'form_fields_tabs',
    109110            ],
    110             'frmc_range_step'  => [
    111                 'name'          => 'frmc_range_step',
     111            'formico_range_step'  => [
     112                'name'          => 'formico_range_step',
    112113                'label'         => esc_html__('Step Value', 'formico'),
    113114                'type'          => Controls_Manager::NUMBER,
     
    121122                'tabs_wrapper'  => 'form_fields_tabs',
    122123            ],
    123             'frmc_range_default_value'  => [
    124                 'name'          => 'frmc_range_default_value',
     124            'formico_range_devalue'  => [
     125                'name'          => 'formico_range_devalue',
    125126                'label'         => esc_html__('Default Value', 'formico'),
    126127                'type'          => Controls_Manager::NUMBER,
     
    131132                ],
    132133                'tab'           => 'content',
    133                 'inner_tab'     => 'form_fields_advanced_tab',
    134                 'tabs_wrapper'  => 'form_fields_tabs',
    135             ],
    136             'frmc_range_prefix'  => [
    137                 'name'          => 'frmc_range_prefix',
     134                'inner_tab'     => 'form_fields_content_tab',
     135                'tabs_wrapper'  => 'form_fields_tabs',
     136            ],
     137            'formico_range_prefix'  => [
     138                'name'          => 'formico_range_prefix',
    138139                'label'         => esc_html__('Prefix', 'formico'),
    139140                'type'          => Controls_Manager::TEXT,
     
    145146                'tabs_wrapper'  => 'form_fields_tabs',
    146147            ],
    147             'frmc_range_tooltip'  => [
    148                 'name'          => 'frmc_range_tooltip',
     148            'formico_range_tooltip'  => [
     149                'name'          => 'formico_range_tooltip',
    149150                'label'         => esc_html__('Show Tooltip', 'formico'),
    150151                'type'          => Controls_Manager::SWITCHER,
     
    167168    public function formico_add_style_controls($widget, $args) {
    168169        $widget->add_control(
    169             'frmc_rs_heading',
     170            'formico_rs_heading',
    170171            array(
    171172                'label'     => esc_html__('Range Slider Field', 'formico'),
     
    176177
    177178        $widget->add_control(
    178             'frmc_rs_bg_color',
     179            'formico_rs_bg_color',
    179180            array(
    180181                'label'     => esc_html__('Connect Color', 'formico'),
    181182                'type'      => Controls_Manager::COLOR,
    182183                'selectors' => array(
    183                     '{{WRAPPER}} .elementor-field-type-frmc_range .noUi-connect' => 'background: {{VALUE}};',
     184                    '{{WRAPPER}} .elementor-field-type-formico_range .noUi-connect' => 'background: {{VALUE}};',
    184185                ),
    185186                'global' => array(
     
    189190        );
    190191        $widget->add_control(
    191             'frmc_rs_border_radius',
     192            'formico_rs_border_radius',
    192193            [
    193                 'label' => esc_html__('Border Radius', 'formico'),
    194                 'type' => \Elementor\Controls_Manager::SLIDER,
     194                'label'         => esc_html__('Border Radius', 'formico'),
     195                'type'          => Controls_Manager::SLIDER,
     196                'size_units'    => ['px', '%', 'em', 'rem', 'custom'],
     197                'range'         => [
     198                    'px' => [
     199                        'min' => 0,
     200                        'max' => 100,
     201                        'step' => 1,
     202                    ],
     203                    '%' => [
     204                        'min' => 0,
     205                        'max' => 100,
     206                    ],
     207                ],
     208                'default' => [
     209                    'unit' => 'px',
     210                    'size' => 0,
     211                ],
     212                'selectors' => [
     213                    '{{WRAPPER}} .noUi-target, {{WRAPPER}} .noUi-connects' => 'border-radius: {{SIZE}}{{UNIT}};',
     214                ],
     215            ]
     216        );
     217        $widget->add_control(
     218            'formico_rs_margin_top',
     219            [
     220                'label' => esc_html__('Margin Top', 'formico'),
     221                'type' => Controls_Manager::SLIDER,
    195222                'size_units' => ['px', '%', 'em', 'rem', 'custom'],
    196223                'range' => [
     
    207234                'default' => [
    208235                    'unit' => 'px',
    209                     'size' => 0,
    210                 ],
    211                 'selectors' => [
    212                     '{{WRAPPER}} .noUi-target, {{WRAPPER}} .noUi-connects' => 'border-radius: {{SIZE}}{{UNIT}};',
    213                 ],
    214             ]
    215         );
    216         $widget->add_control(
    217             'frmc_rs_margin_top',
    218             [
    219                 'label' => esc_html__('Margin Top', 'formico'),
    220                 'type' => \Elementor\Controls_Manager::SLIDER,
    221                 'size_units' => ['px', '%', 'em', 'rem', 'custom'],
    222                 'range' => [
    223                     'px' => [
    224                         'min' => 0,
    225                         'max' => 100,
    226                         'step' => 1,
    227                     ],
    228                     '%' => [
    229                         'min' => 0,
    230                         'max' => 100,
    231                     ],
    232                 ],
    233                 'default' => [
    234                     'unit' => 'px',
    235236                    'size' => 45,
    236237                ],
     
    242243    }
    243244
    244 
    245     public function __construct() {
    246         parent::__construct();
    247         add_action('elementor/element/form/section_form_style/before_section_end', array($this, 'formico_add_style_controls'), 10, 2);
    248         add_action('elementor/preview/init', [$this, 'editor_preview_footer']);
    249     }
    250245
    251246    public function editor_preview_footer() {
     
    265260                        const fieldClass = `elementor-field-textual formico_range_slider elementor-field ${item.css_classes}`;
    266261                        const size = '1';
    267 
    268                         return `<input id="${fieldId}" class="${fieldClass}" size="${size}"> <div style="width:100%" id="formico_range_${item.custom_id}"></div>`;
     262                        const min = item['formico_range_min'] ? item['formico_range_min'] : 1;
     263                        const max = item['formico_range_max'] ? item['formico_range_max'] : 100;
     264                        const step = item['formico_range_step'] ? item['formico_range_step'] : 1;
     265                        const tooltip = item['formico_range_tooltip'] ? item['formico_range_tooltip'] : 'no';
     266                        const defaultValue = item['formico_range_devalue'] ? item['formico_range_devalue'] : 'no';
     267                        const prefix = item['formico_range_prefix'] ? item['formico_range_prefix'] : '';
     268
     269                        return `<input type="hidden" id="${fieldId}" class="${fieldClass}" size="${size}" data-range_id="${item.custom_id}" data-min="${min}" data-max="${max}" data-step="${step}" data-prefix="${prefix}" data-de-value="${defaultValue}" data-tooltip="${tooltip}"> <div style="width:100%" id="formico_range_${item.custom_id}"></div>`;
    269270                    }, 10, 3
    270271                );
  • formico/trunk/includes/fields/smart-phone-field/smart-phone-field.php

    r3093701 r3187716  
    99use Elementor\Controls_Manager;
    1010
     11class Formico_Smart_Phone_Field extends \ElementorPro\Modules\Forms\Fields\Field_Base {
    1112
    12 class Formico_Smart_Phone_Field extends \ElementorPro\Modules\Forms\Fields\Field_Base {
    13     public $depended_scripts = ['frmc_intlTelInput', 'frmc_active'];
     13    public $depended_scripts = ['formico_intlTelInput', 'formico_spf'];
     14    public $depended_styles = ['formico_intlTelInput', 'formico_style'];
    1415
    15     public $depended_styles = ['frmc_intlTelInput', 'frmc_style'];
     16    public function __construct() {
     17        parent::__construct();
     18        add_action('elementor/preview/init', [$this, 'editor_preview_spf']);
     19    }
    1620
    1721    public function get_type() {
    18         return 'frmc_spf';
     22        return 'formico_spf';
    1923    }
    2024
    2125    public function get_name() {
    2226        return esc_html__('Smart Phone Field', 'formico');
    23     }
    24 
    25     public function __construct() {
    26         parent::__construct();
    27         add_action('elementor/preview/init', [$this, 'editor_preview_footer']);
    2827    }
    2928
     
    3433            [
    3534                'size'  => '1',
    36                 'class' => 'formico_spf_field elementor-field-textual',
    37                 'placeholder' => $item['frmc_spf_placeholder'],
     35                'class' => 'formico-spf-field elementor-field-textual',
     36                'placeholder' => $item['formico_spf_placeholder'],
    3837            ]
    3938        );
    4039
    41         if (isset($item['frmc_spf_auto_country'])) {
    42             $form->add_render_attribute('input' . $item_index, 'data-frmc_spf_auto_country', esc_attr($item['frmc_spf_auto_country']));
    43         }
    44 
    45         if (isset($item['frmc_spf_init_country'])) {
    46             $form->add_render_attribute('input' . $item_index, 'data-frmc_spf_init_country', esc_attr($item['frmc_spf_init_country']));
     40        if (isset($item['formico_spf_init_country'])) {
     41            $form->add_render_attribute('input' . $item_index, 'data-init-country', esc_attr($item['formico_spf_init_country']));
    4742        }
    4843
     
    5247    }
    5348
    54     public function validation($field, Classes\Form_Record $record, Classes\Ajax_Handler $ajax_handler) {
    55         if (empty($field['value']) or !$field['required']) {
    56             return;
    57         }
     49    // public function validation($field, Classes\Form_Record $record, Classes\Ajax_Handler $ajax_handler) {
     50    //     if (empty($field['value']) or !$field['required']) {
     51    //         return;
     52    //     }
    5853
    59         if (preg_match("/^[+]?\d*\.?\d+$/", $field['value']) !== 1) {
    60             $ajax_handler->add_error(
    61                 $field['id'],
    62                 esc_html__('Oops, something went wrong!', 'formico')
    63             );
    64         }
    65     }
     54    //     if (preg_match("/^[+]?\d*\.?\d+$/", $field['value']) !== 1) {
     55    //         $ajax_handler->add_error(
     56    //             $field['id'],
     57    //             esc_html__('Oops, something went wrong!', 'formico')
     58    //         );
     59    //     }
     60    // }
    6661
    6762    /**
     
    7974
    8075        $field_controls = [
    81             'frmc_spf_auto_country'  => [
    82                 'name'          => 'frmc_spf_auto_country',
    83                 'label'         => esc_html__('Auto Select Country', 'formico'),
    84                 'type'          => Controls_Manager::SWITCHER,
    85                 'label_on'      => esc_html__('Yes', 'formico'),
    86                 'label_off'     => esc_html__('No', 'formico'),
    87                 'return_value'  => 'yes',
    88                 'default'       => 'no',
     76            'formico_spf_init_country'  => [
     77                'name'          => 'formico_spf_init_country',
     78                'label'         => esc_html__('Default Country', 'formico'),
     79                'type'          => Controls_Manager::SELECT2,
     80                'label_block'   => false,
     81                'multiple'      => false,
     82                'options'       => Utils::get_countries(),
     83                'default'       => 'US',
    8984                'condition'     => [
    9085                    'field_type'    => $this->get_type(),
     
    9489                'tabs_wrapper'  => 'form_fields_tabs',
    9590            ],
    96             'frmc_spf_init_country'  => [
    97                 'name'          => 'frmc_spf_init_country',
    98                 'label'         => esc_html__('Initial Country', 'formico'),
    99                 'type'          => Controls_Manager::SELECT2,
    100                 'label_block'   => false,
    101                 'multiple'      => false,
    102                 'options'       => Utils::get_countries(),
    103                 'default'       => 'US',
    104                 'condition'     => [
    105                     'field_type'        => $this->get_type(),
    106                     'frmc_spf_auto_country'  =>  ['', 'no']
    107                 ],
    108                 'tab'           => 'content',
    109                 'inner_tab'     => 'form_fields_content_tab',
    110                 'tabs_wrapper'  => 'form_fields_tabs',
    111             ],
    112             'frmc_spf_placeholder'   => [
    113                 'name'          => 'frmc_spf_placeholder',
     91            'formico_spf_placeholder'   => [
     92                'name'          => 'formico_spf_placeholder',
    11493                'label'         => esc_html__('Placeholder', 'formico'),
    11594                'type'          => Controls_Manager::TEXT,
     
    128107    }
    129108
    130 
    131     public function editor_preview_footer() {
     109    public function editor_preview_spf() {
    132110        add_action('wp_footer', [$this, 'content_template_script']);
    133111    }
     
    143121
    144122                        const fieldId = `form_field_${i}`;
    145                         const fieldClass = `elementor-field-textual formico_spf_field elementor-field ${item.css_classes}`;
     123                        const fieldClass = `elementor-field-textual formico-spf-field elementor-field ${item.css_classes}`;
    146124                        const size = '1';
    147125                        const placeholder = item['frmc_spf_placeholder'] ? item['frmc_spf_placeholder'] : '';
     126                        const initCountry = item['formico_spf_init_country'] ? item['formico_spf_init_country'] : '';
    148127
    149                         return `<input id="${fieldId}" class="${fieldClass}" size="${size}" placeholder="${placeholder}">`;
     128                        return `<input id="${fieldId}" class="${fieldClass}" size="${size}" placeholder="${placeholder}" data-init-country="${initCountry}">`;
    150129                    }, 10, 3
    151130                );
  • formico/trunk/includes/view/controls/switch.php

    r3093701 r3187716  
    11<?php
    2     if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly   
     2if (! defined('ABSPATH')) exit; // Exit if accessed directly   
     3
     4$checked = $field['saved'] ? 'checked' : '';
    35?>
    46
    5 <div class="formico_input__switch <?php echo esc_attr($class); ?>">
    6     <input type="checkbox" class="<?php echo esc_attr($class); ?>" name="<?php echo esc_attr($name); ?>" id="<?php echo esc_attr($value); ?>" value="<?php echo esc_attr($value); ?>" <?php
    7                                                                                                                                                                                         if (isset($attr)) {
    8                                                                                                                                                                                             foreach ($attr as $k => $v) {
    9                                                                                                                                                                                                 echo esc_attr($k) . '=' . esc_attr($v);
    10                                                                                                                                                                                             }
    11                                                                                                                                                                                         }
    12                                                                                                                                                                                         ?> <?php echo esc_attr($options['checked'] === true ? 'checked' : ''); ?>>
    13     <label for="<?php echo esc_attr($value); ?>">
    14         <span class="formico_field__name"><?php echo esc_attr($label); ?><?php if (!empty($attr)) : ?><span class="pro_tag">Pro</span><?php endif; ?></span>
    15         <span class="formico_fields_links"></span>
    16     </label>
     7
     8<div id="formico__setting_<?php echo esc_attr(esc_attr($field['name'])) ?>" class="formico_setting_field formico_setting_field_<?php echo esc_attr($field['type']) ?>">
     9    <?php if (array_key_exists('label', $field)) { ?>
     10        <div class="formico_setting_field_header">
     11            <label for="<?php echo esc_attr($field['label']); ?>"><?php echo esc_attr($field['label']) ?></label>
     12        </div>
     13    <?php } ?>
     14    <span class="formico__setting_field_container formico__setting_field_switch">
     15        <input type="checkbox" name="<?php echo esc_attr($field['name']); ?>" id="<?php echo esc_attr($field['name']); ?>" value="1" <?php echo esc_attr($checked); ?>>
     16        <label for="<?php echo esc_attr($field['name']); ?>">
     17            <?php echo esc_attr($field['switch_text']); ?>
     18            <?php if (array_key_exists('tooltips', $field)) { ?>
     19                <span class="formico_setting_field_tooltips">
     20                    <span class="f_icon icon-question"></span>
     21                    <span class="formico_tooltips_text"><?php echo esc_html($field['tooltips']); ?></span>
     22                </span>
     23            <?php } ?>
     24            <?php if (array_key_exists('description', $field)) { ?>
     25                <span class="formico_setting_field_description"><?php echo esc_html($field['description']); ?></span>
     26            <?php } ?>
     27        </label>
     28    </span>
    1729</div>
  • formico/trunk/includes/view/controls/text.php

    r3093701 r3187716  
    11<?php
    2     if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly   
     2if (! defined('ABSPATH')) exit; // Exit if accessed directly   
    33?>
    44
    5 <div class="formico_input__text <?php echo esc_attr($class); ?>">
    6     <label for="formico_user_data_<?php echo esc_attr(self::strify($label)) ?>"><?php echo esc_attr($label); ?></label>
    7     <input type="text" name="user_data<?php echo esc_attr($name); ?>" id="formico_user_data_<?php echo esc_attr(self::strify($label)) ?>" value="<?php echo esc_attr($value); ?>" placeholder="<?php echo esc_attr($placeholder); ?>">
     5<div id="formico_setting_<?php echo esc_attr($field['name']) ?>" class="formico_setting_field formico_setting_field_<?php echo esc_attr($field['type']) ?>">
     6    <div class="formico_setting_field_header">
     7        <label for="<?php echo esc_attr($field['name']); ?>">
     8            <?php echo esc_attr($field['label']) ?>
     9            <?php if (array_key_exists('tooltips', $field)) { ?>
     10                <span class="formico_setting_field_tooltips">
     11                    <span class="f_icon icon-question"></span>
     12                    <span class="formico_tooltips_text"><?php echo esc_attr($field['tooltips']); ?></span>
     13                </span>
     14            <?php } ?>
     15        </label>
     16        <?php if (array_key_exists('description', $field)) { ?>
     17            <span class="formico_setting_field_description"><?php echo esc_attr($field['description']); ?></span>
     18        <?php } ?>
     19    </div>
     20    <span class="formico_setting_field_container">
     21        <input type="text" name="<?php echo esc_attr($field['name']); ?>" id="<?php echo esc_attr($field['name']); ?>" placeholder="<?php echo esc_attr($field['placeholder']); ?>" value="<?php echo esc_attr($field['saved']); ?>">
     22    </span>
    823</div>
  • formico/trunk/readme.txt

    r3093702 r3187716  
    1 === Formico - Elementor Form Fields and Extensions ===
     1=== Formico - Elementor Form Extensions, Fields & Integrations ===
    22Contributors: kaisarahmmed
    3 Tags: Elementor forms, form addons, extension, form API, elementor pro
     3Tags: Elementor forms, addons, extension, Integration, elementor pro
    44Requires at least: 4.0
    55Requires PHP: 5.6
    6 Tested up to: 6.5.3
    7 Stable tag: 1.0.0
     6Tested up to: 6.7
     7Stable tag: 1.0.1
    88License: GPLv2 or later
    99License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.en.html
     
    1717== Form Field Extensions ==
    1818* Input Mask
    19 * Address Auto Complete
     19* Address Auto Complete via google place api
    2020
    2121== Form Fields ==
    2222* Samrt Phone Field
    2323* Range Slider Field
     24* Signature Field
     25
     26== Integrations ==
     27* Brevo (formaly SendInBlue)
     28* Klaviyo
    2429
    2530## Google Map API for address auto complete.
     
    4146== Change log ==
    4247
     48= 1.0.1 =
     49* Added brevo, klaviyo crm
     50* Added signature field
     51* Update js library
     52* Bug Fix
     53
    4354= 1.0.0 =
    4455* Initial Release
Note: See TracChangeset for help on using the changeset viewer.