Web UI redesign

* Fixed up max-width
  Instead of using relative metric like 90rem, switched over to
  pixels. This also decreases the section so my browser won't struggle
  as much with it.
* Added proper outline
  Instead of using browser's default, I declare blue-ish outline
  manually.
* Add borders to elements
  Inspired by Sourcehut.
This commit is contained in:
Alexey Yerin 2021-03-15 19:34:37 +03:00
parent d551572725
commit 5f5936702d
1 changed files with 15 additions and 3 deletions

View File

@ -7,7 +7,7 @@ body {
} }
.main-section { .main-section {
max-width: 90rem; max-width: 900px;
margin: 5px auto; margin: 5px auto;
} }
@ -28,14 +28,26 @@ body {
} }
.form__input, .form__input,
.textarea, .textarea {
.translation {
font-size: 1rem; font-size: 1rem;
padding: 4px; padding: 4px;
border: 2px solid #888888;
} }
.form__button { .form__button {
padding: 4px 10px; padding: 4px 10px;
border: 2px solid #888888;
}
.form__input:focus,
.textarea:focus,
.form__button:focus {
outline: 2px solid #5d94ff;
}
.translation {
font-size: 1rem;
padding: 4px;
} }
.textarea { .textarea {