Login WEBootstrap

[giankocr]

Hi please add something code to fixed, the login screen
` /***

"WeBootstrap" Login theme for WebERP

by gianko.com.

***/
/* $Id: login.css 5657 2016-09-10 $*/

@import url(http://fonts.googleapis.com/css?family=Raleway);
@import url('/css/bootstrap.css');
#login_logo {
    /*background: url('images/logo.jpg') no-repeat scroll center center #FFFFFF;
    border-radius: 1px 19px 1px 19px;
    height: 60px;
    */
    margin: 15% 0px 10px 0px;
}

body {
    background: url('images/background.jpg')center fixed no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 0;
    margin: 0;
}

.wrap {
    width: 100%;
    height: 100%;
    min-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
}

p.form-title {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: #FFFFFF;
    margin-top: 5%;
    text-transform: uppercase;
    letter-spacing: 4px;
}

.box {
    background-color: lightblue;
}

 ::-webkit-input-placeholder {
    color: #FFFFFF;
}

 :-moz-placeholder {
    /* Firefox 18- */
    color: #FFFFFF;
}

 ::-moz-placeholder {
    /* Firefox 19+ */
    color: #FFFFFF;
}

 :-ms-input-placeholder {
    color: #FFFFFF;
}

form.login input[type="text"],
form.login input[type="password"] {
    width: 100%;
    margin: 0;
    padding: 5px 10px;
    background: 0;
    border: 0;
    border-bottom: 1px solid #FFFFFF;
    outline: 0;
    font-style: italic;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-bottom: 5px;
    color: #FFFFFF;
    outline: 0;
}

form.login input[type="submit"] {
    width: 100%;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    margin-top: 16px;
    outline: 0;
    cursor: pointer;
    letter-spacing: 1px;
}

form.login input[type="submit"]:hover {
    transition: background-color 0.5s ease;
}

form.login .remember-forgot {
    float: left;
    width: 100%;
    margin: 10px 0 0 0;
}

form.login .forgot-pass-content {
    min-height: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.login {
    font-size: 18px;
    font-weight: 900;
    color: #2ecc71;
}

form.login a {
    transition: color 0.5s ease;
}

form.login a:hover {
    color: #2ecc71;
}

.button {
    background: #b83737 !important;
    -webkit-border-radius: 10 !important;
    -moz-border-radius: 10 !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    font-family: 'Times New Roman', Times, serif;
    font-size: 14px !important;
    padding: 10px 20px 10px 20px !important;
    text-decoration: none !important;
    margin-top: 20px;
    border: 0px !important;
    height: 40px !important;
}

.button:hover {
    background: #37b8ae !important;
    text-decoration: none !important;
}

.pr-wrap {
    width: 100%;
    height: 100%;
    min-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    display: none;
}

.show-pass-reset {
    display: block !important;
}

.pass-reset {
    margin: 0 auto;
    width: 250px;
    position: relative;
    margin-top: 22%;
    z-index: 999;
    background: #FFFFFF;
    padding: 20px 15px;
}

.pass-reset label {
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 15px;
}

.pass-reset input[type="email"] {
    width: 100%;
    margin: 5px 0 0 0;
    padding: 5px 10px;
    background: 0;
    border: 0;
    border-bottom: 1px solid #000000;
    outline: 0;
    font-style: italic;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-bottom: 5px;
    color: #000000;
    outline: 0;
}

.pass-reset input[type="submit"] {
    width: 100%;
    border: 0;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    margin-top: 10px;
    outline: 0;
    cursor: pointer;
    letter-spacing: 1px;
}

.pass-reset input[type="submit"]:hover {
    transition: background-color 0.5s ease;
}

.posted-by {
    position: absolute;
    bottom: 26px;
    margin: 0 auto;
    color: #FFF;
    background-color: rgba(0, 0, 0, 0.66);
    padding: 10px;
    left: 45%;
}

#userpass {
    margin-top: 50px;
}

#login_box {
    background-color: #fff;
    border: 1px solid transparent;
    text-align: center;
    width: 25%;
    padding: 50px;
    border-radius: 20px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#login_box form div input {
    border-radius: 5px;
    width: 90%;
    height: 20px;
}

#login_box form div select{
border-radius: 5px;
width: 90%;
height: 35px;}
´

And this image in ( .css\WEBootstrap\images)

[TurboPT]

I have not yet done a diff, but what was the login issue?
...and why a new image? Could we not use CSS to replace the image, as it only appears to be a black rectangle? (or at least that's how the image provided above appears to be in my browser)

[timschofield]

@TurboPT: I think the WEBootstrap theme was written by Gian in the first place so he is just improving it.
@giankocr: Hola Gian! The best way of getting this into the code is to fork the repository, and then apply this change, and send a pull request in.

Thanks
Tim

[andrewcouling]

@giankocr You are of course free to fork which ever repository you desire, but please be advised that the official WebERP repository is at: https://github.com/webERP-team/webERP

[timschofield]

Hi Andy that repo you point to is a fork of this one so any changes there are naturally fed upstream to here so it doesn't make any difference where the code is cloned from. In Git there is no such thing as a central or official repo.

[timschofield]

I have tried this locally, and have a couple of comments.
1 No logo appears now, so there is nothing to indicate the application name at all.
2 The login box is at the top of the screen, wouldn't it look nicer centred vertically as well as horizontally?
I have only tested this on FF so cannot say how it looks in other browsers.
Tim