[FIX] website_forum: better css in the JW toolbar
This commit is contained in:
Sébastien Geelen (sge)
committed by
Antoine Guenet
Antoine Guenet
parent
eea4601f11
commit
e770066e2f
@@ -482,6 +482,10 @@ img::selection {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.o_forum_editor .note-editing-area > div {
|
||||
padding: 3px 5px;
|
||||
}
|
||||
|
||||
jw-toolbar {
|
||||
display: block;
|
||||
text-align: center;
|
||||
@@ -610,6 +614,108 @@ jw-follow-range jw-toolbar {
|
||||
content: '';
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
jw-select {
|
||||
> jw-group {
|
||||
display: none;
|
||||
background-color: #444;
|
||||
border-radius: 10px;
|
||||
position: absolute;
|
||||
padding: 5px 10px;
|
||||
z-index: 1000;
|
||||
margin-top: 8px !important;
|
||||
&:before {
|
||||
border-color: transparent transparent #444444 transparent;
|
||||
border-width: 9px;
|
||||
top: -17px;
|
||||
border-style: solid;
|
||||
content: '';
|
||||
position: absolute;
|
||||
}
|
||||
jw-button {
|
||||
display: block;
|
||||
line-height: 28px;
|
||||
height: 35px;
|
||||
text-align: left;
|
||||
color: #C6C6C6;
|
||||
border-bottom-width: 0;
|
||||
&.active {
|
||||
background-color: #586e71 !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
&:last-child {
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
&:first-child {
|
||||
margin-left: 0; // We need a stronger selector to overrride previous toolbar css
|
||||
}
|
||||
&.p, &.h1, &.h2, &.h3, &.h4, &.h5, &.h6, &.pre {
|
||||
line-height: 21px;
|
||||
}
|
||||
|
||||
}
|
||||
.h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.h2 {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
.h3 {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.h4 {
|
||||
font-size: 1em;
|
||||
}
|
||||
.h5 {
|
||||
font-size: 0.83em;
|
||||
}
|
||||
.h6 {
|
||||
font-size: 0.67em;
|
||||
}
|
||||
}
|
||||
&[aria-pressed="true"] > jw-group {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
jw-group[name=textSize] jw-select jw-group jw-button {
|
||||
padding-left: 24px;
|
||||
&.active {
|
||||
&:before {
|
||||
color: #01bad2;
|
||||
content: "";
|
||||
right: auto;
|
||||
left: 18px;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
font-family: FontAwesome;
|
||||
}
|
||||
}
|
||||
}
|
||||
jw-group[name=align] jw-select {
|
||||
&>jw-button {
|
||||
font-family: "FontAwesome" !important;
|
||||
text-align: center;
|
||||
&:before {
|
||||
content: "\f036";
|
||||
}
|
||||
&:after {
|
||||
display: inline-block;
|
||||
margin-left: 2px;
|
||||
vertical-align: 2px;
|
||||
content: "";
|
||||
border-top: 0.3em solid;
|
||||
border-right: 0.3em solid transparent;
|
||||
border-bottom: 0;
|
||||
border-left: 0.3em solid transparent;
|
||||
}
|
||||
}
|
||||
jw-group {
|
||||
padding: 10px;
|
||||
jw-button {
|
||||
margin: 0 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
jw-follow-range {
|
||||
|
||||
@@ -114,11 +114,11 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({
|
||||
});
|
||||
|
||||
_.each($('textarea.o_wysiwyg_loader'), async function (textarea) {
|
||||
var $textarea = $(textarea);
|
||||
var editorKarma = $textarea.data('karma') || 0; // default value for backward compatibility
|
||||
var hasFullEdit = parseInt($("#karma").val()) >= editorKarma;
|
||||
var toolbar = [
|
||||
[
|
||||
const $textarea = $(textarea);
|
||||
const editorKarma = $textarea.data('karma') || 0; // default value for backward compatibility
|
||||
const hasFullEdit = parseInt($("#karma").val()) >= editorKarma;
|
||||
let toolbar = {
|
||||
textSize: [
|
||||
[
|
||||
'ParagraphButton',
|
||||
'Heading1Button',
|
||||
@@ -130,15 +130,17 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({
|
||||
'PreButton',
|
||||
],
|
||||
],
|
||||
[
|
||||
textStyle: [
|
||||
'BoldButton',
|
||||
'ItalicButton',
|
||||
'UnderlineButton',
|
||||
'RemoveFormatButton'
|
||||
],
|
||||
[
|
||||
list: [
|
||||
'OrderedListButton',
|
||||
'UnorderedListButton',
|
||||
],
|
||||
align: [
|
||||
[
|
||||
'AlignLeftButton',
|
||||
'AlignCenterButton',
|
||||
@@ -146,14 +148,14 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({
|
||||
'AlignJustifyButton',
|
||||
],
|
||||
],
|
||||
['TableButton'],
|
||||
];
|
||||
table: ['TableButton'],
|
||||
};
|
||||
if (hasFullEdit) {
|
||||
toolbar.push(['OdooLinkToggleButton']);
|
||||
toolbar.push(['OdooMediaButton']);
|
||||
toolbar.link = ['OdooLinkToggleButton'];
|
||||
toolbar.media = ['OdooMediaButton'];
|
||||
}
|
||||
toolbar.push(['UndoButton', 'RedoButton']);
|
||||
var options = {
|
||||
toolbar.history = ['UndoButton', 'RedoButton'];
|
||||
const options = {
|
||||
toolbarLayout: toolbar,
|
||||
height: '100%',
|
||||
wrapperClass: 'note-editable o_editable flex-grow-1 ',
|
||||
@@ -167,7 +169,7 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({
|
||||
interface: `
|
||||
<t-dialog><t t-zone="default"/></t-dialog>
|
||||
<t-range><t t-zone="tools"/></t-range>
|
||||
<div class="d-flex flex-column flex-grow-1">
|
||||
<div class="d-flex flex-column flex-grow-1 o_forum_editor">
|
||||
<t t-zone="container">
|
||||
<div class="d-flex overflow-auto note-editing-area d-flex flex-grow-1" style="height: 200px; min-height: 80px;">
|
||||
<t t-zone="main"/>
|
||||
|
||||
Reference in New Issue
Block a user