mirror of
https://github.com/hcengineering/platform.git
synced 2025-05-29 11:31:32 +00:00
EZQMS-279: Remove .ProseMirror global css (#3772)
* Remove .ProseMirror global css Signed-off-by: Anna No <anna.no@xored.com> * Remove .ProseMirror global css Signed-off-by: Anna No <anna.no@xored.com> * Remove .ProseMirror global css Signed-off-by: Anna No <anna.no@xored.com> * remove unused css classes Signed-off-by: Anna No <anna.no@xored.com> * remove unused css classes Signed-off-by: Anna No <anna.no@xored.com> --------- Signed-off-by: Anna No <anna.no@xored.com>
This commit is contained in:
Anna No
GitHub
parent
56ecd9cfc0
commit
28b99d2525
@ -15,7 +15,7 @@
|
||||
//
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { Editor, Extension } from '@tiptap/core'
|
||||
import { Editor, Extension, mergeAttributes } from '@tiptap/core'
|
||||
|
||||
import { Plugin, PluginKey } from 'prosemirror-state'
|
||||
import { onDestroy, onMount } from 'svelte'
|
||||
@ -29,6 +29,7 @@
|
||||
|
||||
import { calculateDecorations } from './diff/decorations'
|
||||
import { defaultExtensions } from './extensions'
|
||||
import { defaultEditorAttributes } from './editor/editorProps'
|
||||
|
||||
export let content: Markup
|
||||
export let buttonSize: IconSize = 'small'
|
||||
@ -79,6 +80,7 @@
|
||||
|
||||
onMount(() => {
|
||||
editor = new Editor({
|
||||
editorProps: { attributes: mergeAttributes(defaultEditorAttributes, { class: 'flex-grow' }) },
|
||||
element,
|
||||
content,
|
||||
editable: true,
|
||||
@ -121,118 +123,3 @@
|
||||
<div class="select-text" style="width: 100%;" bind:this={element} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="scss" global>
|
||||
.ProseMirror {
|
||||
flex-grow: 1;
|
||||
overflow: auto;
|
||||
min-height: inherit !important;
|
||||
max-height: inherit !important;
|
||||
outline: none;
|
||||
line-height: 150%;
|
||||
color: var(--theme-caption-color);
|
||||
|
||||
p:not(:last-child) {
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre !important;
|
||||
}
|
||||
|
||||
> * + * {
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
|
||||
/* Placeholder (at the top) */
|
||||
p.is-editor-empty:first-child::before {
|
||||
content: attr(data-placeholder);
|
||||
float: left;
|
||||
color: var(--theme-halfcontent-color);
|
||||
pointer-events: none;
|
||||
height: 0;
|
||||
}
|
||||
&:focus-within p.is-editor-empty:first-child::before {
|
||||
color: var(--theme-trans-color);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--scrollbar-bar-hover);
|
||||
}
|
||||
&::-webkit-scrollbar-corner {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.lint-icon {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
cursor: pointer;
|
||||
border-radius: 100px;
|
||||
// background: #f22;
|
||||
color: white;
|
||||
font-family: times, georgia, serif;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
width: 0.7em;
|
||||
height: 0.7em;
|
||||
text-align: center;
|
||||
padding-left: 0.5px;
|
||||
line-height: 1.1em;
|
||||
&.add {
|
||||
background: lightblue;
|
||||
}
|
||||
&.delete {
|
||||
background: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Give a remote user a caret */
|
||||
.collaboration-cursor__caret {
|
||||
border-left: 1px solid #0d0d0d;
|
||||
border-right: 1px solid #0d0d0d;
|
||||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
/* Render the username above the caret */
|
||||
.collaboration-cursor__label {
|
||||
border-radius: 3px 3px 3px 0;
|
||||
color: #0d0d0d;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
left: -1px;
|
||||
line-height: normal;
|
||||
padding: 0.1rem 0.3rem;
|
||||
position: absolute;
|
||||
top: -1.4em;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
cmark {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
span.insertion {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
span.deletion {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
import { getContext, createEventDispatcher, onDestroy, onMount } from 'svelte'
|
||||
import * as Y from 'yjs'
|
||||
import { HocuspocusProvider } from '@hocuspocus/provider'
|
||||
import { AnyExtension, Editor, Extension, HTMLContent, getMarkRange } from '@tiptap/core'
|
||||
import { AnyExtension, Editor, Extension, HTMLContent, getMarkRange, mergeAttributes } from '@tiptap/core'
|
||||
import Collaboration, { isChangeOrigin } from '@tiptap/extension-collaboration'
|
||||
import CollaborationCursor from '@tiptap/extension-collaboration-cursor'
|
||||
import Placeholder from '@tiptap/extension-placeholder'
|
||||
@ -37,6 +37,7 @@
|
||||
import { NodeUuidExtension } from './extension/nodeUuid'
|
||||
import StyleButton from './StyleButton.svelte'
|
||||
import TextEditorStyleToolbar from './TextEditorStyleToolbar.svelte'
|
||||
import { defaultEditorAttributes } from './editor/editorProps'
|
||||
|
||||
export let documentId: string
|
||||
export let readonly = false
|
||||
@ -57,6 +58,7 @@
|
||||
export let autoOverflow = false
|
||||
export let initialContent: string | undefined = undefined
|
||||
export let textNodeActions: TextNodeAction[] = []
|
||||
export let editorAttributes: { [name: string]: string } = {}
|
||||
export let onExtensions: () => AnyExtension[] = () => []
|
||||
|
||||
let element: HTMLElement
|
||||
@ -200,6 +202,7 @@
|
||||
editor = new Editor({
|
||||
element,
|
||||
editable: true,
|
||||
editorProps: { attributes: mergeAttributes(defaultEditorAttributes, editorAttributes, { class: 'flex-grow' }) },
|
||||
extensions: [
|
||||
...defaultExtensions,
|
||||
Placeholder.configure({ placeholder: placeHolderStr }),
|
||||
@ -336,123 +339,7 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style lang="scss" global>
|
||||
.ProseMirror {
|
||||
flex-grow: 1;
|
||||
min-height: inherit !important;
|
||||
max-height: inherit !important;
|
||||
outline: none;
|
||||
line-height: 150%;
|
||||
color: var(--accent-color);
|
||||
|
||||
p:not(:last-child) {
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre !important;
|
||||
}
|
||||
|
||||
> * + * {
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
|
||||
/* Placeholder (at the top) */
|
||||
p.is-editor-empty:first-child::before {
|
||||
content: attr(data-placeholder);
|
||||
float: left;
|
||||
color: var(--dark-color);
|
||||
pointer-events: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--scrollbar-bar-hover);
|
||||
}
|
||||
&::-webkit-scrollbar-corner {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
/* Placeholder (at the top) */
|
||||
.ProseMirror p.is-editor-empty:first-child::before {
|
||||
color: #adb5bd;
|
||||
content: attr(data-placeholder);
|
||||
float: left;
|
||||
height: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.lint-icon {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
cursor: pointer;
|
||||
border-radius: 100px;
|
||||
// background: #f22;
|
||||
color: white;
|
||||
font-family: times, georgia, serif;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
width: 0.7em;
|
||||
height: 0.7em;
|
||||
text-align: center;
|
||||
padding-left: 0.5px;
|
||||
line-height: 1.1em;
|
||||
&.add {
|
||||
background: lightblue;
|
||||
}
|
||||
&.delete {
|
||||
background: orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* Give a remote user a caret */
|
||||
.collaboration-cursor__caret {
|
||||
border-left: 1px solid #0d0d0d;
|
||||
border-right: 1px solid #0d0d0d;
|
||||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
/* Render the username above the caret */
|
||||
.collaboration-cursor__label {
|
||||
border-radius: 3px 3px 3px 0;
|
||||
color: #0d0d0d;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
left: -1px;
|
||||
line-height: normal;
|
||||
padding: 0.1rem 0.3rem;
|
||||
position: absolute;
|
||||
top: -1.4em;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
cmark {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
span.insertion {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
span.deletion {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
<style lang="scss">
|
||||
.autoOverflow {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
import textEditorPlugin from '../plugin'
|
||||
import { RefInputAction, RefInputActionItem, TextEditorHandler, TextFormatCategory } from '../types'
|
||||
import Attach from './icons/Attach.svelte'
|
||||
import { AnyExtension } from '@tiptap/core'
|
||||
import { AnyExtension, mergeAttributes } from '@tiptap/core'
|
||||
import StyleButton from './StyleButton.svelte'
|
||||
import TextEditor from './TextEditor.svelte'
|
||||
import { Node as ProseMirrorNode } from '@tiptap/pm/model'
|
||||
@ -40,6 +40,7 @@
|
||||
export let autofocus = false
|
||||
export let full = false
|
||||
export let extensions: AnyExtension[] = []
|
||||
export let editorAttributes: { [name: string]: string } = {}
|
||||
export let textFormatCategories: TextFormatCategory[] = [
|
||||
TextFormatCategory.Heading,
|
||||
TextFormatCategory.TextDecoration,
|
||||
@ -148,6 +149,11 @@
|
||||
actions = defActions.concat(...cont).sort((a, b) => a.order - b.order)
|
||||
})
|
||||
|
||||
const mergedEditorAttributes = mergeAttributes(
|
||||
editorAttributes,
|
||||
full ? { class: 'text-editor-view_full-height' } : { class: 'text-editor-view_compact' }
|
||||
)
|
||||
|
||||
const editorHandler: TextEditorHandler = {
|
||||
insertText: (text) => {
|
||||
textEditor.insertText(text)
|
||||
@ -204,6 +210,7 @@
|
||||
{#if isScrollable}
|
||||
<Scroller>
|
||||
<TextEditor
|
||||
editorAttributes={mergedEditorAttributes}
|
||||
bind:content
|
||||
{placeholder}
|
||||
{extensions}
|
||||
@ -223,6 +230,7 @@
|
||||
</Scroller>
|
||||
{:else}
|
||||
<TextEditor
|
||||
editorAttributes={mergedEditorAttributes}
|
||||
bind:content
|
||||
{placeholder}
|
||||
{extensions}
|
||||
@ -284,11 +292,6 @@
|
||||
color: var(--theme-caption-color);
|
||||
background-color: transparent;
|
||||
|
||||
:global(.ProseMirror) {
|
||||
min-height: 0;
|
||||
// max-height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
&.scrollable {
|
||||
max-height: var(--texteditor-maxheight);
|
||||
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<script lang="ts">
|
||||
import { IntlString, translate } from '@hcengineering/platform'
|
||||
|
||||
import { FocusPosition } from '@tiptap/core'
|
||||
import { FocusPosition, mergeAttributes } from '@tiptap/core'
|
||||
import { AnyExtension, Editor, Extension, HTMLContent } from '@tiptap/core'
|
||||
|
||||
import Placeholder from '@tiptap/extension-placeholder'
|
||||
@ -29,6 +29,7 @@
|
||||
import TextEditorStyleToolbar from './TextEditorStyleToolbar.svelte'
|
||||
import { TextFormatCategory } from '../types'
|
||||
import { InlineStyleToolbar } from './extension/inlineStyleToolbar'
|
||||
import { defaultEditorAttributes } from './editor/editorProps'
|
||||
|
||||
export let content: string = ''
|
||||
export let placeholder: IntlString = textEditorPlugin.string.EditorPlaceholder
|
||||
@ -36,6 +37,7 @@
|
||||
export let textFormatCategories: TextFormatCategory[] = []
|
||||
export let supportSubmit = true
|
||||
export let isEmpty = true
|
||||
export let editorAttributes: { [name: string]: string } = {}
|
||||
|
||||
let element: HTMLElement
|
||||
let editor: Editor
|
||||
@ -137,6 +139,7 @@
|
||||
ph.then(() => {
|
||||
editor = new Editor({
|
||||
element,
|
||||
editorProps: { attributes: mergeAttributes(defaultEditorAttributes, editorAttributes) },
|
||||
content,
|
||||
extensions: [
|
||||
...defaultExtensions,
|
||||
@ -221,50 +224,7 @@
|
||||
</div>
|
||||
<div class="select-text" style="width: 100%;" on:mousedown={onEditorClick} bind:this={element} />
|
||||
|
||||
<style lang="scss" global>
|
||||
.ProseMirror {
|
||||
overflow-y: auto;
|
||||
font: inherit;
|
||||
min-height: inherit !important;
|
||||
max-height: inherit !important;
|
||||
outline: none;
|
||||
line-height: 150%;
|
||||
color: var(--theme-caption-color);
|
||||
|
||||
p:not(:last-child) {
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
|
||||
> * + * {
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
|
||||
/* Placeholder (at the top) */
|
||||
p.is-editor-empty:first-child::before {
|
||||
content: attr(data-placeholder);
|
||||
float: left;
|
||||
color: var(--theme-halfcontent-color);
|
||||
pointer-events: none;
|
||||
height: 0;
|
||||
}
|
||||
&:focus-within p.is-editor-empty:first-child::before {
|
||||
color: var(--theme-trans-color);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--scrollbar-bar-hover);
|
||||
}
|
||||
&::-webkit-scrollbar-corner {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
<style lang="scss">
|
||||
.formatPanel {
|
||||
margin: -0.5rem -0.25rem 0.5rem;
|
||||
padding: 0.375rem;
|
||||
|
||||
@ -85,7 +85,7 @@ export function calculateDecorations (
|
||||
|
||||
function lintIcon (color: string): any {
|
||||
const icon = document.createElement('div')
|
||||
icon.className = `lint-icon ${color}`
|
||||
icon.className = `text-editor-lint-icon ${color}`
|
||||
return icon
|
||||
}
|
||||
|
||||
|
||||
@ -0,0 +1 @@
|
||||
export const defaultEditorAttributes: { [name: string]: string } = { class: 'text-editor-view' }
|
||||
@ -135,7 +135,7 @@ export const ImageRef = Node.create<ImageOptions>({
|
||||
merged.src = getFileUrl(id, width)
|
||||
merged.srcset = getFileUrl(id, width) + ' 1x,' + getFileUrl(id, getIconSize2x(width)) + ' 2x'
|
||||
}
|
||||
merged.class = 'textEditorImage'
|
||||
merged.class = 'text-editor-image'
|
||||
this.options.reportNode?.(id, node)
|
||||
}
|
||||
return ['img', merged]
|
||||
|
||||
@ -1,4 +1,109 @@
|
||||
.textEditorImage {
|
||||
.ProseMirror {
|
||||
outline: none;
|
||||
|
||||
&.text-editor-view {
|
||||
font: inherit;
|
||||
line-height: 150%;
|
||||
}
|
||||
}
|
||||
|
||||
.text-editor-view {
|
||||
overflow-y: auto;
|
||||
color: var(--theme-caption-color);
|
||||
|
||||
p:not(:last-child) {
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
|
||||
>*+* {
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
|
||||
/* Placeholder (at the top) */
|
||||
p.is-editor-empty:first-child::before {
|
||||
content: attr(data-placeholder);
|
||||
float: left;
|
||||
color: var(--theme-halfcontent-color);
|
||||
pointer-events: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
&.text-editor-view_compact {
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&.text-editor-view_full-height {
|
||||
min-height: 0;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
&:focus-within p.is-editor-empty:first-child::before {
|
||||
color: var(--theme-trans-color);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--scrollbar-bar-hover);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-corner {
|
||||
background-color: var(--scrollbar-bar-color);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Give a remote user a caret */
|
||||
.collaboration-cursor__caret {
|
||||
border-left: 1px solid #0d0d0d;
|
||||
border-right: 1px solid #0d0d0d;
|
||||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
/* Render the username above the caret */
|
||||
.collaboration-cursor__label {
|
||||
border-radius: 3px 3px 3px 0;
|
||||
color: #0d0d0d;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
left: -1px;
|
||||
line-height: normal;
|
||||
padding: 0.1rem 0.3rem;
|
||||
position: absolute;
|
||||
top: -1.4em;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
cmark {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
span.insertion {
|
||||
border-top: 1px solid lightblue;
|
||||
border-bottom: 1px solid lightblue;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
span.deletion {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.text-editor-image {
|
||||
cursor: pointer;
|
||||
object-fit: contain;
|
||||
}
|
||||
@ -22,19 +127,28 @@
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.proseH1 {
|
||||
margin-block-start: 1.25rem;
|
||||
margin-block-end: 1.25rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.75rem;
|
||||
// line-height: 1.75rem;
|
||||
color: red;
|
||||
}
|
||||
.proseH2 {
|
||||
margin-block-start: 1rem;
|
||||
margin-block-end: 1.125rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
// line-height: 1.75rem;
|
||||
color: green;
|
||||
}
|
||||
.text-editor-lint-icon {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
cursor: pointer;
|
||||
border-radius: 100px;
|
||||
// background: #f22;
|
||||
color: white;
|
||||
font-family: times, georgia, serif;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
width: 0.7em;
|
||||
height: 0.7em;
|
||||
text-align: center;
|
||||
padding-left: 0.5px;
|
||||
line-height: 1.1em;
|
||||
|
||||
&.add {
|
||||
background: lightblue;
|
||||
}
|
||||
|
||||
&.delete {
|
||||
background: orange;
|
||||
}
|
||||
}
|
||||
@ -74,4 +74,4 @@ pre.proseCodeBlock > code.proseCode {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.proseHeading { line-height: 110%; }
|
||||
.proseHeading { line-height: 110%; }
|
||||
@ -245,12 +245,6 @@
|
||||
border-radius: 0.25rem;
|
||||
caret-color: var(--theme-caret-color);
|
||||
|
||||
:global(.ProseMirror) {
|
||||
min-height: 0;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
:global(a) {
|
||||
font: inherit;
|
||||
font-weight: 500;
|
||||
|
||||
@ -373,12 +373,6 @@
|
||||
margin-bottom: 2rem;
|
||||
border-radius: 0.25rem;
|
||||
|
||||
:global(.ProseMirror) {
|
||||
min-height: 0;
|
||||
max-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
:global(a) {
|
||||
font: inherit;
|
||||
font-weight: 500;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user