mirror of
https://github.com/nextcloud/documentation.git
synced 2026-03-27 13:38:39 +07:00
docs(dev-manual): css RTL/LTR guidelines
Signed-off-by: Hamza <hamzamahjoubi221@gmail.com>
This commit is contained in:
@@ -263,3 +263,46 @@ There are some predefined classes for public use to ease developing an applicati
|
||||
+----------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|
||||
| ``.inlineblock`` | Make an element an inline block |
|
||||
+----------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|
||||
|
||||
RTL guidelines
|
||||
==============
|
||||
|
||||
Dos and Don'ts
|
||||
^^^^^^^^^^^^^^
|
||||
|
||||
.. list-table::
|
||||
:header-rows: 1
|
||||
|
||||
* - Bad
|
||||
- Good
|
||||
- Description
|
||||
* - Use physical properties ``margin-left``
|
||||
- Use logical properties ``margin-inline-start``
|
||||
- Using logical propreties automatically adapts to LTR/RTL
|
||||
* - Use ``left`` or ``right``
|
||||
- Use inset-inline-start/end
|
||||
- Keep positiong directon aware
|
||||
* - Use text-align: left/right
|
||||
- Use text-align: start/end
|
||||
- Text aligns correctly in both modes
|
||||
* - Use border-left/right
|
||||
- Use border-inline-start/end
|
||||
- Borders flip correctly
|
||||
* - Use float: left/right
|
||||
- Use float: inline-start/end
|
||||
- Float respects direction
|
||||
* - Assume RTL “just works”
|
||||
- Test your app with RTL languages
|
||||
- Using the correct css value is not always enough to avoid bugs
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user