fix to mobile
Showing
1 changed file
with
84 additions
and
25 deletions
| ... | @@ -99,6 +99,9 @@ body.login { | ... | @@ -99,6 +99,9 @@ body.login { |
| 99 | left:0; | 99 | left:0; |
| 100 | top:200px; | 100 | top:200px; |
| 101 | } | 101 | } |
| 102 | #login { | ||
| 103 | padding:10% 0 0; | ||
| 104 | } | ||
| 102 | } | 105 | } |
| 103 | 106 | ||
| 104 | 107 | ||
| ... | @@ -220,6 +223,14 @@ label { | ... | @@ -220,6 +223,14 @@ label { |
| 220 | width: 300px; | 223 | width: 300px; |
| 221 | } | 224 | } |
| 222 | 225 | ||
| 226 | @media(max-width: 700px) { | ||
| 227 | #user_pass, | ||
| 228 | #user_login, | ||
| 229 | #user_email { | ||
| 230 | width:250px; | ||
| 231 | } | ||
| 232 | } | ||
| 233 | |||
| 223 | .login #login_error, | 234 | .login #login_error, |
| 224 | .login .message, | 235 | .login .message, |
| 225 | .login .success { | 236 | .login .success { |
| ... | @@ -259,11 +270,11 @@ label { | ... | @@ -259,11 +270,11 @@ label { |
| 259 | 270 | ||
| 260 | 271 | ||
| 261 | 272 | ||
| 262 | @media (max-width: 1000px) { | 273 | @media (max-width: 1100px) { |
| 263 | 274 | ||
| 264 | #login form { | 275 | #login form { |
| 265 | width: 35%; | 276 | width: 35%; |
| 266 | margin-left: 23%; | 277 | margin-left: 15%; |
| 267 | padding: 60px 100px 100px 140px; | 278 | padding: 60px 100px 100px 140px; |
| 268 | } | 279 | } |
| 269 | 280 | ||
| ... | @@ -279,15 +290,46 @@ label { | ... | @@ -279,15 +290,46 @@ label { |
| 279 | 290 | ||
| 280 | } | 291 | } |
| 281 | 292 | ||
| 293 | #login h1 { | ||
| 294 | margin-left:15%; | ||
| 295 | } | ||
| 296 | |||
| 282 | 297 | ||
| 283 | } | 298 | } |
| 284 | 299 | ||
| 285 | @media (max-width: 800px) { | 300 | @media (max-width: 1000px) { |
| 301 | #login h1 { | ||
| 302 | margin-left:23%; | ||
| 303 | } | ||
| 304 | } | ||
| 305 | |||
| 306 | @media (max-width: 900px) { | ||
| 307 | |||
| 308 | #backtoblog { | ||
| 309 | top:150px; | ||
| 310 | } | ||
| 286 | 311 | ||
| 287 | #login form { | 312 | #login form { |
| 288 | margin-top: 18%; | 313 | margin-top: 18%; |
| 289 | width: 40%; | 314 | width: 40%; |
| 290 | } | 315 | } |
| 316 | #login h1 { | ||
| 317 | margin-left:23%; | ||
| 318 | margin-top:20%; | ||
| 319 | } | ||
| 320 | } | ||
| 321 | |||
| 322 | @media (max-width: 800px) { | ||
| 323 | #login h1 { | ||
| 324 | margin-top:0; | ||
| 325 | } | ||
| 326 | } | ||
| 327 | |||
| 328 | @media (max-width: 700px) { | ||
| 329 | #backtoblog { | ||
| 330 | top:120px; | ||
| 331 | } | ||
| 332 | |||
| 291 | } | 333 | } |
| 292 | 334 | ||
| 293 | @media (max-width: 600px) { | 335 | @media (max-width: 600px) { |
| ... | @@ -300,14 +342,16 @@ label { | ... | @@ -300,14 +342,16 @@ label { |
| 300 | 342 | ||
| 301 | 343 | ||
| 302 | #login { | 344 | #login { |
| 303 | background: url(../images/logo-white-5.png) 70px 10px no-repeat !important; | 345 | background: url(../images/logo-white-5.png) 15px 15px no-repeat !important; |
| 304 | padding-top: 40%; | 346 | padding-top: 40%; |
| 305 | width: 100%; | 347 | width: 100%; |
| 306 | padding: 8% 0 0; | 348 | padding: 40px 0 0; |
| 307 | margin: auto; | 349 | margin: auto; |
| 308 | background-size: 132px 72px !important; | 350 | background-size: 132px 72px !important; |
| 309 | 351 | ||
| 310 | 352 | ||
| 353 | |||
| 354 | |||
| 311 | } | 355 | } |
| 312 | 356 | ||
| 313 | body.login { | 357 | body.login { |
| ... | @@ -331,10 +375,7 @@ label { | ... | @@ -331,10 +375,7 @@ label { |
| 331 | margin: auto; | 375 | margin: auto; |
| 332 | margin-top: -70px; | 376 | margin-top: -70px; |
| 333 | background-color: transparent; | 377 | background-color: transparent; |
| 334 | padding: 0px 100px 100px 240px; | 378 | padding: 0; |
| 335 | margin-left: -30%; | ||
| 336 | |||
| 337 | |||
| 338 | } | 379 | } |
| 339 | 380 | ||
| 340 | 381 | ||
| ... | @@ -357,17 +398,15 @@ label { | ... | @@ -357,17 +398,15 @@ label { |
| 357 | } | 398 | } |
| 358 | 399 | ||
| 359 | #login h1 { | 400 | #login h1 { |
| 401 | width:auto; | ||
| 360 | position: absolute; | 402 | position: absolute; |
| 361 | top:130px; | 403 | top:120px; |
| 362 | width:100%; | 404 | white-space: nowrap; |
| 363 | } | 405 | } |
| 364 | 406 | ||
| 365 | #login h1 span { | ||
| 366 | left:45px; | ||
| 367 | } | ||
| 368 | 407 | ||
| 369 | #login form { | 408 | #login form { |
| 370 | width: 100%; | 409 | width: auto; |
| 371 | min-height: 250px; | 410 | min-height: 250px; |
| 372 | display: block; | 411 | display: block; |
| 373 | -moz-border-radius: 0px; | 412 | -moz-border-radius: 0px; |
| ... | @@ -379,9 +418,8 @@ label { | ... | @@ -379,9 +418,8 @@ label { |
| 379 | box-shadow: none; | 418 | box-shadow: none; |
| 380 | border-radius: 0px; | 419 | border-radius: 0px; |
| 381 | border: none; | 420 | border: none; |
| 382 | padding: 60px 100px 100px 240px; | 421 | padding: 0; |
| 383 | margin-left: -34%; | 422 | margin-left: 0; |
| 384 | margin-top: 22%; | ||
| 385 | /* background: url(../images/login.png) 0px 0px no-repeat; */ | 423 | /* background: url(../images/login.png) 0px 0px no-repeat; */ |
| 386 | /* background-size: 672px 398px !important; */ | 424 | /* background-size: 672px 398px !important; */ |
| 387 | /* background-position: top; */ | 425 | /* background-position: top; */ |
| ... | @@ -393,8 +431,33 @@ label { | ... | @@ -393,8 +431,33 @@ label { |
| 393 | } | 431 | } |
| 394 | 432 | ||
| 395 | 433 | ||
| 434 | #login h1 span { | ||
| 435 | left:0; | ||
| 436 | top:20px; | ||
| 437 | } | ||
| 438 | |||
| 439 | #loginform { | ||
| 440 | padding:15% !important; | ||
| 441 | margin-top:80px !important; | ||
| 442 | } | ||
| 443 | |||
| 444 | h1 { | ||
| 445 | margin-left:15% !important; | ||
| 446 | width:100%; | ||
| 396 | 447 | ||
| 448 | } | ||
| 397 | 449 | ||
| 450 | label { | ||
| 451 | margin-left:0 !important; | ||
| 452 | } | ||
| 453 | |||
| 454 | #backtoblog { | ||
| 455 | |||
| 456 | left:auto; | ||
| 457 | right:0; | ||
| 458 | top:0; | ||
| 459 | |||
| 460 | } | ||
| 398 | 461 | ||
| 399 | 462 | ||
| 400 | 463 | ||
| ... | @@ -402,8 +465,7 @@ label { | ... | @@ -402,8 +465,7 @@ label { |
| 402 | 465 | ||
| 403 | @media (max-width: 420px) { | 466 | @media (max-width: 420px) { |
| 404 | #login form { | 467 | #login form { |
| 405 | width: 140%; | 468 | width: 100%; |
| 406 | margin-left: -55%; | ||
| 407 | background-size: 872px 398px !important; | 469 | background-size: 872px 398px !important; |
| 408 | } | 470 | } |
| 409 | 471 | ||
| ... | @@ -414,7 +476,6 @@ label { | ... | @@ -414,7 +476,6 @@ label { |
| 414 | } | 476 | } |
| 415 | 477 | ||
| 416 | .login #nav { | 478 | .login #nav { |
| 417 | margin-left: -55%; | ||
| 418 | 479 | ||
| 419 | } | 480 | } |
| 420 | 481 | ||
| ... | @@ -436,7 +497,7 @@ label { | ... | @@ -436,7 +497,7 @@ label { |
| 436 | @media (max-width: 380px) { | 497 | @media (max-width: 380px) { |
| 437 | #login form { | 498 | #login form { |
| 438 | width: 140%; | 499 | width: 140%; |
| 439 | margin-left: -65%; | 500 | margin-left:0; |
| 440 | background-size: 872px 398px !important; | 501 | background-size: 872px 398px !important; |
| 441 | } | 502 | } |
| 442 | 503 | ||
| ... | @@ -447,12 +508,10 @@ label { | ... | @@ -447,12 +508,10 @@ label { |
| 447 | } | 508 | } |
| 448 | 509 | ||
| 449 | .login #nav { | 510 | .login #nav { |
| 450 | margin-left: -65%; | ||
| 451 | |||
| 452 | } | 511 | } |
| 453 | 512 | ||
| 454 | #backtoblog { | 513 | #backtoblog { |
| 455 | top: -10px; | 514 | top: 30px; |
| 456 | left: unset; | 515 | left: unset; |
| 457 | right: 0; | 516 | right: 0; |
| 458 | 517 | ... | ... |
-
Please register or sign in to post a comment