Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-27 22:49:56 -05:00
Code Issues Activity

Refactor auth form styles

Browse source 
Closes #4246

- Removed the input wrapper background colour
- Moved `:focus` styles to one element, so its not defined separate for each page
- Removed unnecessary MQ for body background colour (it changed nothing)
This commit is contained in:
Paul Adam Davis 2014-10-07 21:49:58 +01:00
parent 58ec6e0ac9
commit 5330b5612d
1 changed files with 6 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
core/client/assets/sass/layouts/auth.scss
View file

@ -13,10 +13,6 @@
color: $midgrey; color: $midgrey;
background: $darkgrey; background: $darkgrey;
@media (max-width: 400px) {
background: $darkgrey;
}
main { main {
padding-top: 15px; padding-top: 15px;
} }
@ -27,10 +23,15 @@
font-weight: 200; font-weight: 200;
border: none; border: none;
color: #fff; color: #fff;
background: transparent; background: lighten($darkgrey, 10%);
box-shadow: none; box-shadow: none;
margin: 0; margin: 0;
position: relative; position: relative;
transition: background ease 0.25s;
&:focus {
border: none;
background: lighten($darkgrey, 15%);
}
} }
input:-webkit-autofill { input:-webkit-autofill {
@ -74,7 +75,6 @@
.password-wrap { .password-wrap {
position: relative; position: relative;
margin: 0 0 5px 0; margin: 0 0 5px 0;
background: lighten($darkgrey, 10%);
float: left; float: left;
@media (max-width: 630px) { @media (max-width: 630px) {
@ -88,18 +88,10 @@
clear: both; clear: both;
padding: 8px 0 8px 8px; padding: 8px 0 8px 8px;
width: 216px; width: 216px;
transition: background ease 0.25s;
@media (max-width: 630px) { @media (max-width: 630px) {
width: 264px; width: 264px;
transition: none;
} }
&:focus {
border: none;
background: lighten($darkgrey, 15%);
}
} // .email, .password } // .email, .password
.email-wrap { .email-wrap {
@ -186,19 +178,10 @@
input { input {
width: 280px; width: 280px;
padding: 8px 10px; padding: 8px 10px;
@media (min-width: 631px) {
transition: background ease 0.25s;
}
@media (max-width: 630px) { @media (max-width: 630px) {
width: 264px; width: 264px;
} }
&:focus {
border: none;
background: lighten($darkgrey, 15%);
}
} }
.name-wrap { .name-wrap {
@ -254,7 +237,6 @@
.email-wrap { .email-wrap {
position: relative; position: relative;
margin: 0 0 1em 0; margin: 0 0 1em 0;
background: lighten($darkgrey, 10%);
float: left; float: left;
border-radius: 2px; border-radius: 2px;
width: 100%; width: 100%;
@ -263,12 +245,6 @@
.email { .email {
padding: 8px 10px; padding: 8px 10px;
border-radius: 2px; border-radius: 2px;
transition: background ease 0.25s;
&:focus {
border: none;
background: lighten($darkgrey, 15%);
}
} // .email } // .email
button { button {