"Untitled"
Bootstrap 4.1.1 Snippet by loni

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <html lang="en"><head> <meta charset="UTF-8"> <link rel="shortcut icon" type="image/x-icon" href="https://static.codepen.io/assets/favicon/favicon-aec34940fbc1a6e787974dcd360f2c6b63348d4b1f4e06c77743096d55480f33.ico"> <link rel="mask-icon" type="" href="https://static.codepen.io/assets/favicon/logo-pin-8f3771b1072e3c38bd662872f6b673a722f4b3ca2421637d5596661b4e2132cc.svg" color="#111"> <title>CodePen - Stylish Google Translator Widget</title> <title>Google Translator Widget by Cybup</title> <style> body{background:#57C6F9; color:#fff;} #cybup-trans-warp { display:block; width:90%; max-width:300px; border:none; background-color:#fff; color:#444; overflow:hidden; position:relative; height:40px; line-height:40px; border:1px solid #e0e0e0; } #cybup-trans-warp select { border:none; background:transparent; font-family:'Verdana',Arial,Sans-Serif; font-size:12px; width:100%; color:#444; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-appearance:none; cursor:text; padding:5px 10px; } #cybup-trans-warp a, #cybup-trans-warp a:hover { display:block; background-color:#FF9434; border:none; color:#fff; margin:0 0; text-decoration:none; position:absolute; top:0; right:0; bottom:0; cursor:pointer; width:14%; transition:all 0.3s ease; } #cybup-trans-warp a:before { content:""; display:block; width:0; height:0; border:6px solid transparent; border-left-color:white; position:absolute; top:50%; left:45%; margin-top:-5px; } #cybup-trans-warp a:hover {opacity:0.9;} #cybup-trans-warp a:active {opacity:0.9;} #cybup-trans-warp select:focus, #cybup-trans-warp a:focus, #cybup-trans-warp select:active, #cybup-trans-warp a:active { border:none; outline:none; cursor:pointer; } option { background:#82B638; color:#fff; } </style> <script> window.console = window.console || function(t) {}; </script> <script> if (document.location.search.match(/type=embed/gi)) { window.parent.postMessage("resize", "*"); } </script> </head> <body translate="no"> <center> <div id="cybup-trans-warp"> <select id="translate-language"> <option value="" selected="">Select Your Language.. </option><option value="ml">Malayalam </option><option value="af">Afrikaans </option><option value="sq">Albanian </option><option value="ar">Arabic </option><option value="hy">Armenian </option><option value="az">Azerbaijani </option><option value="eu">Basque </option><option value="be">Belarusian </option><option value="bn">Bengali </option><option value="bg">Bulgarian </option><option value="ca">Catalan </option><option value="zh-CN">Chinese </option><option value="hr">Croatian </option><option value="cs">Czech </option><option value="da">Danish </option><option value="nl">Dutch </option><option value="en">English </option><option value="eo">Esperanto </option><option value="et">Estonian </option><option value="tl">Filipino </option><option value="fi">Finnish </option><option value="fr">French </option><option value="gl">Galician </option><option value="ka">Georgian </option><option value="de">German </option><option value="el">Greek </option><option value="gu">Gujarati </option><option value="ht">Haitian Creole </option><option value="iw">Hebrew </option><option value="hi">Hindi </option><option value="hu">Hungarian </option><option value="is">Icelandic </option><option value="id">Indonesian </option><option value="ga">Irish </option><option value="it">Italian </option><option value="ja">Japanese </option><option value="kn">Kannada </option><option value="ko">Korean </option><option value="la">Latin </option><option value="lv">Latvian </option><option value="lt">Lithuanian </option><option value="mk">Macedonian </option><option value="ms">Malay </option><option value="mt">Maltese </option><option value="no">Norwegian </option><option value="fa">Persian </option><option value="pl">Polish </option><option value="pt">Portuguese </option><option value="ro">Romanian </option><option value="ru">Russian </option><option value="sr">Serbian </option><option value="sk">Slovak </option><option value="sl">Slovenian </option><option value="es">Spanish </option><option value="sw">Swahili </option><option value="sv">Swedish </option><option value="ta">Tamil </option><option value="te">Telugu </option><option value="th">Thai </option><option value="tr">Turkish </option><option value="uk">Ukrainian </option><option value="ur">Urdu </option><option value="vi">Vietnamese </option><option value="cy">Welsh </option><option value="yi">Yiddish </option></select><a id="translate-me" href="#" title="Translate"></a> </div> <br> <p>Welcome to Cybup Technologies.</p> </center> <script src="https://static.codepen.io/assets/common/stopExecutionOnTimeout-de7e2ef6bfefd24b79a3f68b414b87b8db5b08439cac3f1012092b2290c719cd.js"></script> <script id="rendered-js"> (function () { var lang = "en", /* Your website language */ anchor = document.getElementById('translate-me'); anchor.onclick = function () { window.open('https://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + lang + '%7C' + document.getElementById('translate-language').value + '&hl=en'); return false; }; })(); //# sourceURL=pen.js </script> <script src="https://static.codepen.io/assets/editor/live/css_reload-5619dc0905a68b2e6298901de54f73cefe4e079f65a75406858d92924b4938bf.js"></script> <div id="vidyowebrtcscreenshare_is_installed"></div></body></html>

Related: See More

Argon Dashboard

Questions / Comments: