hypothetical/resources/assets/less/pages/contact.less

54 lines
1.5 KiB
Text
Raw Normal View History

body.contact {
#contact-form {
@trans-speed: 100ms;
margin-top: 35px;
margin-bottom: 20px;
input, textarea {
width: 100%;
margin-bottom: 20px;
padding: 5px 10px;
font-size: 14px;
background-color: rgba(255, 255, 255, 0.8);
border: 2px solid fade(@c_text, 25%);
transition: border @trans-speed;
&:focus { border: 2px solid fade(@c_base, 60%); }
&.error { border: 2px solid @c_error; }
}
textarea {
resize: none;
height: 150px;
}
#submit {
text-align: center;
font-weight: bold;
color: @c_text_light;
background-color: lighten(@c_base, 5%);
transition: background-color @trans-speed;
&:hover { background-color: @c_base; }
&.disabled { background-color: @c_base; }
}
#notification {
margin: 0px auto 15px auto;
padding: 5px 10px;
color: @c_text_light;
text-align: center;
font-size: 14px;
opacity: 0;
background-color: lighten(@c_error, 15%);
transition: opacity @trans-speed;
span { font-weight: bold; }
&.visible { opacity: 1; }
&.success {
background-color: transparent;
color: @c_text;
font-weight: bold;
}
}
}
}