Created a login box

app/Resources/views/main_template.html.twig

@@ -39,6 +39,19 @@
 						<div id="profil-szerkesztes"><a href="{{ path('KekRozsakFrontBundle_profile_edit') }}">Profil szerkesztése</a></div>
 					</div>
 				</div>
+{% else %}
+				<div id="login-gomb">
+					<span id="login-mutato">Bejelentkezés</span>
+					<div id="login-box">
+						<div id="login-belso">
+							<form method="post" action="{{ path('KekRozsakSecurityBundle_login_check') }}">
+								Felhasználónév: <input type="text" name="_username" /><br />
+								Jelszó: <input type="password" name="_password" /><br />
+								<button type="submit">Bejelentkezés</button>
+							</form>
+						</div>
+					</div>
+				</div>
 {% endif %}
 				<div id="search-box">
 					<input type="text" />
@@ -92,6 +105,7 @@
 			</div>
 		</div>
 		<script type="text/javascript">
+{% if app.user %}
 			$('#profil-mutato').click(function() {
 				if ($('#profil-box').is(':visible'))
 				{
@@ -102,6 +116,18 @@
 					$('#profil-box').show();
 				}
 			});
+{% else %}
+			$('#login-mutato').click(function() {
+				if ($('#login-box').is(':visible'))
+				{
+					$('#login-box').hide();
+				}
+				else
+				{
+					$('#login-box').show();
+				}
+			});
+{% endif %}
 		</script>
 {% block bottomscripts %}{% endblock %}
 	</body>

web/css/kekrozsak_front.css

@@ -33,6 +33,11 @@ body {
 	padding: 5px;
 }
 
+#top-line #login-gomb {
+	float: left;
+	padding: 5px;
+}
+
 #top-line #profil-gomb {
 	float: left;
 	padding: 5px;
@@ -69,6 +74,23 @@ body {
 	right: 5px;
 }
 
+#login-box {
+	position: fixed;
+	left: 5px;
+	top: 32px;
+	width: 300px;
+	height: 100px;
+	background-color: #c4d3ff;
+	border: 2px solid #152967;
+	color: #152967;
+	display: none;
+}
+
+#login-belso {
+	position: relative;
+	padding: 5px;
+}
+
 #bottom-line {
 	position: fixed;
 	left: 0;