Add list functionality to rich text editor (#9871)

* adds buttons to toggle bulleted and numbered lists on and off
* adds icons for those buttons
* css changes to timeline display
* adds tests for the new buttons, refactors existing tests
This commit is contained in:
alunturner 2023-01-13 15:44:35 +00:00 committed by GitHub
parent 7975b07128
commit 6052db1e8a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 140 additions and 65 deletions

View file

@ -619,6 +619,17 @@ $left-gutter: 64px;
ul ol {
list-style-type: revert;
}
/* Make list type disc to match rich text editor */
> ul {
list-style-type: disc;
}
/* Remove top and bottom margin for better consecutive list display */
> :is(ol, ul) {
margin-top: 0;
margin-bottom: 0;
}
}
}

View file

@ -25,6 +25,7 @@ limitations under the License.
}
.mx_WysiwygComposer_Editor_content {
line-height: $font-22px;
white-space: pre-wrap;
word-wrap: break-word;
outline: none;
@ -35,6 +36,19 @@ limitations under the License.
.caretNode {
user-select: all;
}
ul,
ol {
margin-top: 0;
margin-bottom: 0;
padding-inline-start: $spacing-28;
}
// model output always includes a linebreak but we do not want the user
// to see it when writing input in lists
:is(ol, ul) + br:last-of-type {
display: none;
}
}
.mx_WysiwygComposer_Editor_content_placeholder::before {