src/Social/FrontendBundle/Resources/views/__partials/modal_signup_form_card.twig line 1

Open in your IDE?
  1. {% if app.user is not defined or app.user is null %}
  3.     <style>
  4.         .col-centered {
  5.             float: none;
  6.             margin: 0 auto;
  7.         }
  9.         @media (max-width: 991px) {
  10.             .login-form-responsive {
  11.                 max-width: 100% !important;
  12.                 margin: 0 auto;
  13.             }
  14.         }
  16.         #modal-signup {
  17.             -webkit-box-orient: vertical;
  18.             -webkit-box-direction: normal;
  19.             -ms-flex-direction: column;
  20.             flex-direction: column;
  21.             pointer-events: auto;
  22.             background-color: #fff;
  23.             background-clip: padding-box;
  24.             border: 1px solid rgba(0, 0, 0, .2);
  25.             border-radius: .3rem;
  26.             outline: 0;
  28.             padding: 0;
  29.         }
  31.         .btn-success .btn-stroke:hover i {
  32.             color: #41b3a3 !important;
  33.         }
  35.         #modal-signup .modal-header {
  36.             -webkit-box-shadow: inset 0px -25px 10px -25px rgba(0, 0, 0, 0.5);
  37.             -moz-box-shadow: inset 0px -25px 10px -25px rgba(0, 0, 0, 0.5);
  38.             box-shadow: inset 0px -25px 10px -25px rgba(0, 0, 0, 0.5);
  39.             padding: 0 10px;
  40.             line-height: 29px;
  41.             border-color: #efefef;
  42.             background-color: #f9f9f9;
  43.             background-image: -moz-linear-gradient(top, #fdfdfd, #f4f4f4);
  44.             background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdfdfd), to(#f4f4f4));
  45.             background-image: -webkit-linear-gradient(top, #fdfdfd, #f4f4f4);
  46.             background-image: -o-linear-gradient(top, #fdfdfd, #f4f4f4);
  47.             filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffdfdfd', endColorstr='#fff4f4f4', GradientType=0);
  48.             -moz-border-radius: 5px 5px 0 0;
  49.         }
  51.         #modal-signup .form-horizontal {
  52.             box-shadow: none;
  53.         }
  55.         #modal-signup .modal-body {
  56.             border-left: 1px solid #efefef;
  57.             border-right: 1px solid #efefef;
  58.             margin-top: -1px;
  59.         }
  61.         #modal-signup .modal-body, .modal-body {
  62.             border: 1px solid #efefef;
  63.         }
  65.         #modal-signup .modal-body .container-fluid {
  66.             padding-bottom: 0;
  67.         }
  69.         #modal-signup .modal-body {
  70.             padding: 0 6px 0 6px !important;
  71.         }
  73.         #modal-signup .mfp-close {
  74.             font-size: 20px;
  75.             width: 16px;
  76.             height: 16px;
  77.             line-height: 16px;
  78.             color: #ccc;
  79.         }
  81.         #modal-signup .modal-body .modal-register-form span.start-sign-up {
  82.             font-weight: bold;
  83.             display: block;
  84.             font-size: 30px;
  85.             line-height: 1.1;
  86.             margin: 0;
  87.         }
  89.         #modal-signup .c-header h3 {
  90.             margin-top: 0;
  91.         }
  93.         #modal-signup .c-header {
  94.             margin-bottom: 20px;
  95.             margin-top: 0;
  96.             padding-left: 6px;
  97.             padding-right: 6px;
  98.             text-align: center;
  99.         }
  101.         #modal-signup .modal-body .modal-register-form span.start-meet {
  102.             font-size: 14px;
  103.             font-weight: bolder;
  104.         }
  106.         .white-popup-block {
  107.             background: #ccc;
  108.             animation: open 1s;
  109.         }
  111.         .mfp-removing{
  112.             animation: close 1s;
  113.         }
  115.         @keyframes open {
  116.             0%   {opacity: 0;}
  117.             100% {opacity: 1;}
  118.         }
  120.         @keyframes close {
  121.             0%   {opacity: 1;}
  122.             100% {opacity: 0;}
  123.         }
  124.     </style>
  125.     <script type="text/javascript">
  126.         {% if registration_modal_seconds_await is defined and registration_modal_seconds_await in not null %}
  127.         const registrationModalAwait = '{{ registration_modal_seconds_await }}';
  128.         {% else %}
  129.         const registrationModalAwait = 10;
  130.         {% endif %}
  132.         function openSignUpModal() {
  133.             $.magnificPopup.open({
  134.                 items: {
  135.                     src: '#modal-signup',
  136.                     type: 'inline',
  137.                     preloader: false,
  138.                     focus: '#registerGender',
  139.                 }
  140.             });
  141.         }
  142.         $(document).ready(function () {
  143.             $('.signup-modal-open').magnificPopup({
  144.                 type: 'inline',
  145.                 preloader: false,
  146.                 focus: '#registerGender',
  147.             });
  149.             var timeoutSetting = 10 * 1000;
  151.             if (typeof registrationModalAwait !== 'undefined' && registrationModalAwait > 0) {
  152.                 timeoutSetting = registrationModalAwait * 1000;
  153.             }
  155.             setTimeout(function () {
  156.                 $.magnificPopup.open({
  157.                     items: {
  158.                         src: '#modal-signup',
  159.                     },
  160.                     type: 'inline'
  161.                 });
  162.             }, timeoutSetting);
  163.             $('#modal-signup button[type="submit"]').on('click tap', function (event) {
  164.                 event.preventDefault();
  165.                 event.stopPropagation();
  166.                 event.stopImmediatePropagation();
  168.                 var buttonOldContent = $('#modal-signup .btn-needs-loading').html();
  169.                 $('#modal-signup .alert-panel').hide()
  170.                 $('#modal-signup .alert-panel .alert-danger').empty()
  172.                 $('#modal-signup .btn-needs-loading').attr('disabled', true);
  173.                 $('#modal-signup .btn-needs-loading').html('<i class="fad fa-spinner fa-spin fa-spinner" style="width: 100%; text-align: center; color:#fff !important; display: block !important;"></i>');
  175.                 $.ajax({
  176.                     type: 'POST',
  177.                     url: '{{ url('social_user_homepage') }}',
  178.                     data: $(this).closest('form').serialize(),
  179.                     dataType: 'json',
  180.                 }).success(function (response) {
  181.                     if (response.error_flag == true) {
  182.                         $('#modal-signup .btn-needs-loading').attr('disabled', false);
  183.                         $('#modal-signup .fa-spinner').addClass('hide');
  184.                         $('#modal-signup .fa-sign-in').removeClass('hide');
  186.                         for (var topIndex in response.errors) {
  187.                             var currentObject = response.errors[topIndex]
  188.                             for (var innerIndex in currentObject) {
  189.                                 $('#modal-signup .alert-panel .alert-danger').append(
  190.                                     '<li>' + currentObject[innerIndex] + '</li>',
  191.                                 )
  192.                             }
  193.                         }
  194.                         $('#modal-signup .alert-panel').show()
  195.                         $('#modal-signup .btn-needs-loading').html(buttonOldContent);
  196.                         $('#modal-signup .btn-needs-loading').attr('disabled', false);
  197.                         return;
  198.                     }
  200.                     if (response = 'undefined' || response.redirectUrl == 'undefined') {
  201.                         location.href = "{{ url('social_frontend_account') }}";
  202.                     } else {
  203.                         location.href = response.redirectUrl
  204.                     }
  205.                 }).error(function () {
  206.                     $('#modal-signup .btn-needs-loading .fa-spinner').addClass('hide');
  207.                     $('#modal-signup .btn-needs-loading .fa-sign-in').removeClass('hide');
  208.                     $('#modal-signup .btn-needs-loading').attr('disabled', false);
  209.                 })
  210.             })
  211.         });
  212.     </script>
  213.     <div id="modal-signup"
  214.          class="white-popup-block mfp-hide col-lg-4 col-md-6 col-sm-10 cols-xs-12 col-centered actual-hidden">
  215.         <div class="modal-header">
  216.             <h4 class="modal-title">
  217.                 <div class="logo-details-pack"><h4>{{ 'Yes, registration is free!'|trans }}</h4>
  218.                     <span>{{ 'Register fast and easy.'|trans }}</span></div>
  219.             </h4>
  220.             <button title="Close (Esc)" type="button" class="mfp-close">×</button>
  221.         </div>
  222.         <div class="modal-body">
  223.             <div class="container-fluid">
  224.                 <div class="row">
  225.                     <div class="col-sm-12 col-md-12 col-lg-12 padding-none">
  226.                         <form class="form-horizontal login-form-responsive modal-register-form" role="form"
  227.                               id="modal-register"
  228.                               novalidate="novalidate" action="{{ url('social_user_homepage') }}"
  229.                               method="POST"
  230.                               autocomplete="off">
  231.                             <div class="c-header">
  232.                                 <h3><span class="start-sign-up">{% trans %}Sign up{% endtrans %}</span>
  233.                                     <span class="start-meet">{% trans %}Flirting has never been easier! Create a free account now!{% endtrans %}</span>
  234.                                 </h3>
  235.                             </div>
  236.                             <div role="alert" class="alert-panel" style="display: none">
  237.                                 <ul class="alert alert-danger"></ul>
  238.                             </div>
  239.                             {% include 'SocialUserBundle:Registration:registration_form.html.twig' with {form: form} %}
  240.                         </form>
  241.                     </div>
  243.                     {#<div class="col-details-registration">
  244.                         <div class="row">
  245.                             <div class="col-sm-12">
  246.                                 <div class="row" style="padding: 0 6px">
  247.                                     <div class="col-md-12" style="margin-top: 5px;">
  248.                                         {% render(controller('SocialFrontendBundle:Account:getPopularUsersForModalNonLoggedIn', {request: app.request})) %}
  249.                                     </div>
  250.                                     <div class="col-md-12">
  251.                                         <ul class="list-unstyle details-intro details-intro-section-hidden overflow-hidden hidden">
  252.                                             <li>{% trans %}Meet new people!{% endtrans %}</li>
  253.                                             <li>{% trans %}Start flirting with people you like!{% endtrans %}</li>
  254.                                             <li>{% trans %}Start experiencing new things!{% endtrans %}</li>
  255.                                             <li>{% trans %}Enjoy life!{% endtrans %}</li>
  256.                                         </ul>
  257.                                     </div>
  258.                                     <div class="col-md-12">
  259.                                         <h3 class="headline-text-details-near text-center">
  260.                                             {% trans %}These people from your area are online right now!{% endtrans %}
  261.                                         </h3>
  262.                                     </div>
  263.                                 </div>
  264.                             </div>
  265.                         </div>
  266.                     </div>#}
  267.                 </div>
  268.             </div>
  269.         </div>
  270.     </div>
  271. {% endif %}