chore(Sync): Refactor and improve Sync Code Instructions component#20563
chore(Sync): Refactor and improve Sync Code Instructions component#20563caybro wants to merge 1 commit into
Conversation
- simplify the instructions into coherent sentences, easier to translate, no repetitions; automatic numbering - present the instructions in a responsive/wrappable manner - remove the obsolete GetSyncCodeMobileInstructions.qml Fixes #19439
f08bdee to
2f4db8e
Compare
Jenkins BuildsClick to see older builds (29)
|
There was a problem hiding this comment.
Removed as it's no longer relevant
| qsTr("Click %1", "Click Setup Syncing").arg(colorTag(qsTr("Setup Syncing"))), // 5. | ||
| qsTr("%1 on this device", "Scan QR on this device").arg(colorTag(qsTr("Scan QR"))), // 6. | ||
| qsTr("Scan or enter the code") // 7. | ||
| ] |
There was a problem hiding this comment.
Simple model of text instructions
micieslak
left a comment
There was a problem hiding this comment.
Nice cleanup, code looks ok in general hovewer:
The icons within the circle look better to me, they also seem to be better aligned in relation to text.
New one:

Lack of circle, color not matching theme (probably bc of default parameter)
I also wonder if instead of separating it into multiple strings we could use just single string containing the whole content. Additionally it could be markdown, solving such details like wrapped line and proper indentation for numbering, what is not ideal now:
Yeah, it's because it was a QML component :(
Good idea but with HTML (Markdown can't be styled like with CSS); the only problem remains how to either inject QML components into the markdown, or at least restyle/recolor the SVG icons |

What does the PR do
Fixes #19439
Affected areas
Sync/Pair instructions
Quality checklist
My PR is consistent with this document: QML Architecture Guidelines
Screencapture of the functionality
Normal layout/popup:

Narrow layout:

Impact on end user
How to test
...
Risk
low