diff --git a/frontend/style.css b/frontend/style.css index 1579667..12faaf7 100644 --- a/frontend/style.css +++ b/frontend/style.css @@ -1,3 +1,6 @@ +* { + box-sizing: border-box; +} body { background-color: dimgrey; @@ -22,43 +25,55 @@ body { .container { display: flex; background-color: transparent; - backdrop-filter: blur(30px); + backdrop-filter: blur(20px); justify-content: center; align-items: center; - width: 300px; - height: 250px; + width: 500px; + height: 450px; flex-direction: column; padding: 70px; - padding-bottom: 80px; - box-shadow: 7px 7px 5px rgb(0, 0, 0, 0.5); + padding-bottom: 90px; + box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.6); row-gap: 8px; border-radius: 50px; - border-top: rgba(255, 255, 255, 0.2) 5px solid; - border-left: rgb(255, 255, 255, 0.2) 5px solid; } #login { + display: block; text-align: center; font-family: 'Pixelify Sans', cursive; font-size: 50px; - text-shadow: 2px 2px 5px grey; + text-shadow: 2px 2px 5px rgb(0, 0, 0); color: white; - float: initial; } .input { width: 300px; height: 30px; background-color: transparent; - color: white; + color: rgb(255, 255, 255, 0.8); box-shadow: 2px 2px 3px rgb(0, 0, 0, 0.5); + border: none; border-top: rgba(255, 255, 255, 0.2) 2px solid; border-left: rgb(255, 255, 255, 0.2) 2px solid; border-radius: 10px; + padding-left: 5px; } -#username { +.idiv p { + color: white; + font-family: 'Pixelify Sans', cursive; + margin-left: 5px; +} +#username::placeholder { + color: rgb(255, 255, 255, 0.5); + padding-left: 5px; +} + +#password::placeholder { + color: rgb(255, 255, 255, 0.5); + padding-left: 5px; } .idiv { @@ -69,13 +84,16 @@ body { padding: 7px; } -.buttons { - padding: 10px; +.idiv p{ + padding: none; + margin: none; + display: absolute; + translate: 0px 12px; } #loginb { background-color: transparent; - color: white; + color: rgb(255, 255, 255, 0.8); padding: 7px; margin-top: 20px; margin-bottom: 20px; @@ -87,6 +105,32 @@ body { border-radius: 10px; } -#loginb:focus { - background-color: grey; +#loginb:active { + background-color: rgb(155, 155, 155, 0.3); +} + +.help { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + +} + +.help div{ + display: flex; + width: 50%; + justify-content: center; +} + +a { + text-decoration: none; + color: rgba(255, 255, 255, 0.5); + text-align: center; + font-family: 'Poppins', sans-serif; + font-size: 12px; +} + +a:active { + color: rgb(196, 196, 196, 10); } \ No newline at end of file diff --git a/index.html b/index.html index 8d15cb9..cbdacf4 100644 --- a/index.html +++ b/index.html @@ -13,13 +13,22 @@