Remove unused styles
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak
parent
0879222aa2
commit
23b1052a1d
|
|
@ -37,7 +37,7 @@ const Welcome = () => {
|
|||
|
||||
return (
|
||||
<Stack className='py-20 px-4 sm:px-0' data-testid='chats-welcome'>
|
||||
<div className='w-full sm:w-3/5 xl:w-2/5 mx-auto mb-10'>
|
||||
<div className='w-full sm:w-3/5 xl:w-2/5 mx-auto mb-2.5'>
|
||||
<Text align='center' weight='bold' className='mb-6 text-2xl md:text-3xl leading-8'>
|
||||
{intl.formatMessage(messages.title, { br: <br /> })}
|
||||
</Text>
|
||||
|
|
|
|||
|
|
@ -1,36 +0,0 @@
|
|||
import React from 'react';
|
||||
|
||||
interface ITextIconButton {
|
||||
label: string,
|
||||
title: string,
|
||||
active: boolean,
|
||||
onClick: () => void,
|
||||
ariaControls: string,
|
||||
unavailable: boolean,
|
||||
}
|
||||
|
||||
const TextIconButton: React.FC<ITextIconButton> = ({
|
||||
label,
|
||||
title,
|
||||
active,
|
||||
ariaControls,
|
||||
unavailable,
|
||||
onClick,
|
||||
}) => {
|
||||
const handleClick: React.MouseEventHandler = (e) => {
|
||||
e.preventDefault();
|
||||
onClick();
|
||||
};
|
||||
|
||||
if (unavailable) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<button title={title} aria-label={title} className={`text-icon-button ${active ? 'active' : ''}`} aria-expanded={active} onClick={handleClick} aria-controls={ariaControls}>
|
||||
{label}
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default TextIconButton;
|
||||
|
|
@ -10,14 +10,6 @@
|
|||
@media screen and (max-width: $no-gap-breakpoint) {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
.card__bar {
|
||||
background-color: var(--brand-color--faint);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -28,19 +20,6 @@
|
|||
&:not(:last-of-type) {
|
||||
border-bottom: 1px solid var(--brand-color--med);
|
||||
}
|
||||
|
||||
.account__display-name {
|
||||
flex: 1 1 auto;
|
||||
display: block;
|
||||
color: var(--primary-text-color--faint);
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
|
||||
.display-name__name {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.account-authorize__avatar {
|
||||
|
|
|
|||
|
|
@ -46,7 +46,6 @@
|
|||
@import 'components/react-toggle';
|
||||
@import 'components/video-player';
|
||||
@import 'components/audio-player';
|
||||
@import 'components/profile-hover-card';
|
||||
@import 'components/filters';
|
||||
@import 'components/snackbar';
|
||||
@import 'components/admin';
|
||||
|
|
|
|||
|
|
@ -2,12 +2,6 @@
|
|||
&__accounts {
|
||||
overflow-y: auto;
|
||||
|
||||
.account__display-name {
|
||||
&:hover strong {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.empty-column-indicator {
|
||||
min-height: unset;
|
||||
overflow-y: unset;
|
||||
|
|
@ -17,16 +11,4 @@
|
|||
|
||||
.aliases-settings-panel {
|
||||
flex: 1;
|
||||
|
||||
.item-list article {
|
||||
border-bottom: 1px solid var(--primary-text-color--faint);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.slist--flex {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
.column {
|
||||
width: 350px;
|
||||
position: relative;
|
||||
|
|
@ -66,218 +65,6 @@
|
|||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.column-link__badge {
|
||||
display: inline-block;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
line-height: 19px;
|
||||
font-weight: 500;
|
||||
background: var(--brand-color--med);
|
||||
padding: 4px 8px;
|
||||
margin: -6px 10px;
|
||||
}
|
||||
|
||||
.column-subheading {
|
||||
background: var(--brand-color--med);
|
||||
color: var(--primary-text-color--faint);
|
||||
padding: 8px 20px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.column-header__wrapper {
|
||||
position: relative;
|
||||
flex: 0 0 auto;
|
||||
overflow: hidden;
|
||||
|
||||
&.active {
|
||||
&::before {
|
||||
display: block;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
width: 60%;
|
||||
pointer-events: none;
|
||||
height: 28px;
|
||||
z-index: 1;
|
||||
background: radial-gradient(ellipse, hsla(var(--brand-color_hsl), 0.23) 0%, hsla(var(--brand-color_hsl), 0) 60%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-header {
|
||||
display: flex;
|
||||
font-size: 16px;
|
||||
flex: 0 0 auto;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
outline: 0;
|
||||
overflow-x: auto;
|
||||
|
||||
& > button,
|
||||
& > .btn {
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 15px;
|
||||
color: inherit;
|
||||
background: transparent;
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: 0.2s;
|
||||
|
||||
&--sub {
|
||||
font-size: 14px;
|
||||
padding: 6px 10px;
|
||||
}
|
||||
|
||||
&.grouped {
|
||||
margin: 6px;
|
||||
color: var(--primary-text-color--faint);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--primary-text-color);
|
||||
|
||||
&::before {
|
||||
height: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
background-color: var(--accent-color--faint);
|
||||
border-radius: 10px;
|
||||
transition: 0.2s;
|
||||
opacity: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $nav-breakpoint-2) {
|
||||
padding: 8px;
|
||||
font-size: 14px;
|
||||
|
||||
&.grouped {
|
||||
margin: 6px 2px 6px 6px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .btn.grouped {
|
||||
&::before {
|
||||
height: 70% !important;
|
||||
opacity: 0 !important;
|
||||
}
|
||||
|
||||
&:hover::before {
|
||||
height: 100% !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
box-shadow: 0 1px 0 hsla(var(--highlight-text-color_hsl), 0.3);
|
||||
|
||||
.column-header__icon {
|
||||
color: var(--highlight-text-color);
|
||||
text-shadow: 0 0 10px hsla(var(--highlight-text-color_hsl), 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.column-header__buttons {
|
||||
height: 48px;
|
||||
display: flex;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.column-header__links .text-btn {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.column-header__button {
|
||||
cursor: pointer;
|
||||
border: 0;
|
||||
padding: 0 15px;
|
||||
font-size: 16px;
|
||||
color: var(--primary-text-color--faint);
|
||||
background: transparent;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: hsla(var(--primary-text-color_hsl), 0.8);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--primary-text-color);
|
||||
background: var(--accent-color--med);
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-text-color);
|
||||
background: var(--accent-color--med);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-header__collapsible {
|
||||
max-height: 70vh;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
color: var(--primary-text-color--faint);
|
||||
transition: max-height 150ms ease-in-out, opacity 300ms linear;
|
||||
opacity: 1;
|
||||
|
||||
&.collapsed {
|
||||
max-height: 0;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
&.animating {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
hr {
|
||||
height: 0;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-top: 1px solid var(--brand-color--med);
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.column-header__collapsible-inner {
|
||||
background: var(--background-color);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.column-header__setting-btn {
|
||||
&--link {
|
||||
text-decoration: none;
|
||||
|
|
@ -293,77 +80,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.column-header__icon {
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.column-settings {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__header {
|
||||
border-bottom: 1px solid hsla(var(--primary-text-color_hsl), 0.2);
|
||||
padding: 10px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-weight: bold;
|
||||
color: var(--primary-text-color--faint);
|
||||
}
|
||||
|
||||
&__content {
|
||||
padding: 10px 20px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
&__description {
|
||||
font-size: 14px;
|
||||
margin: 5px 0 15px;
|
||||
color: var(--primary-text-color--faint);
|
||||
}
|
||||
|
||||
&__close {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: auto;
|
||||
|
||||
.svg-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-settings__section {
|
||||
color: var(--primary-text-color--faint);
|
||||
cursor: default;
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.column-settings__row {
|
||||
.text-btn {
|
||||
margin-bottom: 15px;
|
||||
|
||||
&.column-header__setting-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.svg-icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty-column-indicator,
|
||||
.error-column {
|
||||
@apply bg-primary-50 dark:bg-gray-700 text-gray-900 dark:text-gray-300 text-center p-10 flex flex-1 items-center justify-center min-h-[160px] rounded-lg;
|
||||
|
|
@ -390,49 +106,3 @@
|
|||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.column__switch .audio-toggle {
|
||||
@apply absolute top-3 right-[14px] rtl:left-[14px] rtl:right-auto z-10;
|
||||
|
||||
.react-toggle-track-check {
|
||||
@apply left-1.5;
|
||||
}
|
||||
|
||||
.react-toggle-track-x {
|
||||
@apply right-2;
|
||||
}
|
||||
}
|
||||
|
||||
.column--better {
|
||||
.column__top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid hsla(var(--primary-text-color_hsl), 0.2);
|
||||
}
|
||||
|
||||
.column-header {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.column__menu {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&,
|
||||
> div,
|
||||
button {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 0 15px;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,25 +1,3 @@
|
|||
.account__display-name {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.account__display-name {
|
||||
strong {
|
||||
@apply text-gray-800 dark:text-gray-200;
|
||||
}
|
||||
}
|
||||
|
||||
a.account__display-name {
|
||||
&:hover strong {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.account__display-name strong {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.display-name {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
|
|
@ -33,11 +11,8 @@ a.account__display-name {
|
|||
}
|
||||
}
|
||||
|
||||
.display-name__html {
|
||||
font-weight: 600;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.display-name__account {
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,4 @@
|
|||
.filter-settings-panel {
|
||||
.item-list article {
|
||||
border-bottom: 1px solid var(--primary-text-color--faint);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.fields-group .two-col {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
|
|
|
|||
|
|
@ -327,10 +327,6 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 10px;
|
||||
|
||||
.unauthorized-modal-content__button {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__fields {
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
.display-name__account {
|
||||
position: relative;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
|
@ -2,13 +2,3 @@
|
|||
font-family: 'OpenDyslexic' !important;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
body.dyslexic {
|
||||
|
||||
@media screen and (max-width: $nav-breakpoint-2) {
|
||||
.column-header > button,
|
||||
.column-header > .btn {
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,14 +22,6 @@ select {
|
|||
margin-left: -1px;
|
||||
}
|
||||
|
||||
$no-columns-breakpoint: 600px;
|
||||
|
||||
.form-container {
|
||||
max-width: 400px;
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.simple_form {
|
||||
.input {
|
||||
&.hidden {
|
||||
|
|
@ -194,31 +186,6 @@ $no-columns-breakpoint: 600px;
|
|||
}
|
||||
}
|
||||
|
||||
.input.font_icon_picker {
|
||||
width: 52px;
|
||||
}
|
||||
|
||||
.input.with_block_label {
|
||||
max-width: none;
|
||||
|
||||
& > label {
|
||||
font-family: inherit;
|
||||
font-size: 16px;
|
||||
color: var(--primary-text-color);
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.hint {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
ul {
|
||||
columns: 2;
|
||||
}
|
||||
}
|
||||
|
||||
.required abbr {
|
||||
text-decoration: none;
|
||||
color: lighten($error-value-color, 12%);
|
||||
|
|
@ -236,48 +203,6 @@ $no-columns-breakpoint: 600px;
|
|||
}
|
||||
}
|
||||
|
||||
.fields-row {
|
||||
display: flex;
|
||||
margin: 0 -10px;
|
||||
padding-top: 5px;
|
||||
margin-bottom: 25px;
|
||||
|
||||
.input {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
&__column {
|
||||
box-sizing: border-box;
|
||||
padding: 0 10px;
|
||||
flex: 1 1 auto;
|
||||
min-height: 1px;
|
||||
|
||||
&-6 {
|
||||
max-width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.fields-group:last-child,
|
||||
.fields-row__column.fields-group {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $no-columns-breakpoint) {
|
||||
display: block;
|
||||
margin-bottom: 0;
|
||||
|
||||
&__column {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.fields-group:last-child,
|
||||
.fields-row__column.fields-group,
|
||||
.fields-row__column {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input.radio_buttons .radio label {
|
||||
margin-bottom: 5px;
|
||||
font-family: inherit;
|
||||
|
|
@ -390,11 +315,6 @@ $no-columns-breakpoint: 600px;
|
|||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
&.actions--top {
|
||||
margin-top: 0;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
// button,
|
||||
|
|
@ -483,98 +403,10 @@ $no-columns-breakpoint: 600px;
|
|||
// padding-top: 0.5rem;
|
||||
// }
|
||||
|
||||
.select-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&::after {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
height: calc(100% - 8px);
|
||||
padding-left: 12px;
|
||||
pointer-events: none;
|
||||
margin-top: 8px;
|
||||
font-weight: 900;
|
||||
}
|
||||
}
|
||||
|
||||
.label_input {
|
||||
&__color {
|
||||
display: inline-flex;
|
||||
font-size: 14px;
|
||||
|
||||
.color-swatch {
|
||||
width: 32px;
|
||||
height: 16px;
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
.label_input__wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&__append {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
top: 1px;
|
||||
padding: 10px;
|
||||
padding-bottom: 9px;
|
||||
font-size: 16px;
|
||||
color: var(--primary-text-color);
|
||||
font-family: inherit;
|
||||
pointer-events: none;
|
||||
cursor: default;
|
||||
max-width: 140px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 1px;
|
||||
width: 5px;
|
||||
background-image: linear-gradient(to right, hsla(var(--background-color_hsl), 0), var(--background-color));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__overlay-area {
|
||||
position: relative;
|
||||
|
||||
&__overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: var(--background-color);
|
||||
backdrop-filter: blur(2px);
|
||||
border-radius: 4px;
|
||||
|
||||
&__content {
|
||||
text-align: center;
|
||||
|
||||
&.rich-formatting {
|
||||
&,
|
||||
p {
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
line-height: normal;
|
||||
|
|
@ -637,52 +469,6 @@ $no-columns-breakpoint: 600px;
|
|||
}
|
||||
}
|
||||
|
||||
.file-picker img {
|
||||
max-width: 100px;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.code-editor {
|
||||
textarea {
|
||||
font-family: monospace;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
&--invalid textarea {
|
||||
border-color: $error-red !important;
|
||||
color: $error-red;
|
||||
}
|
||||
|
||||
.input {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.hint {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.delete-account {
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.input .row > .svg-icon.delete-field {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
position: absolute;
|
||||
right: 13px;
|
||||
cursor: pointer;
|
||||
color: $error-red;
|
||||
transform: translateY(-11px);
|
||||
}
|
||||
|
||||
.input .row > .input.with_label + .svg-icon.delete-field {
|
||||
right: 5px;
|
||||
transform: translateY(7px);
|
||||
}
|
||||
|
||||
.input.with_label.toggle .label_input {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
|
|
@ -692,48 +478,3 @@ $no-columns-breakpoint: 600px;
|
|||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.actions.add-row {
|
||||
margin: 10px 0 0;
|
||||
|
||||
.button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
.svg-icon {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.copyable-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 38px;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
font-size: 14px !important;
|
||||
border-radius: 4px 0 0 4px !important;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
width: auto;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
border-radius: 0 4px 4px 0;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,16 +31,6 @@
|
|||
100% { background-position-x: 0; }
|
||||
}
|
||||
|
||||
.chat-list-item--placeholder .chat__last-message {
|
||||
letter-spacing: -1px;
|
||||
color: var(--brand-color) !important;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.slist {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.media-gallery.media-gallery--placeholder {
|
||||
background: none;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,14 +1,7 @@
|
|||
body.rtl {
|
||||
direction: rtl;
|
||||
|
||||
.column-header > button {
|
||||
text-align: right;
|
||||
padding-left: 0;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.column-link__icon,
|
||||
.column-header__icon {
|
||||
.column-link__icon {
|
||||
margin-right: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
|
@ -18,28 +11,6 @@ body.rtl {
|
|||
left: 10px;
|
||||
}
|
||||
|
||||
.column-header__buttons {
|
||||
left: 0;
|
||||
right: auto;
|
||||
margin-left: 0;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.column-inline-form .icon-button {
|
||||
margin-left: 0;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.column-header__links .text-btn {
|
||||
margin-left: 10px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.setting-toggle__label {
|
||||
margin-left: 0;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.status {
|
||||
padding-left: 10px;
|
||||
padding-right: 68px;
|
||||
|
|
@ -112,21 +83,6 @@ body.rtl {
|
|||
}
|
||||
}
|
||||
|
||||
.public-layout {
|
||||
.header {
|
||||
.nav-button {
|
||||
margin-left: 8px;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card__bar .display-name {
|
||||
margin-left: 0;
|
||||
margin-right: 15px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.fa-chevron-left::before {
|
||||
content: "\F054";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -88,45 +88,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.text-icon-button {
|
||||
color: var(--primary-text-color--faint);
|
||||
border: 0;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
font-size: 11px;
|
||||
padding: 0 3px;
|
||||
line-height: 27px;
|
||||
outline: 0;
|
||||
transition: color 100ms ease-in;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: var(--primary-text-color);
|
||||
transition: color 200ms ease-out;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: var(--primary-text-color--faint);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--highlight-text-color);
|
||||
}
|
||||
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&::-moz-focus-inner,
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.invisible {
|
||||
font-size: 0 !important;
|
||||
line-height: 0 !important;
|
||||
|
|
@ -151,10 +112,6 @@
|
|||
|
||||
.ellipsis::after { content: "…"; }
|
||||
|
||||
.no-reduce-motion .spoiler-input {
|
||||
transition: height 0.4s ease, opacity 0.4s ease;
|
||||
}
|
||||
|
||||
.image-loader {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
|
@ -205,39 +162,10 @@
|
|||
width: 100%;
|
||||
padding: 0 0 calc(var(--thumb-navigation-height) + 86px);
|
||||
|
||||
.bg-shape-container {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
&__top {
|
||||
@include standard-panel-shadow;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
z-index: 1000;
|
||||
background: var(--foreground-color);
|
||||
|
||||
@media (min-width: 896px) {
|
||||
top: -290px;
|
||||
position: sticky;
|
||||
}
|
||||
}
|
||||
|
||||
&__columns {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -254,18 +182,11 @@
|
|||
}
|
||||
}
|
||||
|
||||
.slist {
|
||||
&--flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
&__append {
|
||||
.slist__append {
|
||||
flex: 1 1 auto;
|
||||
position: relative;
|
||||
padding: 30px 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.setting-text {
|
||||
color: var(--primary-text-color--faint);
|
||||
|
|
@ -290,34 +211,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.morefollows-indicator {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: var(--primary-text-color);
|
||||
background: var(--brand-color--med);
|
||||
cursor: default;
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
|
||||
& > div {
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&__label {
|
||||
strong {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-btn {
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
|
|
@ -334,165 +227,6 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.emoji-button {
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
margin-left: 2px;
|
||||
width: 24px;
|
||||
outline: 0;
|
||||
cursor: pointer;
|
||||
|
||||
&:active,
|
||||
&:focus {
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
img {
|
||||
filter: grayscale(100%);
|
||||
opacity: 0.8;
|
||||
display: block;
|
||||
margin: 0;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
img {
|
||||
opacity: 1;
|
||||
filter: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.attachment-list {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
border: 1px solid var(--brand-color--med);
|
||||
border-radius: 4px;
|
||||
margin-top: 14px;
|
||||
overflow: hidden;
|
||||
|
||||
&__icon {
|
||||
flex: 0 0 auto;
|
||||
color: var(--primary-text-color);
|
||||
padding: 8px 18px;
|
||||
cursor: default;
|
||||
border-right: 1px solid var(--brand-color--med);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26px;
|
||||
|
||||
.fa {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
&__list {
|
||||
list-style: none;
|
||||
padding: 4px 0;
|
||||
padding-left: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
||||
li {
|
||||
display: block;
|
||||
padding: 4px 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: var(--primary-text-color);
|
||||
font-weight: 500;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.compact {
|
||||
border: 0;
|
||||
margin-top: 4px;
|
||||
|
||||
.attachment-list__list {
|
||||
padding: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.fa {
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filter-bar {
|
||||
cursor: default;
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
|
||||
button {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button,
|
||||
a {
|
||||
@apply block flex-1 text-gray-500 py-4 text-sm font-semibold text-center relative no-underline;
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.active {
|
||||
@apply text-gray-900;
|
||||
}
|
||||
|
||||
.svg-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filter-bar {
|
||||
@apply relative;
|
||||
|
||||
&__active {
|
||||
@apply absolute h-[3px] bottom-0 bg-primary-600;
|
||||
}
|
||||
|
||||
&__bottom {
|
||||
@apply absolute h-[3px] w-full bottom-0 bg-primary-200;
|
||||
}
|
||||
}
|
||||
|
||||
.no-reduce-motion .filter-bar__active {
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.reaction__filter-bar {
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
button,
|
||||
a {
|
||||
flex: unset;
|
||||
padding: 15px 24px;
|
||||
min-width: max-content;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
|
@ -502,11 +236,3 @@
|
|||
30% { opacity: 0.75; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--gray-500);
|
||||
}
|
||||
|
||||
.mb-10 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue