Commit 1c5b8bd3 authored by Simonas's avatar Simonas

form styles update

parent c1d06f1c
...@@ -28,7 +28,7 @@ if ( ! defined( 'WPINC' ) ) die; ...@@ -28,7 +28,7 @@ if ( ! defined( 'WPINC' ) ) die;
<div class="c-form--row"> <div class="c-form--row">
<label class="c-form--label" for="form-name">Name, Surname*</label> <label class="c-form--label" for="form-name">Name, Surname*</label>
<div class="c-form--input-wrap <?php if ($nameStatus) { echo "c-form--input-wrap--$nameStatus"; } ?>"> <div class="c-form--input-wrap <?php if ($nameStatus) { echo "c-form--input-wrap--$nameStatus"; } ?>">
<input type="text" class="c-form--input" id="form-name" name="name" value="<?php echo $nameValue; ?>" <?php if ($nameStatus): ?> autofocus="autofocus" <?php endif; ?>> <input type="text" class="c-form--input" id="form-name" name="name" value="<?php echo $nameValue; ?>" <?php if ($nameStatus == 'error'): ?> autofocus="autofocus" <?php endif; ?>>
</div> </div>
<?php if ($nameMessage): ?> <?php if ($nameMessage): ?>
<div class="c-form--validation c-form--validation-<?php echo $nameStatus; ?>"> <div class="c-form--validation c-form--validation-<?php echo $nameStatus; ?>">
...@@ -45,7 +45,7 @@ if ( ! defined( 'WPINC' ) ) die; ...@@ -45,7 +45,7 @@ if ( ! defined( 'WPINC' ) ) die;
<div class="c-form--row"> <div class="c-form--row">
<label class="c-form--label" for="form-phone">Phone no.*</label> <label class="c-form--label" for="form-phone">Phone no.*</label>
<div class="c-form--input-wrap <?php if ($phoneStatus) { echo "c-form--input-wrap--$phoneStatus"; } ?>"> <div class="c-form--input-wrap <?php if ($phoneStatus) { echo "c-form--input-wrap--$phoneStatus"; } ?>">
<input type="tel" class="c-form--input" id="form-phone" name="phone" value="<?php echo $phoneValue; ?>"> <input type="tel" class="c-form--input" id="form-phone" name="phone" value="<?php echo $phoneValue; ?>" <?php if ($nameStatus != 'error' && $phoneStatus == 'error'): ?> autofocus="autofocus" <?php endif; ?>>
</div> </div>
<?php if ($phoneMessage): ?> <?php if ($phoneMessage): ?>
<div class="c-form--validation c-form--validation-<?php echo $phoneStatus; ?>"> <div class="c-form--validation c-form--validation-<?php echo $phoneStatus; ?>">
......
...@@ -8,9 +8,14 @@ ...@@ -8,9 +8,14 @@
.c-form--label { display: block; color: #2A3644; font-size: 15px; line-height: 18px; margin-bottom: 4px; font-weight: 500; } .c-form--label { display: block; color: #2A3644; font-size: 15px; line-height: 18px; margin-bottom: 4px; font-weight: 500; }
.c-form--input-wrap { border-radius: 3px; border: 1px solid #d4d4d4; } .c-form--input-wrap { }
.c-form--input { width: 100%; padding: 10px; border: 0; background: none; } .c-form--input { width: 100%; padding: 10px; border: 0; background: none; border: 1px solid #d4d4d4; border-radius: 3px;
&:focus { border-color: #d4d4d4 !important; }
}
.c-form--textarea { width: 100%; padding: 10px; border: 0; background: none; border: 1px solid #d4d4d4; border-radius: 3px;
&:focus { border-color: #d4d4d4 !important; }
}
.c-form--submit-wrap { padding: 10px 0; } .c-form--submit-wrap { padding: 10px 0; }
...@@ -39,8 +44,14 @@ ...@@ -39,8 +44,14 @@
.c-form--validation { position: absolute; top: 50%; left: 100%; min-width: 200px; background-color: #ffffff; margin-top: 11px; padding: 10px 15px; border: 1px solid; transform: translate(30px, -50%); font-size: 13px; line-height: 20px; } .c-form--validation { position: absolute; top: 50%; left: 100%; min-width: 200px; background-color: #ffffff; margin-top: 11px; padding: 10px 15px; border: 1px solid; transform: translate(30px, -50%); font-size: 13px; line-height: 20px; }
.c-form--input-wrap--error { border: 1px solid #EB4646; } .c-form--input-wrap--error {
.c-form--input-wrap--success { border: 1px solid #17DAB9; } .c-form--input,
.c-form--textarea { border-color: #EB4646; }
}
.c-form--input-wrap--success {
.c-form--input,
.c-form--textarea { border-color: #17DAB9; }
}
/*.c-form--input--warning { border: 1px solid orange; }*/ /*.c-form--input--warning { border: 1px solid orange; }*/
.c-form--validation-error { color: #EB4646; border-color: #EB4646; margin-bottom: 10px; } .c-form--validation-error { color: #EB4646; border-color: #EB4646; margin-bottom: 10px; }
......
:root{--color--gray:#7e8683;--color--gray-darker:#2a3644;--color--green:#1fb299;--color--green-darker:#149a83;--color--green-dark:#006957;--color--blue-dark:#1d2a3a;--color--gray-light:#f8f8f8;--typo--font-family:-apple-system,BlinkMacSystemFont,"Segoe UI Light","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;--typo--font-size:1.5rem;--typo--weight-regular:400;--typo--weight-bold:700;--typo--line-height:1.2;--typo--font-face:"Roboto",sans-serif;--layout-width:1210px;--layout-width--small:870px;--layout-width--large:1150px}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}html{-webkit-box-sizing:border-box;box-sizing:border-box}*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}a{color:inherit}body{font-size:1.5rem;font-size:var(--typo--font-size);line-height:1.2;line-height:var(--typo--line-height);color:#2a3644;color:var(--color--gray-darker);font-family:Roboto,sans-serif;font-family:var(--typo--font-face);background:#f8f8f8;background:var(--color--gray-light)}html{min-height:100%;font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}.l-inner{max-width:1210px;max-width:var(--layout-width);margin-right:auto;margin-left:auto;padding-right:20px;padding-left:20px}.c-jobs--inner,.c-trust--inner,.c-values--inner,.l-inner-small{max-width:870px;max-width:var(--layout-width--small);margin-right:auto;margin-left:auto;padding-right:20px;padding-left:20px}.l-header{position:relative;height:70px;margin-bottom:47px;background:#fff}.l-header:before{content:"";position:absolute;top:100%;left:0;width:100%;height:47px;background:#1d2a3a;background:var(--color--blue-dark)}.l-content{max-width:1150px;max-width:var(--layout-width--large);padding-right:20px;padding-left:20px;margin:0 auto;display:-webkit-box;display:-ms-flexbox;display:flex}.l-content--position{position:relative;padding:40px 20px}.l-content--position:before{content:"";position:absolute;top:0;left:0;height:244px;width:100%;background:linear-gradient(358.45deg,#3c7e9e,#1fb299)}.l-content--position-inner{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;max-width:970px;padding:50px 70px;margin:0 auto 140px;border-radius:3px;background-color:#fff;-webkit-box-shadow:0 1px 47px 0 #ecf5ff;box-shadow:0 1px 47px 0 #ecf5ff}.l-content--heading{display:block;padding-top:40px;padding-bottom:25px}.l-content--heading h1{margin:0;padding:0;color:#2a3644;font-size:25px;font-weight:500;line-height:29px}.l-footer{background:#1d2a3a;background:var(--color--blue-dark);color:#fff;padding-top:70px}.o-btn{display:inline-block;border:0;padding:13px 24px 12px;cursor:pointer;border-radius:3px;font-weight:500;text-decoration:none;font-family:inherit}.c-btn--header{margin-right:28px}.c-btn--main{color:#fff;background:#1fb299;background:var(--color--green)}.c-btn--main:hover{background:#149a83;background:var(--color--green-darker)}.c-btn--alt{padding:10px 15px;background:#e8f0ff;color:#004ed4}.c-btn--alt:after{float:right;margin:6px 0 0 20px;content:"";width:7px;height:7px;border:1px solid #004ed4;border-width:2px 2px 0 0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.c-btn--fill{width:100%}.o-nav{margin:0;padding:0;list-style:none}.c-cookies-warning{display:none}.c-contact{padding:50px 0}.c-contact--inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:980px;margin:0 auto}.c-contact--content{-webkit-box-flex:1;-ms-flex:1 1 40%;flex:1 1 40%;max-width:500px;color:#2a3644;font-weight:500;line-height:29px;padding:75px 0 0 90px}.c-contact--content h3{margin:0 0 15px;font-size:25px}.c-contact--content p{margin:0 0 20px}.c-contact--form{-webkit-box-flex:1;-ms-flex:1 1 40%;flex:1 1 40%;max-width:420px}.c-data-controller{margin-bottom:35px;padding:15px 0 10px;text-align:center;font-size:13px;line-height:1;font-weight:300}.c-data-controller p{margin:0 0 10px}.c-feedbacks{padding:50px 0 70px;background:linear-gradient(134.06deg,#fff,#cbe2ec)}.c-feedbacks--inner{position:relative;overflow:hidden;width:640px;height:300px;margin:0 auto}.c-feedbacks--heading{color:#2a3644;margin:0 0 40px;padding:0;font-size:25px;font-weight:500;line-height:29px;text-align:center}.c-feedbacks--section{padding-top:40px}.c-feedbacks--section-inner{position:relative;height:140px;width:574px;margin:0 auto;padding:68px 0 0;border-radius:23px;background-color:#fff}.c-footer-separator{margin-bottom:25px;border-color:#fff;border-width:2px 0 0;opacity:.29}.c-form{padding:38px 35px 20px;border-radius:3px;background-color:#fff;-webkit-box-shadow:0 1px 47px 0 #ecf5ff;box-shadow:0 1px 47px 0 #ecf5ff}.c-form--row{position:relative;margin-bottom:20px}.c-form--label{display:block;color:#2a3644;font-size:15px;line-height:18px;margin-bottom:4px;font-weight:500}.c-form--input-wrap{border-radius:3px;border:1px solid #d4d4d4}.c-form--input{width:100%;padding:10px;border:0;background:none}.c-form--submit-wrap{padding:10px 0}.c-form--checkbox-wrap{display:-webkit-box;display:-ms-flexbox;display:flex}.c-form--checkbox{position:absolute;top:0;left:-9999px;visibility:hidden}.c-form--checkbox:checked+label:before{border-color:#d4d4d4}.c-form--checkbox:checked+label:after{content:"✔"}.c-form--label-checkbox{position:relative;margin:0 0 0 31px;color:#868f98;font-size:12px;line-height:17px}.c-form--label-checkbox:before{content:"";position:absolute;top:0;left:-31px;height:18px;width:18px;border:1px solid #d4d4d4;border-radius:3px;cursor:pointer}.c-form--label-checkbox:after{content:"";position:absolute;top:-2px;left:-28px;width:20px;height:20px;border-radius:3px;color:#1fb299;color:var(--color--green);font-size:22px;cursor:pointer}.c-jobs--headline{min-height:29px;margin:0 0 25px;padding:20px 20px 0;color:#2a3644;font-size:25px;font-weight:500;line-height:29px}.c-logo{width:81px;margin-right:89px;padding:11px 0;text-decoration:none}.c-logo,.c-logo--svg{display:block}.c-nav--main{display:-webkit-box;display:-ms-flexbox;display:flex}.c-nav--sub{display:none}.c-phone{white-space:nowrap;margin-right:35px;padding:10px 0;text-decoration:none;color:inherit;font-weight:500}.c-phone svg{float:left;margin:-6px 5px 0 0}.c-trust{background:linear-gradient(134.06deg,#70b7d5,#7bcbcf)}.c-trust--inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-top:64px;padding-bottom:64px}.c-trust--heading{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;margin:0;color:#fff}.c-trust--logos{-webkit-box-flex:10;-ms-flex:10 1 auto;flex:10 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:distribute;justify-content:space-around}.c-trust--logo{border:1px solid #fff;width:100px;height:40px}.c-values{background:linear-gradient(138.69deg,#4eacd9,#2fb8a1);color:#fff}.c-values--inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-top:60px;padding-bottom:40px}.u-fill--inherit{fill:currentColor}.u-hidden{display:none}@media (min-width:48em){.l-content--heading h1{padding-left:300px}.l-aside{-webkit-box-flex:0;-ms-flex:0 0 280px;flex:0 0 280px}.l-aside--position{-webkit-box-flex:0;-ms-flex:0 0 420px;flex:0 0 420px;padding-left:100px}.l-main{-ms-flex:1 1 100%;flex:1 1 100%}.l-main,.l-nav{-webkit-box-flex:1}.l-nav{-ms-flex:1 1 auto;flex:1 1 auto}}
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
...@@ -113,7 +113,7 @@ document.querySelectorAll('.js-job-action').forEach(function (node) { ...@@ -113,7 +113,7 @@ document.querySelectorAll('.js-job-action').forEach(function (node) {
}); });
</script> </script>
<script src="/wp-content/themes/biuro/js/main-dd8a9e47.min.js" async></script> <script src="/wp-content/themes/biuro/js/main.min.js" async></script>
<?php wp_footer(); ?> <?php wp_footer(); ?>
</body> </body>
</html> </html>
...@@ -32,16 +32,16 @@ define('cityID', $cityID); ...@@ -32,16 +32,16 @@ define('cityID', $cityID);
?> ?>
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
<style><?php include 'css/core-04bfbb6b61.min.css'; ?></style> <style><?php include 'css/core.min.css'; ?></style>
<link rel="preload" href="/wp-content/themes/biuro/css/main-06e3f22df9.min.css" as="style" onload="this.rel='stylesheet'"> <link rel="preload" href="/wp-content/themes/biuro/css/main.min.css" as="style" onload="this.rel='stylesheet'">
<link rel="preload" href="/wp-content/themes/biuro/fonts/pt_sans_narrow.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/wp-content/themes/biuro/fonts/pt_sans_narrow.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="/wp-content/themes/biuro/fonts/pt_sans_narrow_bold.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/wp-content/themes/biuro/fonts/pt_sans_narrow_bold.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="/wp-content/themes/biuro/fonts/bebas-neue.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="/wp-content/themes/biuro/fonts/bebas-neue.woff2" as="font" type="font/woff2" crossorigin>
<noscript> <noscript>
<link rel="stylesheet" href="/wp-content/themes/biuro/css/main-06e3f22df9.min.css"> <link rel="stylesheet" href="/wp-content/themes/biuro/css/main.min.css">
</noscript> </noscript>
<?php wp_head(); ?> <?php wp_head(); ?>
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment