Commit 49688d39 authored by Bryce Johnson's avatar Bryce Johnson

Add third box shadow to validation focus, for depth.

parent 2c7a1af6
......@@ -40,7 +40,7 @@
p {
font-size: 13px;
}
.login-box {
.login-box, .omniauth-container {
box-shadow: 0 0 0 1px $border-color;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 2px;
......@@ -79,69 +79,57 @@
background: transparent;
}
.form-control {
font-size: 14px;
padding: 10px 8px;
width: 100%;
height: auto;
&.top {
border-radius: 5px 5px 0 0;
margin-bottom: 0;
}
// Styles the glowing border of focused input for username async validation
.login-body {
font-size: 13px;
&.bottom {
border-radius: 0 0 5px 5px;
border-top: 0;
margin-bottom: 20px;
}
}
// Styles the glowing border of focused input for username async validation
.login-body {
font-size: 13px;
input + p {
margin-top: 5px;
}
.gl-field-success-outline {
border: 1px solid $green-normal;
input + p {
margin-top: 5px;
}
&:focus {
box-shadow: 0 0 0 1px $green-normal inset, 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 4px 0 $green-normal;
border: 0 none;
}
}
.gl-field-success-outline {
border: 1px solid $green-normal;
.gl-field-error-outline {
border: 1px solid $red-normal;
&:focus {
box-shadow: 0 0 0 1px $green-normal inset, 0 0 4px 0 $green-normal;
border: 0 none;
&:focus {
box-shadow: 0 0 0 1px $red-normal inset, 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 4px 0 rgba(210, 40, 82, 0.6);
border: 0 none;
}
}
}
.gl-field-error-outline {
border: 1px solid $red-normal;
.username .validation-success,
.gl-field-success-message {
color: $green-normal;
}
&:focus {
opacity: .6;
box-shadow: 0 0 0 1px $red-normal inset, 0 0 4px 0 $red-normal;
border: 0 none;
.username .validation-error,
.gl-field-error-message {
color: $red-normal;
}
}
.username .validation-success,
.gl-field-success-message {
color: $green-normal;
}
.gl-field-hint {
color: $gl-text-color;
}
.username .validation-error,
.gl-field-error-message {
color: $red-normal;
}
}
.gl-field-hint {
color: $gl-text-color;
.omniauth-container {
p {
margin: 0;
}
}
.new-session-tabs { // Are these being applied to other login-related screens? They need to be.
.new-session-tabs {
display: -webkit-flex;
display: flex;
box-shadow: 0 0 0 1px $border-color;
border-top-right-radius: 2px;
......@@ -151,10 +139,6 @@
flex: 1;
text-align: center;
&.middle {
border-top: 0;
margin-bottom: 0;
border-radius: 0;
&:last-of-type {
border-left: 1px solid $border-color;
}
......@@ -204,7 +188,7 @@
input[type="submit"] {
@extend .btn-block;
margin-bottom: 0px;
margin-bottom: 0;
}
.devise-errors {
......
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