From d299512694048b10132ba14d458f32445afa2eb1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Sat, 17 Dec 2022 00:46:17 +0100 Subject: [PATCH] Remove unused styles MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- .../__tests__/avatar-overlay.test.tsx | 31 -- app/soapbox/components/avatar-overlay.tsx | 19 -- app/soapbox/normalizers/account.ts | 2 +- app/styles/accounts.scss | 32 -- app/styles/application.scss | 1 - app/styles/chats.scss | 318 ------------------ app/styles/components/aliases.scss | 4 - app/styles/rtl.scss | 9 - 8 files changed, 1 insertion(+), 415 deletions(-) delete mode 100644 app/soapbox/components/__tests__/avatar-overlay.test.tsx delete mode 100644 app/soapbox/components/avatar-overlay.tsx delete mode 100644 app/styles/chats.scss diff --git a/app/soapbox/components/__tests__/avatar-overlay.test.tsx b/app/soapbox/components/__tests__/avatar-overlay.test.tsx deleted file mode 100644 index 4e83dd071..000000000 --- a/app/soapbox/components/__tests__/avatar-overlay.test.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; - -import { normalizeAccount } from 'soapbox/normalizers'; - -import { render, screen } from '../../jest/test-helpers'; -import AvatarOverlay from '../avatar-overlay'; - -import type { ReducerAccount } from 'soapbox/reducers/accounts'; - -describe(' { - const account = normalizeAccount({ - username: 'alice', - acct: 'alice', - display_name: 'Alice', - avatar: '/animated/alice.gif', - avatar_static: '/static/alice.jpg', - }) as ReducerAccount; - - const friend = normalizeAccount({ - username: 'eve', - acct: 'eve@blackhat.lair', - display_name: 'Evelyn', - avatar: '/animated/eve.gif', - avatar_static: '/static/eve.jpg', - }) as ReducerAccount; - - it('renders a overlay avatar', () => { - render(); - expect(screen.queryAllByRole('img')).toHaveLength(2); - }); -}); diff --git a/app/soapbox/components/avatar-overlay.tsx b/app/soapbox/components/avatar-overlay.tsx deleted file mode 100644 index a463b35ce..000000000 --- a/app/soapbox/components/avatar-overlay.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; - -import StillImage from 'soapbox/components/still-image'; - -import type { Account as AccountEntity } from 'soapbox/types/entities'; - -interface IAvatarOverlay { - account: AccountEntity, - friend: AccountEntity, -} - -const AvatarOverlay: React.FC = ({ account, friend }) => ( -
- - -
-); - -export default AvatarOverlay; diff --git a/app/soapbox/normalizers/account.ts b/app/soapbox/normalizers/account.ts index 3dace3d08..fb6a04255 100644 --- a/app/soapbox/normalizers/account.ts +++ b/app/soapbox/normalizers/account.ts @@ -25,7 +25,7 @@ export const AccountRecord = ImmutableRecord({ acct: '', avatar: '', avatar_static: '', - birthday: '2001-02-12', + birthday: '', bot: false, chats_onboarded: true, created_at: '', diff --git a/app/styles/accounts.scss b/app/styles/accounts.scss index 86fd7cb71..ea2d3cbe0 100644 --- a/app/styles/accounts.scss +++ b/app/styles/accounts.scss @@ -43,38 +43,6 @@ } } -.account__wrapper { - display: flex; - align-items: center; -} - -.account__avatar-wrapper { - float: left; - margin-right: 12px; -} - -a .account__avatar { - cursor: pointer; -} - -.account__avatar-overlay { - @include avatar-size(48px); - - &-base { - @include avatar-radius; - @include avatar-size(36px); - } - - &-overlay { - @include avatar-radius; - @include avatar-size(24px); - position: absolute; - bottom: 0; - right: 0; - z-index: 1; - } -} - .account-authorize__avatar { float: left; margin-right: 10px; diff --git a/app/styles/application.scss b/app/styles/application.scss index ff2bf20de..c6d633905 100644 --- a/app/styles/application.scss +++ b/app/styles/application.scss @@ -22,7 +22,6 @@ @import 'rtl'; @import 'accessibility'; @import 'dyslexic'; -@import 'chats'; @import 'navigation'; @import 'placeholder'; @import 'autosuggest'; diff --git a/app/styles/chats.scss b/app/styles/chats.scss deleted file mode 100644 index 940568862..000000000 --- a/app/styles/chats.scss +++ /dev/null @@ -1,318 +0,0 @@ -.pane { - @apply flex flex-col shadow-md rounded-t-md fixed bottom-0 right-5 w-96 h-[350px] z-[1000]; - max-height: calc(100vh - 70px); - transition: 0.05s; - - &--main { - height: calc(100vh - 70px); - - .pane__header .pane__title { - font-size: 16px; - } - } - - .search--account { - border-top: 1px solid hsla(var(--primary-text-color_hsl), 0.2); - padding: 5px; - } - - &__header { - @apply flex items-center py-0 px-2.5 h-14 box-border rounded-t-md font-bold bg-primary-600 text-white; - - .account__avatar { - margin-right: 7px; - } - - .pane__title { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - flex: 1; - height: 100%; - background: transparent; - border: 0; - padding: 0; - color: #fff; - font-weight: bold; - text-align: left; - font-size: 14px; - } - - .icon-button { - opacity: 0.7; - color: #fff; - - &:hover { - opacity: 1; - } - - > div { - margin-right: -6px; - } - } - - .pane__close { - margin-left: auto; - - .svg-icon { - width: 18px; - height: 18px; - transform: translateY(2px); - } - } - } - - &__content { - @apply flex flex-1 flex-col overflow-hidden bg-white dark:bg-gray-900; - - > div { - @apply max-h-full; - } - - .chat-box { - @apply flex flex-1 flex-col overflow-hidden; - } - - .chat-list { - @apply overflow-y-auto max-h-full; - } - } - - .audio-toggle .react-toggle-thumb { - @apply w-3.5 h-3.5 border border-solid border-primary-400; - } - - .audio-toggle .react-toggle { - @apply top-1; - } - - .audio-toggle .react-toggle-track { - @apply h-4 w-8 bg-accent-500 dark:bg-accent-500; - } - - .audio-toggle .react-toggle-track-check { - left: 4px; - bottom: 0; - } - - .react-toggle--checked .react-toggle-thumb { - left: 19px; - } - - .audio-toggle .react-toggle-track-x { - right: 5px; - bottom: 0; - } - - .fa { - font-size: 14px; - } - - .chat-message--me .chat-message__bubble { - @apply dark:bg-primary-900; - } -} - -.chat-messages { - overflow-y: scroll; - flex: 1; -} - -.chat-message { - margin: 14px 10px; - display: flex; - - &__bubble { - @apply px-2.5 py-1 rounded-lg bg-primary-50 dark:bg-gray-700; - max-width: 70%; - text-overflow: ellipsis; - overflow-wrap: break-word; - white-space: break-spaces; - position: relative; - - a { - color: var(--brand-color--hicontrast); - } - - &:hover, - &:focus, - &:active { - .chat-message__menu { - opacity: 1; - pointer-events: all; - } - } - } - - &--me .chat-message__bubble { - @apply bg-primary-200 dark:bg-primary-800; - margin-left: auto; - } - - &--pending .chat-message__bubble { - opacity: 0.5; - } - - &__menu { - position: absolute; - top: -8px; - right: -8px; - height: 20px; - padding: 1px; - opacity: 0; - pointer-events: none; - transition: 0.2s; - - button { - @apply p-1 bg-gray-100 dark:bg-gray-800; - - svg { - @apply h-4 w-4; - } - } - } -} - -.chat-list { - flex: 1; - - &__content { - height: 100%; - } - - .empty-column-indicator { - height: 100%; - box-sizing: border-box; - background: transparent; - align-items: start; - } - - .account { - border-bottom: none; - } - - .account__display-name { - position: relative; - - .display-name { - display: flex; - - .hover-ref-wrapper { - display: flex; - } - - bdi { - overflow: hidden; - text-overflow: ellipsis; - } - - .display-name__account { - overflow: hidden; - text-overflow: ellipsis; - flex: 1; - display: none; - } - } - } -} - -.chat-box { - &__attachment { - display: flex; - align-items: center; - font-size: 13px; - padding: 0 10px; - height: 25px; - - .chat-box__remove-attachment { - margin-left: auto; - - .icon-button > div { - display: flex; - align-items: center; - } - } - } - - &__actions { - background: var(--foreground-color); - margin-top: auto; - padding: 6px; - position: relative; - - textarea { - @apply pr-6; - } - } - - &__send { - .icon-button, - button { - @apply absolute right-2.5 w-auto h-auto border-0 p-0 m-0 bg-transparent text-black dark:text-white; - top: 50%; - transform: translateY(-50%); - - svg { - @apply w-[18px] h-[18px]; - } - } - } -} - -@media (max-width: 630px) { - .chat-panes { - display: none; - } -} - -.chatroom__header { - display: flex; - margin-left: auto; - padding-right: 15px; - overflow: hidden; - text-decoration: none; - - .account__avatar { - margin-right: 7px; - } - - .chatroom__title { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - flex: 1; - height: 100%; - background: transparent; - border: 0; - padding: 0; - color: var(--primary-text-color); - font-weight: bold; - text-align: left; - font-size: 14px; - } -} - -.chat-message .media-gallery { - height: 100% !important; - margin: 4px 0 8px; - - .media-gallery__item:not(.media-gallery__item--image) { - max-width: 100%; - width: 120px !important; - height: 100% !important; - } - - &__preview { - background-color: transparent; - } -} - -.chat-messages__divider { - @apply pt-3.5 pb-0.5 text-center uppercase text-black dark:text-white; - font-size: 13px; - opacity: 0.8; -} - -.floating-link { - @apply w-full h-full inset-0 absolute z-10; -} diff --git a/app/styles/components/aliases.scss b/app/styles/components/aliases.scss index 3106c902a..8b84327e1 100644 --- a/app/styles/components/aliases.scss +++ b/app/styles/components/aliases.scss @@ -8,10 +8,6 @@ } } - .account__avatar { - cursor: default; - } - &.empty-column-indicator { min-height: unset; overflow-y: unset; diff --git a/app/styles/rtl.scss b/app/styles/rtl.scss index dc17469e2..ae2de194b 100644 --- a/app/styles/rtl.scss +++ b/app/styles/rtl.scss @@ -35,10 +35,6 @@ body.rtl { margin-right: 0; } - .account__avatar-wrapper { - float: right; - } - .setting-toggle__label { margin-left: 0; margin-right: 8px; @@ -49,11 +45,6 @@ body.rtl { padding-right: 68px; } - .account__avatar-overlay-overlay { - right: auto; - left: 0; - } - .privacy-dropdown__dropdown { margin-left: 0; margin-right: 40px;