diff --git a/webapp/app/locales/en-us.json b/webapp/app/locales/en-us.json
index 555f52793..e7e38d7f4 100644
--- a/webapp/app/locales/en-us.json
+++ b/webapp/app/locales/en-us.json
@@ -202,6 +202,8 @@
"reviewed": "reviewed",
"activities_title": "Latest activities",
"item": {
+ "rtl_badge": "RTL",
+ "rtl": "Right to left text",
"correct_all_button": "Mark all strings as reviewed",
"uncorrect_all_button": "Put all strings back in review"
}
diff --git a/webapp/app/locales/fr-ca.json b/webapp/app/locales/fr-ca.json
index 6de6ddc63..a83d82255 100644
--- a/webapp/app/locales/fr-ca.json
+++ b/webapp/app/locales/fr-ca.json
@@ -218,6 +218,8 @@
"reviewed": "revu",
"activities_title": "Dernières activités",
"item": {
+ "rtl_badge": "RTL",
+ "rtl": "Texte de droite à gauche",
"correct_all_button": "Marquer toutes les chaînes comme vérifiées",
"uncorrect_all_button": "Remettre toutes les chaînes à réviser"
}
diff --git a/webapp/app/pods/components/conflicts-list/item/styles.scss b/webapp/app/pods/components/conflicts-list/item/styles.scss
index c4b1f7fb9..f873aaa5c 100644
--- a/webapp/app/pods/components/conflicts-list/item/styles.scss
+++ b/webapp/app/pods/components/conflicts-list/item/styles.scss
@@ -31,6 +31,30 @@
.item-details {
display: flex;
flex-direction: column;
+
+ &[data-dir='rtl'] {
+ .item-details__column {
+ align-items: flex-end;
+ }
+ .item-details__column:first-of-type {
+ margin-right: 0;
+ margin-left: 15px;
+ }
+
+ .item-key {
+ margin-right: 0;
+ margin-left: 15px;
+ flex-direction: row-reverse;
+ }
+
+ .item-key-prefix::before {
+ content: '';
+ }
+
+ .item-key-prefix::after {
+ content: '/';
+ }
+ }
}
.item-details__column {
@@ -154,21 +178,21 @@
}
.item-key-prefix {
- display: block;
+ display: inline-flex;
font-size: 11px;
color: #959595;
+ gap: 6px;
font-weight: 300;
&::before {
content: '/';
- margin-right: -5px;
}
}
.item-key {
display: flex;
align-items: center;
- gap: 3px;
+ gap: 5px;
margin-bottom: 12px;
font-family: var(--font-monospace);
word-break: break-all;
@@ -214,8 +238,8 @@
justify-content: flex-end;
position: absolute;
gap: 10px;
- top: 7px;
- right: 7px;
+ top: 10px;
+ right: 10px;
z-index: 3;
&[data-dir='rtl'] {
diff --git a/webapp/app/pods/components/conflicts-list/item/template.hbs b/webapp/app/pods/components/conflicts-list/item/template.hbs
index 59c3430b1..5620604a2 100644
--- a/webapp/app/pods/components/conflicts-list/item/template.hbs
+++ b/webapp/app/pods/components/conflicts-list/item/template.hbs
@@ -25,7 +25,7 @@
{{else}}
-
+
diff --git a/webapp/app/pods/components/dashboard-revisions/item/component.ts b/webapp/app/pods/components/dashboard-revisions/item/component.ts
index 503aa0996..a3749ef1c 100644
--- a/webapp/app/pods/components/dashboard-revisions/item/component.ts
+++ b/webapp/app/pods/components/dashboard-revisions/item/component.ts
@@ -68,6 +68,10 @@ export default class DashboardRevisionsItem extends Component {
return this.args.revision.name || this.args.revision.language.name;
}
+ get rtl() {
+ return this.args.revision.rtl || this.args.revision.language.rtl;
+ }
+
@action
toggleShowActions() {
this.showActions = !this.showActions;
diff --git a/webapp/app/pods/components/dashboard-revisions/item/template.hbs b/webapp/app/pods/components/dashboard-revisions/item/template.hbs
index e21020625..416288093 100644
--- a/webapp/app/pods/components/dashboard-revisions/item/template.hbs
+++ b/webapp/app/pods/components/dashboard-revisions/item/template.hbs
@@ -12,6 +12,11 @@
{{#if (get @permissions 'index_translations')}}
{{this.languageName}}
+ {{#if this.rtl}}
+
+ {{t 'components.dashboard_revisions.item.rtl_badge'}}
+
+ {{/if}}
{{this.correctedKeysPercentage}}
%
diff --git a/webapp/app/pods/components/documents-machine-translations-button/template.hbs b/webapp/app/pods/components/documents-machine-translations-button/template.hbs
index 77c8936db..571bab534 100644
--- a/webapp/app/pods/components/documents-machine-translations-button/template.hbs
+++ b/webapp/app/pods/components/documents-machine-translations-button/template.hbs
@@ -1,4 +1,4 @@
-
+
{{inline-svg '/assets/language.svg' class='button-icon'}}
{{t 'components.documents_machine_translations_button.link'}}
\ No newline at end of file
diff --git a/webapp/app/pods/components/related-translations-list/item/styles.scss b/webapp/app/pods/components/related-translations-list/item/styles.scss
index ed0645ad9..61e50d2e6 100644
--- a/webapp/app/pods/components/related-translations-list/item/styles.scss
+++ b/webapp/app/pods/components/related-translations-list/item/styles.scss
@@ -81,6 +81,7 @@
right: 14px;
&[data-dir='rtl'] {
+ flex-direction: row-reverse;
right: auto;
left: 14px;
}
diff --git a/webapp/app/pods/components/translations-list/item/styles.scss b/webapp/app/pods/components/translations-list/item/styles.scss
index 16c6ff84f..4426a44b8 100644
--- a/webapp/app/pods/components/translations-list/item/styles.scss
+++ b/webapp/app/pods/components/translations-list/item/styles.scss
@@ -7,6 +7,37 @@
border: 1px solid transparent;
border-radius: var(--border-radius);
+ &[data-dir='rtl'] {
+ .item-header {
+ flex-direction: row-reverse;
+
+ .item-edit-wrapper {
+ flex-direction: row-reverse;
+ }
+
+ .item-meta {
+ flex-direction: row-reverse;
+ margin-right: 10px;
+ }
+
+ .item-updatedAt {
+ margin-left: 0;
+ margin-right: 10px;
+ }
+
+ .item-key {
+ flex-direction: row-reverse;
+ }
+
+ .item-key-prefix::before {
+ content: '';
+ }
+ .item-key-prefix::after {
+ content: '/';
+ }
+ }
+ }
+
&:focus,
&:hover {
background: var(--background-light);
@@ -16,6 +47,12 @@
opacity: 1;
}
+ &[data-dir='rtl'] {
+ .item-edit {
+ transform: translateX(40px);
+ }
+ }
+
.item-edit {
transform: translateX(-40px);
opacity: 1;
@@ -55,6 +92,10 @@
}
}
+.item-edit-wrapper {
+ display: flex;
+}
+
.item-header {
position: relative;
display: flex;
@@ -89,7 +130,8 @@
}
.item-key-prefix {
- display: block;
+ display: inline-flex;
+ gap: 5px;
font-size: 11px;
color: #959595;
flex-shrink: 0;
@@ -97,17 +139,15 @@
&::before {
content: '/';
- margin-right: -5px;
}
}
.item-key {
display: flex;
align-items: center;
- gap: 2px;
+ gap: 5px;
transition: 0.2s ease-in-out;
transition-property: color;
- margin-right: 10px;
color: var(--color-primary);
line-height: 1.5;
word-break: break-all;
@@ -197,6 +237,7 @@
&[data-dir='rtl'] {
right: auto;
left: 14px;
+ flex-direction: row-reverse;
}
}
diff --git a/webapp/app/pods/components/translations-list/item/template.hbs b/webapp/app/pods/components/translations-list/item/template.hbs
index c7fab21b1..bac92459d 100644
--- a/webapp/app/pods/components/translations-list/item/template.hbs
+++ b/webapp/app/pods/components/translations-list/item/template.hbs
@@ -1,6 +1,6 @@
-
-
-
+
+
+
{{#if this.isInEditMode}}
diff --git a/webapp/app/queries/project-dashboard.ts b/webapp/app/queries/project-dashboard.ts
index cff1c3442..cc8beeef3 100644
--- a/webapp/app/queries/project-dashboard.ts
+++ b/webapp/app/queries/project-dashboard.ts
@@ -134,9 +134,11 @@ export default gql`
translationsCount
isMaster
name
+ rtl
language {
id
name
+ rtl
}
}
diff --git a/webapp/app/styles/html-components/button.scss b/webapp/app/styles/html-components/button.scss
index f4488b2d1..934c24cad 100644
--- a/webapp/app/styles/html-components/button.scss
+++ b/webapp/app/styles/html-components/button.scss
@@ -236,7 +236,7 @@
}
.button--grey {
- color: #8a8a8a;
+ color: #000;
border-color: var(--background-light);
&.button--loading svg.loading {