mirror of
https://github.com/infiniflow/ragflow.git
synced 2026-03-19 05:37:51 +08:00
### What problem does this PR solve? This PR implements comprehensive Arabic language support for the RAGFlow application. The changes include: - Complete Arabic translation of all UI text elements in the web interface - RTL (right-to-left) layout support for Arabic content - Localization updates for all supported languages (ar, bg, de, en, es, fr, id, it, ja, pt-br, ru, vi, zh-traditional, zh) - UI component adjustments to properly display Arabic text and support RTL layout The implementation ensures that Arabic-speaking users can fully interact with the application in their native language with proper text rendering and layout direction. ### Type of change - [x] New Feature (non-breaking change which adds functionality) <img width="2866" height="1617" alt="image" src="https://github.com/user-attachments/assets/f2751b34-1b65-4867-b81d-a1068c17b9b7" /> --------- Co-authored-by: Yingfeng <yingfeng.zhang@gmail.com>
66 lines
1.1 KiB
Plaintext
66 lines
1.1 KiB
Plaintext
.messageItem {
|
|
padding: 24px 0;
|
|
.messageItemSection {
|
|
display: inline-block;
|
|
}
|
|
.messageItemSectionLeft {
|
|
width: 80%;
|
|
}
|
|
.messageItemContent {
|
|
display: inline-flex;
|
|
gap: 20px;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
.messageItemContentReverse {
|
|
flex-direction: row-reverse;
|
|
}
|
|
|
|
.messageTextBase() {
|
|
padding: 6px 10px;
|
|
border-radius: 8px;
|
|
& > p {
|
|
margin: 0;
|
|
}
|
|
}
|
|
.messageText {
|
|
.chunkText();
|
|
.messageTextBase();
|
|
// background-color: #e6f4ff;
|
|
word-break: break-word;
|
|
}
|
|
.messageTextDark {
|
|
.chunkText();
|
|
.messageTextBase();
|
|
padding: 0;
|
|
word-break: break-word;
|
|
:global(section.think) {
|
|
color: rgb(166, 166, 166);
|
|
border-inline-start-color: rgb(78, 78, 86);
|
|
}
|
|
}
|
|
|
|
.messageUserText {
|
|
.chunkText();
|
|
.messageTextBase();
|
|
background-color: rgba(255, 255, 255, 0.3);
|
|
word-break: break-word;
|
|
text-align: justify;
|
|
}
|
|
.messageEmpty {
|
|
width: 300px;
|
|
}
|
|
|
|
.thumbnailImg {
|
|
max-width: 20px;
|
|
}
|
|
}
|
|
|
|
.messageItemLeft {
|
|
text-align: start;
|
|
}
|
|
|
|
.messageItemRight {
|
|
text-align: end;
|
|
}
|