w przywołanym przykładzie zmiana polega na skalowaniu zawartości ramki div g-recaptcha, do mniejszego rozmiaru poprzez własność CSS transform:scale
Kod:
<div class="g-recaptcha" data-theme="light" data-sitekey="XXXXXXXXXXXXX" style="transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>
więc bez problemu można to też uzyskać w joomla poprzez modyfikację stylizacji szablonu.
kod stylizujący okienko pop-up z obrazkami powinien wyglądać tak:
Kod:
<style> #rc-imageselect {transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0;} </style>
proponowane jest także alternatywne rozwiązanie, które rozwiązuje oba zagadnienie w jednym wpisie:
Kod:
<style> @media screen and (max-height: 575px){ #rc-imageselect, .g-recaptcha {transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0;} } </style>