diff --git a/web/index.jsp b/web/index.jsp index f6b54de..b633729 100644 --- a/web/index.jsp +++ b/web/index.jsp @@ -9,36 +9,33 @@ - Pocket Messenger Web - - - + PM_web_login + - - -
-
-

Welcome to Pocket Messenger

-
-
- -
-
-
-
Pocket Messenger
-
For geeks by geeks
-
- -
- - - -
Забыли пароль?
-
- - -
Нет аккаунта? Регистрация
- -
- + +
+
+ +
+
+
+
+ + + +
<%if (request.getAttribute("error_msg") != null) { + out.println("

" + request.getAttribute("error_msg") + "

"); + }%>
+
Забыли пароль?
+
+
Нет аккаунта?   Регистрация
+
+
+

Pocket Messenger

+

For geeks by geeks

+
+ +
+ + diff --git a/web/views/add.jsp b/web/views/add.jsp index 6988939..16ab2b2 100644 --- a/web/views/add.jsp +++ b/web/views/add.jsp @@ -12,43 +12,43 @@ +
+ <% + if(request.getAttribute("userName") != null){ + out.println("

User " + request.getAttribute("userName") + " added!

"); + } + %> +
+
- <% - if(request.getAttribute("userName") != null){ - out.println("

User " + request.getAttribute("userName") + " added!

"); - } - %> +

ADD USER

-
-
-

ADD USER

-
-
- + + - + - + - + - -
+ + -
+
-
- -
+
+ +
diff --git a/web/views/styles/images/Ellipse_big.png b/web/views/styles/images/Ellipse_big.png index e767c36..7ec4f08 100644 Binary files a/web/views/styles/images/Ellipse_big.png and b/web/views/styles/images/Ellipse_big.png differ diff --git a/web/views/styles/images/background.jpg b/web/views/styles/images/background.jpg new file mode 100644 index 0000000..32b7593 Binary files /dev/null and b/web/views/styles/images/background.jpg differ diff --git a/web/views/styles/style.css b/web/views/styles/style.css index 6dad2d0..aad21ea 100644 --- a/web/views/styles/style.css +++ b/web/views/styles/style.css @@ -1,150 +1,176 @@ -/*---------------------BEGIN LOGIN WINDOW-------------------------------*/ -.login_380_600 { - width: 380px; - height: 600px; - margin: auto; - background-image: url(images/clement-h-544786-unsplash.png); +/* Generated by less 2.5.1 */ +* { + margin: 0; + padding: 0; +} +main { + margin: 0 auto; + width: 1170px; position: relative; - font-family: Roboto; - z-index: 1; } - +.content { + width: 1170px; + background-image: url(images/background.jpg); + background-repeat: no-repeat; + min-height: 780px; + position: absolute; + z-index: 200; +} .restangle_2_1 { - width: 280px; - height: 392px; - margin: auto; - background-image: url(images/Rectangle.png); - position: relative; - z-index: 10; + width: 395.46px; + height: 518.7px; + filter: blur(5px); + position: absolute; + background-image: url(images/background.jpg); + background-repeat: no-repeat; + background-position: -387.27px -85.8px; + overflow: hidden; + top: 85.8px; + left: 387.27px; +} +.restangle_2_2 { + width: 393.46px; + height: 516.7px; + border: 1px #000000 solid; + position: absolute; + top: 85.8px; + left: 387.27px; + background-color: #84DBFF; + opacity: 0.16; + border-radius: 8px; +} +.restangle_2_3 { + width: 393.46px; + height: 516.7px; + position: absolute; + top: 86.8px; + left: 388.27px; + border-radius: 8px; + z-index: 400; +} +.restangle_2_3:hover { + outline: 1px #ffe684 solid; } - .ellipse_big { - margin: auto; - width: 300px; - height: 120px; + width: 393.46px; + height: 238.928px; position: absolute; - background-image: url(images/Ellipse_big.png); + top: 86.388px; + left: 388.27px; + background-image: url(images/ellipse_big.png); background-repeat: no-repeat; - top: 0px; - left: 38px; - z-index: 100; + background-size: 441.34288948px 441.34288948px; + background-position: center -246.31578947px; + border-radius: 8px; + overflow: hidden; +} +.pocket_messenger, +.for_geeks_by_geeks { + color: #004F70; + font-family: sans-serif, Roboto; } - .pocket_messenger { position: absolute; width: 100%; + top: 110.00376081px; + z-index: 110; +} +.pocket_messenger h1 { font-size: 32px; - color: #004F70; font-weight: 100; letter-spacing: 1px; text-align: center; - top: 10px; - z-index: 110; } - .for_geeks_by_geeks { position: absolute; width: 100%; - font-size: 11px; - color: #004F70; - font-weight: 900; + top: 160px; + z-index: 110; +} +.for_geeks_by_geeks h2 { + font-size: 18px; + font-weight: 100; letter-spacing: 1px; text-align: center; - top: 45px; - z-index: 110; } - .ellipse_small { + width: 68.7628563px; + height: 68.7628563px; + background-color: #E6F8FF; + border-radius: 68.7628563px; position: absolute; - width: 50px; - height: 50px; - background-image: url(images/Ellipse_small.png); - z-index: 110; - top: 64px; - left: 165px; + top: 86.388px; + left: 550.61857185px; + top: 195px; + box-shadow: 0px 2px 5px #999; +} +.restangle_2_3 input { + display: block; + position: absolute; + left: 18%; + border: 1px #ffe684 solid; + border-radius: 8px; + background-color: #b8c5cb; + width: 62%; + z-index: 200; + font-size: 14px; + font-style: italic; + padding-left: 10px; + color: #111111; +} +.restangle_2_3 input:focus { + background-color: #eee; } - -/*BEGIN OF FORGOT PASSWORD*/ .forgot_pass { position: absolute; - left: 21%; - top: 47%; + left: 18%; + top: 65.5%; z-index: 300; } - .forgot_pass a { color: #ffe684; text-decoration: none; font-size: 12px; } - .forgot_pass a:hover { text-decoration: underline; } - -/*END OF FORGOT PASWORD*/ - -/*BEGIN OF FORM*/ -input { - display: block; - position: absolute; - left: 20%; - border: 1px #ffe684 solid; - border-radius: 8px; - background-color: #b8c5cb; - width: 57%; - z-index: 200; - font-size: 14px; - font-style: italic; - padding-left: 10px; - color: #111111; -} -/*END OF FORM*/ - -/*BEGIN OF FORM'S FIELDS*/ #log_in { background-color: #ffe684; color: #004f70; font-size: 16px; letter-spacing: 1px; font-style: normal; - width: 60%; - top: 52%; - height: 7%; + width: 65%; + top: 71%; + height: 8%; +} +#log_in:hover { + cursor: pointer; } - #mail, #pass { - height: 6.5%; + height: 7.5%; } - #mail { - top: 28%; + top: 46.3%; + text-transform: lowercase; } - #pass { - top: 39%; + top: 57.8%; } - -/*END OF FORM'S FIELDS*/ - -/*BEGIN OF REGISTRATION*/ .registration { position: absolute; - left: 21%; - top: 61%; + left: 18%; + top: 79.5%; z-index: 300; font-size: 12px; color: #e2e2e2; } - .registration a { color: #ffe684; text-decoration: none; } - .registration a:hover { text-decoration: underline; } -/*END OF REGISTRATION*/ -/*---------------------END LOGIN WINDOW---------------------------------*/ \ No newline at end of file