Stylebook

Odesláním souhlasíte se zpracováním osobních údajů

        {% include "@Components/sections/re-agency-form-section/re-agency-form-section.twig" with { props:
  {
    title: "Poptávka",
    inputs: [
      {
        type: "textarea/textarea",
        label: "",
        placeholder: "Text Vaší poptávky"
      },
      {
        type: "input-field/input-field",
        label: "",
        placeholder: "Jméno a příjmení",
        icon: {
          src: "images/svg/user.svg"
        }
      },
      {
        type: "input-field/input-field",
        label: "",
        placeholder: "Váš e-mail",
        icon: {
          src: "images/svg/mail.svg"
        },
      },
      {
        type: "input-field/input-field",
        label: "",
        placeholder: "Váš telefon",
        icon: {
          src: "images/svg/phone.svg",
          title: "Telefon"
        },
      },
    ],
    gdpr: "Odesláním souhlasíte se zpracováním osobních údajů",
    button_title: "Odeslat zprávu"
    }
  }
%}

          



<section class="base-section  --spacing-md    s-re-agency-form">
  <div class="base-section__container container">
        <header class="base-header --left --underline">

	
			<div class="base-header__heading-wrapper">
					<h2 class="base-header__heading base-h2"></h2>
			
		</div>
	









































	</header>    <div class="g-re-agency-form">
  <form method="post">

          <div class="f-wrap ">
      
    <textarea class="f-base textarea" rows="5" placeholder="Text Vaší poptávky"></textarea>
  </div>
          <div class="f-wrap ">
          <span class="f-input__wrapper --with-icon">
            <input class="f-base" type="text" placeholder="Jméno a příjmení">
                    <span class="input__icon">
          <span class="icon">
      <img src="images/svg/user.svg"  loading="lazy">
  
  </span>
        </span>
          </span>
  </div>
          <div class="f-wrap ">
          <span class="f-input__wrapper --with-icon">
            <input class="f-base" type="text" placeholder="Váš e-mail">
                    <span class="input__icon">
          <span class="icon">
      <img src="images/svg/mail.svg"  loading="lazy">
  
  </span>
        </span>
          </span>
  </div>
          <div class="f-wrap ">
          <span class="f-input__wrapper --with-icon">
            <input class="f-base" type="text" placeholder="Váš telefon">
                    <span class="input__icon">
          <span class="icon">
      <img src="images/svg/phone.svg"  loading="lazy">
  
  </span>
        </span>
          </span>
  </div>
    
    <div class="g-re-agency-form__gdpr">Odesláním souhlasíte se zpracováním osobních údajů</div>

    <button class="btn --conversion" type="submit">    <span class="btn__title ">Odeslat zprávu</span>
      </button>
  </form>
</div>

    </div>
</section>

Schema

    {
  "props": {
    "title": {
      "type": "string",
      "description": "Title of the component"
    },
    "inputs": {
      "type": "Array of objects",
      "description": "Props are inherited from input-field/input-field component AND extend by type of input eg: input-field/input-field or textarea/textarea"
    },
    "gdpr": {
      "type": "string",
      "description": "GDPR text"
    },
    "button": {
      "title": {
        "type": "string",
        "description": "titile of button"
      }
    }
  }
}