Change the Indentation Style and Padding for Lists
yordan-mitev opened this issue · 3 comments
I would like to request changes in the style of the lists. The suggested changes will help to improve the readability of the docs-seed-based articles.
List Indentation
All list items must be indented. Currently, bullet lists are aligned with the rest of the paragraphs, while numbered lists even use reverse indentation - they are indented to the left. Bullet and numbered list must be indented to the right and not aligned with the rest of the paragraphs:
Second Level Bullet Lists
The style of the bullets in second-level lists must be different. Currently, the bullet styles for first and second-level lists are identical.
List Spacing
The spacing before a list must be the same as the spacing between paragraphs. Currently, the spacing before a list is longer and makes lists look like they don't belong to the preceding paragraph.
On List Indentation and List Spacing, changing the margin of <ol> and <ul> elements inside an <article> fixes it: https://github.com/telerik/docs-seed/blob/master/_assets/css/_styles.scss#L1061
On Nested list styles, it seems we are creating our own styling and that is why it is currently the same for all levels: https://github.com/telerik/docs-seed/blob/master/_assets/css/_styles.scss#L1079
We can drop the custom appearance of the bullets and use the browser's ones similar to Katana based docs: https://www.telerik.com/kendo-react-ui/components/grid/get-started/
The suggested styles for indentation and spacing $("<style>article ul, article ol { margin: 0 22px;}</style>").appendTo($(document.body)) look very good.
Dropping the custom appearance and using the browser's styling for bullets also sounds good.
Blockquote + ul scenario that could be tested during implementation https://docs.telerik.com/blazor-ui/getting-started/client-blazor#step-1---set-up-a-blazor-project