mirror of
https://github.com/hcengineering/platform.git
synced 2025-06-05 07:14:22 +00:00
UBERF-60: updated Rich editor and Activity styles. (#3661)
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
parent
b73e5340f7
commit
07cb85acd1
@ -73,9 +73,9 @@
|
|||||||
{:else if node.nodeName === 'BLOCKQUOTE'}
|
{:else if node.nodeName === 'BLOCKQUOTE'}
|
||||||
<blockquote><svelte:self nodes={node.childNodes} /></blockquote>
|
<blockquote><svelte:self nodes={node.childNodes} /></blockquote>
|
||||||
{:else if node.nodeName === 'CODE'}
|
{:else if node.nodeName === 'CODE'}
|
||||||
<code><svelte:self nodes={node.childNodes} /></code>
|
<code class="proseCode"><svelte:self nodes={node.childNodes} /></code>
|
||||||
{:else if node.nodeName === 'PRE'}
|
{:else if node.nodeName === 'PRE'}
|
||||||
<pre><svelte:self nodes={node.childNodes} /></pre>
|
<pre class="proseCodeBlock"><svelte:self nodes={node.childNodes} /></pre>
|
||||||
{:else if node.nodeName === 'BR'}
|
{:else if node.nodeName === 'BR'}
|
||||||
{@const pName = prevName(ni, nodes)}
|
{@const pName = prevName(ni, nodes)}
|
||||||
{#if pName !== 'P' && pName !== 'BR' && pName !== undefined}
|
{#if pName !== 'P' && pName !== 'BR' && pName !== undefined}
|
||||||
@ -118,8 +118,6 @@
|
|||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{:else if node.nodeName === 'SPAN'}
|
{:else if node.nodeName === 'SPAN'}
|
||||||
<span style:margin={'0 .25rem'} style={node.getAttribute('style')}>
|
|
||||||
<!-- <svelte:self nodes={node.childNodes} /> -->
|
|
||||||
{#if node.getAttribute('data-objectclass') !== undefined && node.getAttribute('data-id') !== undefined}
|
{#if node.getAttribute('data-objectclass') !== undefined && node.getAttribute('data-id') !== undefined}
|
||||||
<Component
|
<Component
|
||||||
is={view.component.ObjectPresenter}
|
is={view.component.ObjectPresenter}
|
||||||
@ -134,7 +132,6 @@
|
|||||||
{:else}
|
{:else}
|
||||||
<svelte:self nodes={node.childNodes} />
|
<svelte:self nodes={node.childNodes} />
|
||||||
{/if}
|
{/if}
|
||||||
</span>
|
|
||||||
{:else if node.nodeName === 'TABLE'}
|
{:else if node.nodeName === 'TABLE'}
|
||||||
<table class={node.className}><svelte:self nodes={node.childNodes} /></table>
|
<table class={node.className}><svelte:self nodes={node.childNodes} /></table>
|
||||||
{:else if node.nodeName === 'TBODY'}
|
{:else if node.nodeName === 'TBODY'}
|
||||||
@ -183,12 +180,4 @@
|
|||||||
s {
|
s {
|
||||||
color: var(--theme-accent-color);
|
color: var(--theme-accent-color);
|
||||||
}
|
}
|
||||||
code {
|
|
||||||
padding: 0 0.25rem;
|
|
||||||
font-family: var(--mono-font);
|
|
||||||
color: var(--theme-content-color);
|
|
||||||
background-color: var(--theme-button-default);
|
|
||||||
border: 1px solid var(--theme-button-border);
|
|
||||||
border-radius: 0.25rem;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -275,7 +275,7 @@
|
|||||||
.textInput {
|
.textInput {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: flex-start;
|
align-items: flex-end;
|
||||||
min-height: 2.75rem;
|
min-height: 2.75rem;
|
||||||
padding: 0.75rem 1rem;
|
padding: 0.75rem 1rem;
|
||||||
background-color: var(--theme-refinput-color);
|
background-color: var(--theme-refinput-color);
|
||||||
|
@ -60,7 +60,10 @@ export const defaultExtensions: AnyExtension[] = [
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
heading: {
|
heading: {
|
||||||
levels: supportedHeadingLevels
|
levels: supportedHeadingLevels,
|
||||||
|
HTMLAttributes: {
|
||||||
|
class: 'proseHeading'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}),
|
}),
|
||||||
Highlight.configure({
|
Highlight.configure({
|
||||||
|
@ -98,8 +98,8 @@ table {
|
|||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
color: var(--dark-color);
|
color: var(--theme-content-color);
|
||||||
p { color: var(--accent-color); }
|
p { color: var(--theme-content-color); }
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Common */
|
/* Common */
|
||||||
|
@ -2,3 +2,26 @@
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
|
||||||
|
// need to override editor's bubble max-width
|
||||||
|
// due to https://github.com/atomiks/tippyjs/issues/451
|
||||||
|
// .tippy-box {
|
||||||
|
// max-width: 30rem !important;
|
||||||
|
// }
|
||||||
|
@ -61,5 +61,17 @@ table.proseTable {
|
|||||||
background-color: var(--theme-button-default);
|
background-color: var(--theme-button-default);
|
||||||
border: 1px solid var(--theme-button-border);
|
border: 1px solid var(--theme-button-border);
|
||||||
border-radius: .25rem;
|
border-radius: .25rem;
|
||||||
padding: 0.5rem;
|
padding: .5rem;
|
||||||
|
|
||||||
|
code { white-space: normal; }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Fixes for MessageViewer
|
||||||
|
pre.proseCodeBlock > code.proseCode {
|
||||||
|
padding: 0;
|
||||||
|
background-color: transparent;
|
||||||
|
border: none;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.proseHeading { line-height: 110%; }
|
||||||
|
Loading…
Reference in New Issue
Block a user