Show selected widget language flag
This commit is contained in:
@@ -240,6 +240,24 @@ label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
|
|||||||
.widget-language-settings select {
|
.widget-language-settings select {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
.language-select {
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.language-select select {
|
||||||
|
padding-left: 42px;
|
||||||
|
}
|
||||||
|
.selected-language-flag {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
left: 12px;
|
||||||
|
top: 50%;
|
||||||
|
width: 22px;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
font-size: 17px;
|
||||||
|
line-height: 1;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
.effect-settings .full-row {
|
.effect-settings .full-row {
|
||||||
display: grid;
|
display: grid;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
|
|||||||
+6
-1
@@ -122,7 +122,12 @@
|
|||||||
<option value="default">Default</option>
|
<option value="default">Default</option>
|
||||||
</select>
|
</select>
|
||||||
</label>
|
</label>
|
||||||
<label>Default <select name="defaultLanguage"></select></label>
|
<label>Default
|
||||||
|
<span class="language-select">
|
||||||
|
<span id="defaultLanguageFlag" class="selected-language-flag" aria-hidden="true"></span>
|
||||||
|
<select name="defaultLanguage"></select>
|
||||||
|
</span>
|
||||||
|
</label>
|
||||||
<small>Auto pouzije jazyk ze stranky. Default je vychozi jazyk i zaloha.</small>
|
<small>Auto pouzije jazyk ze stranky. Default je vychozi jazyk i zaloha.</small>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset class="effect-settings widget-copy-settings">
|
<fieldset class="effect-settings widget-copy-settings">
|
||||||
|
|||||||
@@ -114,6 +114,7 @@ $("#settingsForm").brandHex.addEventListener("input", (event) => {
|
|||||||
if (color) $("#settingsForm").brand.value = color;
|
if (color) $("#settingsForm").brand.value = color;
|
||||||
});
|
});
|
||||||
$("#settingsForm").defaultLanguage.addEventListener("change", () => {
|
$("#settingsForm").defaultLanguage.addEventListener("change", () => {
|
||||||
|
updateDefaultLanguageFlag();
|
||||||
renderWidgetCopyFields($("#settingsForm").defaultLanguage.value);
|
renderWidgetCopyFields($("#settingsForm").defaultLanguage.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -465,6 +466,7 @@ function renderWidgetLanguageOptions(form, settings) {
|
|||||||
form.defaultLanguage.innerHTML = options;
|
form.defaultLanguage.innerHTML = options;
|
||||||
form.widgetLanguageMode.value = language.mode === "fixed" ? "default" : language.mode || "auto";
|
form.widgetLanguageMode.value = language.mode === "fixed" ? "default" : language.mode || "auto";
|
||||||
form.defaultLanguage.value = language.defaultLanguage || "cs";
|
form.defaultLanguage.value = language.defaultLanguage || "cs";
|
||||||
|
updateDefaultLanguageFlag();
|
||||||
}
|
}
|
||||||
|
|
||||||
function languageFlag(language) {
|
function languageFlag(language) {
|
||||||
@@ -483,6 +485,13 @@ function flagEmoji(countryCode) {
|
|||||||
return [...code].map((letter) => String.fromCodePoint(127397 + letter.charCodeAt(0))).join("");
|
return [...code].map((letter) => String.fromCodePoint(127397 + letter.charCodeAt(0))).join("");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function updateDefaultLanguageFlag() {
|
||||||
|
const flag = $("#defaultLanguageFlag");
|
||||||
|
const select = $("#settingsForm")?.defaultLanguage;
|
||||||
|
if (!flag || !select) return;
|
||||||
|
flag.textContent = languageFlag(select.value || "cs");
|
||||||
|
}
|
||||||
|
|
||||||
function renderWidgetCopyFields(language) {
|
function renderWidgetCopyFields(language) {
|
||||||
const form = $("#settingsForm");
|
const form = $("#settingsForm");
|
||||||
const settings = state.site?.settings || {};
|
const settings = state.site?.settings || {};
|
||||||
|
|||||||
Reference in New Issue
Block a user