Skip to content

Commit 11e30dc

Browse files
Login screen modified
1 parent 954ada4 commit 11e30dc

File tree

4 files changed

+279
-0
lines changed

4 files changed

+279
-0
lines changed
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{% trans_default_domain 'FOSUserBundle' %}
2+
{% extends "FOSUserBundle::layout.html.twig" %}
3+
4+
{% block fos_user_content %}
5+
{% if error %}
6+
<div>{{ error.messageKey|trans(error.messageData, 'security') }}</div>
7+
{% endif %}
8+
9+
<form action="{{ path("fos_user_security_check") }}" method="post" class="form-signin">
10+
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
11+
<div class="login-container">
12+
<h1>Login to Your Account</h1><br>
13+
<form>
14+
<label for="username">{{ 'security.login.username'|trans }}</label>
15+
<input type="text" id="username" name="_username" value="{{ last_username }}" required="required" />
16+
<label for="password">{{ 'security.login.password'|trans }}</label>
17+
<input type="password" id="password" name="_password" required="required" />
18+
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
19+
<label for="remember_me">{{ 'security.login.remember_me'|trans }}</label>
20+
<input type="submit" class="login login-submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans }}" />
21+
</form>
22+
<div class="login-help">
23+
<a href="{{ path('user_new') }}">Register</a> - <a href="{{ path('fos_user_resetting_request') }}">Forgot Password</a>
24+
</div>
25+
</div>
26+
</form>
27+
{% endblock fos_user_content %}
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
@import url(http://fonts.googleapis.com/css?family=Roboto);
2+
3+
/****** LOGIN ******/
4+
.login-container {
5+
padding: 30px;
6+
max-width: 350px;
7+
width: 100% !important;
8+
background-color: #F7F7F7;
9+
margin: 100px auto;
10+
border-radius: 2px;
11+
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
12+
overflow: hidden;
13+
font-family: roboto;
14+
}
15+
16+
.login-container h1 {
17+
text-align: center;
18+
font-size: 1.8em;
19+
font-family: roboto;
20+
}
21+
22+
.login-container input[type=submit] {
23+
width: 100%;
24+
display: block;
25+
margin-bottom: 10px;
26+
position: relative;
27+
}
28+
29+
.login-container input[type=text], input[type=password] {
30+
height: 44px;
31+
font-size: 16px;
32+
width: 100%;
33+
margin-bottom: 10px;
34+
-webkit-appearance: none;
35+
background: #fff;
36+
border: 1px solid #d9d9d9;
37+
border-top: 1px solid #c0c0c0;
38+
/* border-radius: 2px; */
39+
padding: 0 8px;
40+
box-sizing: border-box;
41+
-moz-box-sizing: border-box;
42+
}
43+
44+
.login-container input[type=text]:hover, input[type=password]:hover {
45+
border: 1px solid #b9b9b9;
46+
border-top: 1px solid #a0a0a0;
47+
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
48+
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
49+
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
50+
}
51+
52+
.login-submit {
53+
/* border: 1px solid #3079ed; */
54+
border: 0px;
55+
color: #fff;
56+
text-shadow: 0 1px rgba(0,0,0,0.1);
57+
background-color: #4d90fe;
58+
padding: 17px 0px;
59+
font-family: roboto;
60+
font-size: 14px;
61+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#4787ed)); */
62+
}
63+
64+
.login-submit:hover {
65+
/* border: 1px solid #2f5bb7; */
66+
border: 0px;
67+
text-shadow: 0 1px rgba(0,0,0,0.3);
68+
background-color: #357ae8;
69+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#357ae8)); */
70+
}
71+
72+
.login-container a {
73+
text-decoration: none;
74+
color: #666;
75+
font-weight: 400;
76+
text-align: center;
77+
display: inline-block;
78+
opacity: 0.6;
79+
transition: opacity ease 0.5s;
80+
}
81+
82+
.login-help{
83+
font-size: 12px;
84+
}
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
@import url(http://fonts.googleapis.com/css?family=Roboto);
2+
3+
/****** LOGIN ******/
4+
.login-container {
5+
padding: 30px;
6+
max-width: 350px;
7+
width: 100% !important;
8+
background-color: #F7F7F7;
9+
margin: 100px auto;
10+
border-radius: 2px;
11+
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
12+
overflow: hidden;
13+
font-family: roboto;
14+
}
15+
16+
.login-container h1 {
17+
text-align: center;
18+
font-size: 1.8em;
19+
font-family: roboto;
20+
}
21+
22+
.login-container input[type=submit] {
23+
width: 100%;
24+
display: block;
25+
margin-bottom: 10px;
26+
position: relative;
27+
}
28+
29+
.login-container input[type=text], input[type=password] {
30+
height: 44px;
31+
font-size: 16px;
32+
width: 100%;
33+
margin-bottom: 10px;
34+
-webkit-appearance: none;
35+
background: #fff;
36+
border: 1px solid #d9d9d9;
37+
border-top: 1px solid #c0c0c0;
38+
/* border-radius: 2px; */
39+
padding: 0 8px;
40+
box-sizing: border-box;
41+
-moz-box-sizing: border-box;
42+
}
43+
44+
.login-container input[type=text]:hover, input[type=password]:hover {
45+
border: 1px solid #b9b9b9;
46+
border-top: 1px solid #a0a0a0;
47+
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
48+
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
49+
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
50+
}
51+
52+
.login-submit {
53+
/* border: 1px solid #3079ed; */
54+
border: 0px;
55+
color: #fff;
56+
text-shadow: 0 1px rgba(0,0,0,0.1);
57+
background-color: #4d90fe;
58+
padding: 17px 0px;
59+
font-family: roboto;
60+
font-size: 14px;
61+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#4787ed)); */
62+
}
63+
64+
.login-submit:hover {
65+
/* border: 1px solid #2f5bb7; */
66+
border: 0px;
67+
text-shadow: 0 1px rgba(0,0,0,0.3);
68+
background-color: #357ae8;
69+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#357ae8)); */
70+
}
71+
72+
.login-container a {
73+
text-decoration: none;
74+
color: #666;
75+
font-weight: 400;
76+
text-align: center;
77+
display: inline-block;
78+
opacity: 0.6;
79+
transition: opacity ease 0.5s;
80+
}
81+
82+
.login-help{
83+
font-size: 12px;
84+
}
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
@import url(http://fonts.googleapis.com/css?family=Roboto);
2+
3+
/****** LOGIN ******/
4+
.login-container {
5+
padding: 30px;
6+
max-width: 350px;
7+
width: 100% !important;
8+
background-color: #F7F7F7;
9+
margin: 100px auto;
10+
border-radius: 2px;
11+
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
12+
overflow: hidden;
13+
font-family: roboto;
14+
}
15+
16+
.login-container h1 {
17+
text-align: center;
18+
font-size: 1.8em;
19+
font-family: roboto;
20+
}
21+
22+
.login-container input[type=submit] {
23+
width: 100%;
24+
display: block;
25+
margin-bottom: 10px;
26+
position: relative;
27+
}
28+
29+
.login-container input[type=text], input[type=password] {
30+
height: 44px;
31+
font-size: 16px;
32+
width: 100%;
33+
margin-bottom: 10px;
34+
-webkit-appearance: none;
35+
background: #fff;
36+
border: 1px solid #d9d9d9;
37+
border-top: 1px solid #c0c0c0;
38+
/* border-radius: 2px; */
39+
padding: 0 8px;
40+
box-sizing: border-box;
41+
-moz-box-sizing: border-box;
42+
}
43+
44+
.login-container input[type=text]:hover, input[type=password]:hover {
45+
border: 1px solid #b9b9b9;
46+
border-top: 1px solid #a0a0a0;
47+
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
48+
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
49+
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
50+
}
51+
52+
.login-submit {
53+
/* border: 1px solid #3079ed; */
54+
border: 0px;
55+
color: #fff;
56+
text-shadow: 0 1px rgba(0,0,0,0.1);
57+
background-color: #4d90fe;
58+
padding: 17px 0px;
59+
font-family: roboto;
60+
font-size: 14px;
61+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#4787ed)); */
62+
}
63+
64+
.login-submit:hover {
65+
/* border: 1px solid #2f5bb7; */
66+
border: 0px;
67+
text-shadow: 0 1px rgba(0,0,0,0.3);
68+
background-color: #357ae8;
69+
/* background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4d90fe), to(#357ae8)); */
70+
}
71+
72+
.login-container a {
73+
text-decoration: none;
74+
color: #666;
75+
font-weight: 400;
76+
text-align: center;
77+
display: inline-block;
78+
opacity: 0.6;
79+
transition: opacity ease 0.5s;
80+
}
81+
82+
.login-help{
83+
font-size: 12px;
84+
}

0 commit comments

Comments
 (0)