logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://hacktivis.me/git/pleroma-fe.git
commit: 58a975e8df0d72ea330a6120195cc9bc374d68ad
parent 076c52788b46258078ce2d83fdac82d75692c74b
Author: Henry Jameson <me@hjkos.com>
Date:   Wed, 20 Apr 2022 23:22:51 +0300

cleanup and fixes

Diffstat:

Msrc/App.scss2+-
Msrc/components/chat/chat.scss2+-
Msrc/components/chat_new/chat_new.scss8++++----
Msrc/components/chat_new/chat_new.vue6+++---
Msrc/components/login_form/login_form.vue2+-
Msrc/components/media_upload/media_upload.vue2+-
Msrc/components/post_status_form/post_status_form.vue24+++++++-----------------
Msrc/components/registration/registration.vue6+++---
Msrc/components/remote_follow/remote_follow.vue2+-
Msrc/components/select/select.vue6+++---
Msrc/components/settings_modal/settings_modal.scss2+-
Msrc/components/settings_modal/tabs/mutes_and_blocks_tab.scss2+-
Msrc/components/settings_modal/tabs/profile_tab.scss2+-
Msrc/components/settings_modal/tabs/theme_tab/theme_tab.scss2+-
Msrc/components/tab_switcher/tab_switcher.scss3++-
Msrc/panel.scss2+-
16 files changed, 32 insertions(+), 41 deletions(-)

diff --git a/src/App.scss b/src/App.scss @@ -456,7 +456,7 @@ textarea, box-sizing: border-box; display: inline-block; position: relative; - height: 28px; + height: 2em; line-height: 16px; hyphens: none; padding: 8px 0.5em; diff --git a/src/components/chat/chat.scss b/src/components/chat/chat.scss @@ -52,7 +52,7 @@ .go-back-button { text-align: center; - line-height: 100%; + line-height: 1; height: 100%; align-self: start; width: var(--__panel-heading-height-inner); diff --git a/src/components/chat_new/chat_new.scss b/src/components/chat_new/chat_new.scss @@ -22,10 +22,10 @@ } .go-back-button { - cursor: pointer; - width: 28px; text-align: center; - padding: 0.6em; - margin: -0.6em 0.6em -0.6em -0.6em; + line-height: 1; + height: 100%; + align-self: start; + width: var(--__panel-heading-height-inner); } } diff --git a/src/components/chat_new/chat_new.vue b/src/components/chat_new/chat_new.vue @@ -6,15 +6,15 @@ ref="header" class="panel-heading" > - <a - class="go-back-button" + <button + class="button-unstyled go-back-button" @click="goBack" > <FAIcon size="lg" icon="chevron-left" /> - </a> + </button> </div> <div class="input-wrap"> <div class="input-search"> diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue @@ -101,7 +101,7 @@ padding: 0.6em; .btn { - min-height: 28px; + min-height: 2em; width: 10em; } diff --git a/src/components/media_upload/media_upload.vue b/src/components/media_upload/media_upload.vue @@ -32,6 +32,6 @@ @import '../../_variables.scss'; .media-upload { - cursor: pointer; + cursor: pointer; // We use <label> for interactivity... i wonder if it's fine } </style> diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue @@ -336,7 +336,7 @@ display: flex; justify-content: space-between; padding: 0.5em; - height: 32px; + height: 2.5em; button { width: 10em; @@ -411,10 +411,12 @@ } .media-upload-icon, .poll-icon, .emoji-icon { - font-size: 26px; + font-size: 1.85em; line-height: 1.1; flex: 1; padding: 0 0.1em; + display: flex; + align-items: center; &.selected, &:hover { // needs to be specific to override icon default color @@ -441,21 +443,17 @@ // Order is not necessary but a good indicator .media-upload-icon { order: 1; - text-align: left; + justify-content: left; } .emoji-icon { order: 2; - text-align: center; + justify-content: center; } .poll-icon { order: 3; - text-align: right; - } - - .poll-icon { - cursor: pointer; + justify-content: right; } .error { @@ -489,10 +487,6 @@ flex-direction: column; } - .btn { - cursor: pointer; - } - .btn[disabled] { cursor: not-allowed; } @@ -551,10 +545,6 @@ } } - .btn { - cursor: pointer; - } - .btn[disabled] { cursor: not-allowed; } diff --git a/src/components/registration/registration.vue b/src/components/registration/registration.vue @@ -297,8 +297,8 @@ $validations-cRed: #f04124; .form-group { display: flex; flex-direction: column; - padding: 0.3em 0.0em 0.3em; - line-height:24px; + padding: 0.3em 0; + line-height: 2; margin-bottom: 1em; } @@ -344,7 +344,7 @@ $validations-cRed: #f04124; .btn { margin-top: 0.6em; - height: 28px; + height: 2em; } .error { diff --git a/src/components/remote_follow/remote_follow.vue b/src/components/remote_follow/remote_follow.vue @@ -32,7 +32,7 @@ .remote-button { width: 100%; - min-height: 28px; + min-height: 2em; } } </style> diff --git a/src/components/select/select.vue b/src/components/select/select.vue @@ -39,10 +39,10 @@ label.Select { padding: 0 2em 0 .2em; font-family: sans-serif; font-family: var(--inputFont, sans-serif); - font-size: 14px; + font-size: 1em; width: 100%; z-index: 1; - height: 28px; + height: 2em; line-height: 16px; } @@ -55,7 +55,7 @@ label.Select { width: 0.875em; color: $fallback--text; color: var(--inputText, $fallback--text); - line-height: 28px; + line-height: 2; z-index: 0; pointer-events: none; } diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss @@ -54,7 +54,7 @@ overflow-y: hidden; .btn { - min-height: 28px; + min-height: 2em; min-width: 10em; padding: 0 2em; } diff --git a/src/components/settings_modal/tabs/mutes_and_blocks_tab.scss b/src/components/settings_modal/tabs/mutes_and_blocks_tab.scss @@ -8,7 +8,7 @@ .bulk-actions { text-align: right; padding: 0 1em; - min-height: 28px; + min-height: 2em; } .bulk-action-button { diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss @@ -89,7 +89,7 @@ &-bulk-actions { text-align: right; padding: 0 1em; - min-height: 28px; + min-height: 2em; button { width: 10em; diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.scss b/src/components/settings_modal/tabs/theme_tab/theme_tab.scss @@ -325,7 +325,7 @@ .btn { flex-grow: 1; - min-height: 28px; + min-height: 2em; min-width: 0; max-width: 10em; padding: 0; diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss @@ -25,8 +25,9 @@ border-bottom-color: $fallback--border; border-bottom-color: var(--border, $fallback--border); } + .tab-wrapper { - height: 28px; + height: 2em; &:not(.active)::after { left: 0; diff --git a/src/panel.scss b/src/panel.scss @@ -176,7 +176,7 @@ flex: none; padding: 0.6em 0.6em; text-align: left; - line-height: 28px; + line-height: 2; align-items: baseline; border-width: 1px 0 0 0; border-style: solid;