mirror of
https://github.com/discourse/discourse.git
synced 2026-08-11 02:59:07 +08:00
Related: https://meta.discourse.org/t/manual-localization-doesnt-seem-to-be-working/407319 Users have gotten tripped over and over again when manually inserting translations for posts, not knowing they need to set the post language first before the translation is shown (explained [here](https://meta.discourse.org/t/manual-localization-doesnt-seem-to-be-working/407319/7?u=nat)). This PR adds the ability to allow the user to set the post language in the modal when they are working with translations, highlighting the fact that they need to set the post language before translations can be shown
82 lines
1.6 KiB
SCSS
Vendored
82 lines
1.6 KiB
SCSS
Vendored
@use "lib/viewport";
|
|
|
|
.post-translations-modal {
|
|
table {
|
|
width: 100%;
|
|
}
|
|
|
|
&__language-settings {
|
|
display: grid;
|
|
gap: var(--space-3);
|
|
margin-block-end: var(--space-4);
|
|
}
|
|
|
|
&__language-control {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1fr) auto;
|
|
gap: var(--space-2);
|
|
align-items: end;
|
|
|
|
@include viewport.until(sm) {
|
|
display: contents;
|
|
}
|
|
}
|
|
|
|
&__language-actions {
|
|
display: flex;
|
|
gap: var(--space-1);
|
|
|
|
@include viewport.until(sm) {
|
|
order: 1;
|
|
}
|
|
|
|
&.is-hidden {
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
|
|
@include viewport.until(sm) {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.fk-d-menu.post-language-selector-content {
|
|
z-index: z("composer", "dropdown");
|
|
|
|
// eventho mobile composer shouldnt be used in conjuction with fk-d-menu (floating version), on tablets the possibility unfortunately exists
|
|
.discourse-touch & {
|
|
z-index: z("mobile-composer");
|
|
}
|
|
}
|
|
|
|
.fk-d-tooltip__content[data-identifier="post-language"]
|
|
.fk-d-tooltip__inner-content {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
|
|
.post-language__original-language {
|
|
appearance: none;
|
|
border: 0;
|
|
background: transparent;
|
|
color: inherit;
|
|
font: inherit;
|
|
padding: 0;
|
|
text-align: start;
|
|
}
|
|
|
|
.post-language__disclaimer {
|
|
color: var(--primary-medium);
|
|
font-size: var(--font-down-2);
|
|
margin-top: var(--space-1);
|
|
}
|
|
}
|
|
|
|
.post-language-selector-trigger {
|
|
.toolbar-popup-menu-options__trigger-label {
|
|
margin-left: var(--space-1);
|
|
font-size: var(--font-down-2);
|
|
text-transform: uppercase;
|
|
color: var(--primary-high);
|
|
}
|
|
}
|