Ghost/ghost/admin/assets/sass/layouts/setup.scss
2014-08-06 14:36:35 +03:00

129 lines
2.4 KiB
SCSS

//
// Setup
// --------------------------------------------------
// Slug: /ghost/setup/
// --------------------------------------------------
// These styles cover /ghost/setup/ which is the first
// screen that appears on a new Ghost install
.ghost-setup {
color: $midgrey;
background: $darkgrey;
@media (max-width: 550px) {
background: darken($darkgrey, 5%);
}
main {
top: 15px;
@media (max-width: 550px) {
top: 0;
}
}
}
// The wrapper to center the form in all ways
.setup-box {
display: table;
max-width: 500px;
height: 90%;
margin: 0 auto;
padding: 0;
}
// The form itself with the dark background
.setup-form {
max-width: 530px;
padding: 40px;
color: lighten($midgrey, 15%);
background: darken($darkgrey, 5%);
border-radius: 2px;
@media (max-width: 400px) {
padding: 15px;
}
header {
margin-bottom: 30px;
}
label {
// width: 90px;
color: $lightgrey;
font-weight: 300;
@media (max-width: 550px) {
width: 100%;
}
}
// .form-group {
// padding-left: 110px;
// @media (max-width: 550px) {
// padding-left: 0;
// }
// }
input {
// width: 300px;
padding: 7px;
border: none;
color: #fff;
background: lighten($darkgrey, 10%);
@include transition(background ease 0.25s);
// @media (max-width: 550px) {
// width: 100%;
// }
&:focus {
border:none;
background: lighten($darkgrey, 15%);
}
}
// Chrome auto-fill style
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px $lightgrey inset !important;
}
h1 {
margin: 0;
font-weight: 200;
font-size: 26px;
color: $lightgrey;
@media (max-width: 550px) {
font-size: 20px;
}
}
h2 {
margin: 6px 0 0 0;
padding: 0;
border: none;
font-weight: 200;
font-size: 16px;
color: $midgrey;
@media (max-width: 550px) {
font-size: 14px;
}
}
p {
font-size: 12px;
line-height: 1.4em;
color: $midgrey;
}
footer {
margin: 30px 0 5px 0;
}
.btn-green {
width: 100%;
padding: 0.9em 1.8em;
font-size: 13px;
}
}