diff options
| author |  tobi <31960611+tsmethurst@users.noreply.github.com> | 2022-08-08 10:40:51 +0200 |
|---|---|---|
| committer |  GitHub <noreply@github.com> | 2022-08-08 10:40:51 +0200 |
| commit | 117888cf59c10330671f43bbce949a3984761c91 (patch) | |
| tree | 432e62b06206f315048e719ef2bb0e39c5f658ae /web/source/css | |
| parent | [chore] Update js deps (#744) (diff) | |
| download | gotosocial-117888cf59c10330671f43bbce949a3984761c91.tar.xz | |
[feature] Add first iteration of a user panel at `/user` (#736)
* start work on user panel
* parse source first before checking if empty form
* newline
* set avi + header nicely
* add posts settings
* render signin a bit nicer on mobile
* return OK json on successful change
* return unauthorized on bad password
* clarify message on insecure password
* make login a bit prettier
* add alt text + border round image previews
* add logout button
* add password change
* styling updates
* redirect /auth/edit to /user
* update tests
* fix validation tests
* better labels, link to more info
* make submit button generic component
* move submit button inside forms
* add autocomplete labels to password fields
* fix indentation (thx eslint)
* update eslintrc
* eslint: no-unescaped-entities
* initial deduplication between user and admin panel
* add default status/post format setting
* user panel styling for inputs
* update user panel styling, include normalize css
* add placeholder text
* input padding
Co-authored-by: f0x <f0x@cthu.lu>
Diffstat (limited to 'web/source/css')
| -rw-r--r-- | web/source/css/_colors.css | 5 | ||||
| -rw-r--r-- | web/source/css/base.css | 49 |
2 files changed, 45 insertions, 9 deletions
diff --git a/web/source/css/_colors.css b/web/source/css/_colors.css index 25bfae26e..5390f13d2 100644 --- a/web/source/css/_colors.css +++ b/web/source/css/_colors.css @@ -51,6 +51,7 @@ $bg_trans: color-mod($sloth_gray2 alpha(62%)); $bg_accent: $sloth_gray2_lighter3; $fg_accent: $lightblue; +$border_accent: $sloth_orange2; /* Color variables as used in a specific location */ @@ -70,4 +71,6 @@ $status_info_fg: #CBCBD7; $boxshadow: 0 0.4rem 1rem -0.1rem rgba(0,0,0,0.15); $boxshadow_border: 0.08rem solid $sloth_gray2_darker5; -$profile_avatar_border: 0.2rem solid $sloth_orange2;
\ No newline at end of file +$profile_avatar_border: 0.2rem solid $border_accent; + +$input_bg: $sloth_gray2_darker3;
\ No newline at end of file diff --git a/web/source/css/base.css b/web/source/css/base.css index 11d6dc407..5f07fb847 100644 --- a/web/source/css/base.css +++ b/web/source/css/base.css @@ -16,6 +16,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. */ +@import "modern-normalize/modern-normalize.css"; + @font-face { font-family: "Noto Sans"; font-weight: 400; @@ -48,6 +50,10 @@ body { position: relative; } +.hidden { + display: none; +} + .page { position: absolute; display: grid; @@ -215,13 +221,26 @@ section.apps { section.login { form { - display: inline-grid; - grid-template-columns: auto 100%; - grid-gap: 0.7rem; + display: flex; + flex-direction: column; + gap: 1rem; + + + padding-bottom: 1rem; + padding-top: 1rem; + + label, input { + padding-left: 0.2rem; + } - button { - place-self: center; - grid-column: 2; + .labelinput { + display: flex; + flex-direction: column; + gap: 0.4rem; + } + + .btn { + margin-top: 1rem; } } } @@ -245,11 +264,25 @@ section.error { } input, select, textarea { - border: 1px solid $fg; + box-sizing: border-box; + border: 0.15rem solid $border_accent; + border-radius: 0.1rem; color: $fg; - background: $bg; + /* background: $input_bg; */ + background: $bg_accent; width: 100%; font-family: 'Noto Sans', sans-serif; + font-size: 1rem; + padding: 0.3rem; + + &:focus { + border-color: $fg_accent; + } +} + +input, textarea { + padding-top: 0.1rem; + padding-bottom: 0.1rem; } footer { |