[CONTEDIT-12] Allow to decorate text as bold and italic and to set links in text blocks Created: 09/Feb/17  Updated: 08/Sep/17  Resolved: 01/Mar/17

Status: Closed
Project: Content Editor
Component/s: None
Affects Version/s: None
Fix Version/s: 1.0

Type: Story Priority: Neutral
Reporter: Anja von Gunten Assignee: Aleksandr Pchelintcev
Resolution: Fixed Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Attachments: PNG File story add link 01.01.png     PNG File story add link 01.02.png     PNG File story add link 01.04.png     PNG File story add link 01.05.png     PNG File story add link 01.06.png     PNG File story add link 01.07.png     PNG File story decorate text 01.01.png     PNG File story decorate text 01.02.png     PNG File story decorate text 01.03.png    
Issue Links:
Relates
relates to CONTEDIT-13 Add header style to text blocks Closed
dependency
depends upon CONTEDIT-36 Fix the "jumping toolbar" on mouse hover Closed
depends upon CONTEDIT-35 Remove the "strike-through" option in... Closed
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: Initial Article editor
Sprint: Basel 85
Story Points: 8

 Description   

The stories of the Article Editor so far cover the creation of raw text blocks only. This story asks for (limited) rich-text editing features to be available in every text block.

When editing a text block in the article story, a toolbar with text decoration options will appear. Out of the box there are usually a large set of default rich editing options. Most of them are never used. For the article editor we want to reduce those options to keep the UI simple + easy. We also don't want the user to have to deal with HTML code when editing text.

PLEASE NOTE: Although the mockups appear in a new visual design please ignore the styling. Only focus on mechanics & functionality!


Reduce default toolbar options

1. Reduce the default options in the toolbar to a minimal choice: bold, italic, header style 1, header style 2, add link.
2. Align the toolbar centered above the text block.

Apply bold/italic to text

1. Select text in a text block. Apply text decorations bold and italic by selecting the icons in the toolbar. Bold/italic can be selected separate or combined.
2. If the cursor is at the beginning of a text block and bold or italic is already selected, text will appear in bold or italic when user starts typing.

Remove bold/italic from text

1. Select text in a text block where bold or italic has been applied.
2. Remove text decorations bold or italic by deselecting the icons in the toolbar.

Split words with text decorations

If you split a word that has bold and/or italic applied (e.g. if you press Enter to create a new text block) the word is properly split at the cursor position and text decorations of the word are properly preserved in both text blocks.


Add link to text

1. Select text in a text block.

2. Click the "link" icon in the toolbar. An input field appears below and centered to the selected text.

3. Type or paste a link in the field and press return. The selected text is now bold/underlined and indicates that there is a link.

Remove link from text

1. Put the cursor inside an existing link and click the "link" icon in the toolbar. (Note that you don't need to select the entire link in order to remove it - it's sufficient to position the cursor within an existing link).

2. The input field will appear. Click the delete icon ("x") next to the input field.

3. The link itself as well as the text decorations bold/underlined will be removed.



 Comments   
Comment by Andreas Weder [ 28/Feb/17 ]

Added some issues that should be fixed by this story as well: ARTEDIT-36 and ARTEDIT-35.

Generated at Mon Feb 12 00:16:10 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.