diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..86e8ea7 --- /dev/null +++ b/css/style.css @@ -0,0 +1,271 @@ +@font-face { + font-family: "monofonto"; + src: url("../font/raleway.ttf") format("truetype"); +} +body { + z-index: 1; + font-family: monofonto; + background-color: #e5e5e5; + margin: 20px; + text-align: center; +} +body .logo { + display: block; +} +body h1 { + margin: 40px; + font-weight: bold; + color: #454545; +} +body p { + font-weight: bold; + color: #ac2a8d; + font-size: 20px; + height: 20px; +} + +.nav { + width: 80%; + margin-left: 10%; + margin-bottom: 3%; + background-color: #84878C; + border-radius: 20px; +} +.nav ul { + margin: auto; + padding: 0; + width: 60%; +} +.nav ul::after { + content: ""; + display: block; + clear: both; +} +.nav__link { + width: 20%; + min-width: 100px; + float: left; + position: relative; + text-align: center; + list-style-type: none; +} +.nav__link:hover { + background-color: #59184E; + transition: 0.25s; + border-radius: 10px; +} +.nav__link a { + padding-top: 10px; + padding-bottom: 10px; + color: white; + font-weight: bold; + display: inline-block; + text-decoration: none; +} +.nav__link a:hover { + color: white; +} + +form { + width: 20%; + min-width: 300px; + background-color: white; + display: block; + position: relative; + margin: auto; + border-radius: 30px; + padding: 20px; +} + +.container-field { + position: relative; +} +.container-field small { + display: none; + color: red; +} +.container-field__img { + display: none; + position: relative; + float: right; + width: 20px; + bottom: 20px; + right: 20px; +} +.container-field__field { + background-color: inherit; + position: relative; + display: block; + text-decoration-line: none; + appearance: none; + text-align: center; + color: #454444; + resize: none; + outline: none; + margin: 10px auto; + border: 4px solid #4e4d4d; + padding: 10px 10px; + border-radius: 30px; + width: 60%; + max-width: 300px; + transition: 0.25s; +} +.container-field__field:focus, .container-field__field:hover { + width: 70%; + border-color: #ac2a8d; + background-color: white; +} +.container-field__field--submit:hover { + width: 65%; + border-color: #2ecc71; + background-color: #82E6AC; +} + +.help { + display: none; + z-index: 2; + position: absolute; + width: 170px; + right: 0; + top: 30%; + border-radius: 30px; + box-shadow: 0 0 10px black; + padding: 15px; + margin: 0; + background-color: #e5e5e5; + font-size: 14px; +} +.help p { + position: relative; + font-size: 14px; +} +.help img { + border-radius: 15px; + width: 100%; +} +.help code { + background-color: #aaa; + border-radius: 5px; + font-family: courier, monospace; + padding: 3px 5px; + font-size: 14px; +} + +.table { + width: 80%; + border-radius: 5px; + margin-left: 10%; + margin-top: 2%; + background-color: #84878C; + color: white; + border: 1px solid #84878C; +} +.table th { + width: 1%; +} +.table td { + background-color: #e5e5e5; + border: 1px solid #84878C; + min-width: 20px; + border-radius: 5px; + text-align: center; + word-break: break-all; + color: #84878C; +} +.table td img { + width: 40%; + max-width: 40px; +} +.table td input { + border: 2px solid #ac2a8d; + border-radius: 5px; + text-align: inherit; + outline: none; + color: #84878C; + transition: 0.05s; +} +.table td input:hover { + font-weight: bold; +} +.table td input:focus { + font-weight: bold; + border: 4px solid #ac2a8d; +} +.table__title td { + color: #ac2a8d; + font-weight: bold; + word-break: normal; +} +.table__switch { + position: relative; + display: inline-block; + width: 60px; + height: 34px; +} +.table__switch input { + opacity: 0; + width: 0; + height: 0; +} +.table__switch input:checked + .table__switch__slider { + background-color: #2ecc71; +} +.table__switch input:focus + .table__switch__slider { + box-shadow: 0 0 1px #2ecc71; +} +.table__switch input:checked + .table__switch__slider:before { + -webkit-transform: translateX(26px); + -ms-transform: translateX(26px); + transform: translateX(26px); +} +.table__switch__slider { + position: absolute; + cursor: pointer; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: crimson; + border-radius: 34px; + -webkit-transition: 0.4s; + transition: 0.4s; +} +.table__switch__slider:before { + position: absolute; + border-radius: 50%; + content: ""; + height: 26px; + width: 26px; + left: 4px; + bottom: 4px; + background-color: white; + -webkit-transition: 0.4s; + transition: 0.4s; +} + +.button { + border: 3px solid #ac2a8d; + background-color: #e5e5e5; + color: #ac2a8d; + font-weight: bold; + text-decoration: none; + transition: 0.5s; +} +.button:hover { + color: #e5e5e5; + background-color: #ac2a8d; +} +.button--small { + width: 3rem; + border-radius: 5px; + margin: 5px; +} +.button--large { + display: inline-block; + width: 6%; + margin-bottom: 3%; + padding: 10px 40px; + border-radius: 20px; +} + +/*# sourceMappingURL=style.css.map */ diff --git a/css/style.css.map b/css/style.css.map new file mode 100644 index 0000000..c8ae797 --- /dev/null +++ b/css/style.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["../sass/main.scss"],"names":[],"mappings":"AAMA;EACI;EACA;;AAGJ;EACI;EACA;EACA,kBAbS;EAcT;EACA;;AACA;EACI;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA,OAxBE;EAyBF;EACA;;;AAOR;EACI;EACA;EACA;EACA,kBAxCQ;EAyCR;;AACA;EACI;EACA;EACA;;AACA;EACI;EACA;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI,kBA1DG;EA2DH;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;;;AAUhB;EACI;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;;;AAGJ;EACI;;AACA;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA,cA7HF;EA8HE;;AAEJ;EACI;EACA;EACA;;;AASZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBAzJS;EA0JT;;AACA;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;;AAQR;EACI;EACA;EACA;EACA;EACA,kBAtLQ;EAuLR;EACA;;AACA;EACI;;AAEJ;EACI,kBA5LK;EA8LL;EACA;EACA;EAEA;EACA;EACA,OArMI;;AAsMJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA,OA/MA;EAgNA;;AACA;EACI;;AAEJ;EACI;EACA;;AAIZ;EACI,OAxNE;EAyNF;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AACA;EACI;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOhB;EACI;EACA,kBAjRS;EAkRT,OAhRM;EAiRN;EACA;EACA;;AACA;EACI,OAvRK;EAwRL,kBAtRE;;AAwRN;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA","file":"style.css"} \ No newline at end of file diff --git a/login/index.php b/login/index.php index 6672483..f01737c 100755 --- a/login/index.php +++ b/login/index.php @@ -2,30 +2,24 @@