From 78197744e15b3b00d7b1bc8762516372c4abf34a Mon Sep 17 00:00:00 2001 From: Nikola-Mircic Date: Mon, 3 Jan 2022 22:05:59 +0100 Subject: [PATCH 1/2] Header css done --- client/assets/css/main.css | 57 ++++++++++++++++++++++++++------------ client/index.html | 8 +++++- 2 files changed, 46 insertions(+), 19 deletions(-) diff --git a/client/assets/css/main.css b/client/assets/css/main.css index 1ae1b68..2e539c1 100644 --- a/client/assets/css/main.css +++ b/client/assets/css/main.css @@ -8,9 +8,11 @@ } body{ - padding: 0 5% 0 5%; margin: 0; background-color: rgb(76, 162, 233); + width: 100%; + min-width: fit-content; + box-sizing: border-box; } /*input[type="button"]:hover { @@ -18,6 +20,7 @@ body{ }*/ #header { + -webkit-appearance: none; display: flex; justify-content: space-around; flex-flow: column; @@ -25,9 +28,8 @@ body{ flex-direction: row; align-items: center; padding: 0.5rem 15px 0.5rem 15px; - background-color: rgba(126, 104, 250, 0.5); - border-radius: 15px; - border-width: 5px 10px 5px 10px; + background-color: rgba(33, 61, 187, 0.486); + border-bottom-width: 5px; border-style: solid; border-color: rgba(16, 14, 54, 0.9); /*width: 90%;*/ @@ -37,9 +39,9 @@ body{ } #headerContainer{ - display: flex; + display: block; width:50%; - min-width: 400px; + min-width: 500px; text-align: center; } @@ -48,29 +50,35 @@ body{ } #header h1{ - color: rgba(16, 14, 54, 0.9); + color: rgba(16, 14, 54); + background-color: #eeeeee55; font-size: 45px; font-weight: 5px; - font-family: sans-serif; + font-family: 'Times New Roman', Times, serif; + border: 2px solid #202020; + padding-top: 0.2rem; + padding-bottom: 0.2rem; + margin-top: 0.3rem; + margin-bottom: 0.3rem; } -#register { +.profileField { display: flex; position: relative; flex-wrap: wrap; justify-content: center; /*margin: 5px auto;*/ width: fit-content; - max-width: 50%; - min-width: 400px; + min-width: 500px; height: 35%; + min-height: 50px; font-size: 1.5rem; } -#register input { +.profileField input { display: flexbox; - margin: 5px auto; - background-color: rgba(205, 205, 255, 0.233); + margin: auto; + background-color: rgba(255, 255, 255, 0.438); border-bottom: 2px solid blue; border-radius: 5%; width: 60%; @@ -79,7 +87,20 @@ body{ text-align: center; } -#register button { +#profile h3 { + display: flexbox; + border-bottom: 2px solid blue; + margin: auto; + width: 60%; + min-width: 230px; + height: 90%; + text-align: center; + font-size: 35px; + font-family: Arial, Helvetica, sans-serif; + font-weight: normal; +} + +.profileField button { display: flexbox; margin: auto; background-color: rgb(200,220,255); @@ -90,7 +111,7 @@ body{ text-align: center; } -#register button:hover { +.profileField button:hover { transition-duration: 0.2s; color: rgb(67, 217, 255); background-color: rgb(15, 53, 124); @@ -173,12 +194,12 @@ body{ text-align: center; } -#register button.button, #users button.button, input[type="button"], input[type="submit"].formFileInput { +.profileField button.button, #users button.button, input[type="button"], input[type="submit"].formFileInput { transition-duration: 1s; cursor: pointer; } -#register button.button:hover, #users button.button:hover, input[type="button"]:hover, input[type="submit"]:hover { +.profileField button.button:hover, #users button.button:hover, input[type="button"]:hover, input[type="submit"]:hover { background-color: rgb(150,170,205); } diff --git a/client/index.html b/client/index.html index 32b2fbc..aedeaaa 100644 --- a/client/index.html +++ b/client/index.html @@ -3,16 +3,22 @@ Home file transport +