diff --git a/ui/extra/images/flags/AU-flag.png b/ui/extra/images/flags/AU-flag.png
new file mode 100644
index 00000000000..e5fb8046d84
Binary files /dev/null and b/ui/extra/images/flags/AU-flag.png differ
diff --git a/ui/extra/images/flags/BL-flag.png b/ui/extra/images/flags/BL-flag.png
new file mode 100644
index 00000000000..1c9dbea7e4b
Binary files /dev/null and b/ui/extra/images/flags/BL-flag.png differ
diff --git a/ui/extra/images/flags/BR-flag.png b/ui/extra/images/flags/BR-flag.png
new file mode 100644
index 00000000000..8e44628dd4e
Binary files /dev/null and b/ui/extra/images/flags/BR-flag.png differ
diff --git a/ui/extra/images/flags/DE-flag.png b/ui/extra/images/flags/DE-flag.png
new file mode 100644
index 00000000000..69e8723f534
Binary files /dev/null and b/ui/extra/images/flags/DE-flag.png differ
diff --git a/ui/extra/images/flags/IN-flag.png b/ui/extra/images/flags/IN-flag.png
new file mode 100644
index 00000000000..108f3f7c9e1
Binary files /dev/null and b/ui/extra/images/flags/IN-flag.png differ
diff --git a/ui/extra/images/flags/IT-flag.png b/ui/extra/images/flags/IT-flag.png
new file mode 100644
index 00000000000..ae19e96b2a7
Binary files /dev/null and b/ui/extra/images/flags/IT-flag.png differ
diff --git a/ui/extra/images/flags/JP-flag.png b/ui/extra/images/flags/JP-flag.png
new file mode 100644
index 00000000000..b79f2333473
Binary files /dev/null and b/ui/extra/images/flags/JP-flag.png differ
diff --git a/ui/extra/images/flags/MX-flag.png b/ui/extra/images/flags/MX-flag.png
new file mode 100644
index 00000000000..1c2bd46fe44
Binary files /dev/null and b/ui/extra/images/flags/MX-flag.png differ
diff --git a/ui/extra/images/flags/PT-flag.png b/ui/extra/images/flags/PT-flag.png
new file mode 100644
index 00000000000..474b73de4b7
Binary files /dev/null and b/ui/extra/images/flags/PT-flag.png differ
diff --git a/ui/extra/images/flags/UK-flag.png b/ui/extra/images/flags/UK-flag.png
new file mode 100644
index 00000000000..426b866cdba
Binary files /dev/null and b/ui/extra/images/flags/UK-flag.png differ
diff --git a/ui/extra/images/flags/UR-flag.png b/ui/extra/images/flags/UR-flag.png
new file mode 100644
index 00000000000..a3d2795a325
Binary files /dev/null and b/ui/extra/images/flags/UR-flag.png differ
diff --git a/ui/extra/images/flags/USA-flag.png b/ui/extra/images/flags/USA-flag.png
new file mode 100644
index 00000000000..490f381bf65
Binary files /dev/null and b/ui/extra/images/flags/USA-flag.png differ
diff --git a/ui/src/components/settings/styles.scss b/ui/src/components/settings/styles.scss
index 1939209008b..83151b8fd95 100644
--- a/ui/src/components/settings/styles.scss
+++ b/ui/src/components/settings/styles.scss
@@ -122,7 +122,7 @@
align-content: center;
align-items: center;
padding: 0 var(--gap) 0 0;
-
+
.keybind-section-mask {
top: 0;
left: 0;
@@ -130,7 +130,7 @@
right: 0;
position: fixed;
z-index: 2;
- background-color: rgba(0,0,0, 0.75);
+ background-color: rgba(0, 0, 0, 0.75);
transition: background-color 0.3s ease;
}
@@ -158,7 +158,7 @@
stroke: none;
}
}
-
+
.keybind-section-keys {
cursor: pointer;
height: var(--height-input);
@@ -204,7 +204,6 @@
}
}
-
&.highlight {
.keybind-section-keys {
border: 2px solid var(--info);
@@ -237,30 +236,38 @@
}
.volume-indicator-wrap {
- width: 100%;
- height: var(--text-size-more);
+ width: 100%;
+ height: var(--text-size-more);
position: relative;
}
.volume-indicator-wrap {
- width: 100%;
- height: var(--text-size-more);
+ width: 100%;
+ height: var(--text-size-more);
position: relative;
}
.volume-indicator {
- position: absolute;
- width: 100%;
- height: 100%;
- border-radius: var(--border-radius);
- background: linear-gradient(90deg,
- #00b894 0% 75%,
- #feca57 75% 90%,
- #ba0c0c 90%);
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ border-radius: var(--border-radius);
+ background: linear-gradient(
+ 90deg,
+ #00b894 0% 75%,
+ #feca57 75% 90%,
+ #ba0c0c 90%
+ );
}
.volume-indicator-overlay {
right: 0;
border-radius: 0;
background: rgba(0, 0, 0, 0.5);
-}
\ No newline at end of file
+}
+
+.flags-settings img {
+ width: 30px;
+ height: 25px;
+ margin-right: 5px;
+}
diff --git a/ui/src/components/settings/sub_pages/about.rs b/ui/src/components/settings/sub_pages/about.rs
index ebe97b70271..c3d859fcdaf 100644
--- a/ui/src/components/settings/sub_pages/about.rs
+++ b/ui/src/components/settings/sub_pages/about.rs
@@ -1,5 +1,6 @@
use std::process::Command;
+use common::get_images_dir;
use common::language::get_local_text;
use common::state::{Action, ToastNotification};
use common::{icons::outline::Shape as Icon, state::State};
@@ -8,6 +9,8 @@ use dioxus_desktop::use_window;
use futures::StreamExt;
use kit::elements::{button::Button, Appearance};
+use tracing::log;
+
use crate::get_download_modal;
use crate::utils::auto_updater::{DownloadProgress, DownloadState, SoftwareDownloadCmd};
use crate::{
@@ -77,6 +80,28 @@ pub fn AboutPage(cx: Scope) -> Element {
let stage = download_state.read().stage;
let pending_key = format!("btn-pending{}", download_state.read().progress);
+ let image_path_flag_AU = get_flag_image_path("AU");
+ let image_path_flag_USA = get_flag_image_path("USA");
+ let image_path_flag_MX = get_flag_image_path("MX");
+ let image_path_flag_DE = get_flag_image_path("DE");
+ let image_path_flag_PT = get_flag_image_path("PT");
+ let image_path_flag_BR = get_flag_image_path("BR");
+ let image_path_flag_IT = get_flag_image_path("IT");
+ let image_path_flag_UR = get_flag_image_path("UR");
+ let image_path_flag_BL = get_flag_image_path("BL");
+ let image_path_flag_JP = get_flag_image_path("JP");
+ let image_path_flag_IN = get_flag_image_path("IN");
+
+ fn get_flag_image_path(flag: &str) -> String {
+ get_images_dir()
+ .unwrap_or_default()
+ .join("flags")
+ .join(format!("{}-flag.png", flag))
+ .to_str()
+ .map(|x| x.to_string())
+ .unwrap_or_default()
+ }
+
let about_button = cx.render(rsx!(match opt {
None if stage == DownloadProgress::Idle => {
rsx!(Button {
@@ -227,8 +252,51 @@ pub fn AboutPage(cx: Scope) -> Element {
section_label: get_local_text("settings-about.made-in"),
section_description: get_local_text("settings-about.team"),
div {
- class: "flags",
- "🇺🇸🇲🇽🇩🇪🇵🇹🇧🇷🇮🇹🇺🇦🇧🇾🇯🇵🇦🇺🇮🇩"
+ class: "flags-settings",
+ img {
+ src: "{image_path_flag_USA}",
+ alt: "USA Flag",
+ },
+ img {
+ src: "{image_path_flag_MX}",
+ alt: "Mexico Flag",
+ }
+ img {
+ src: "{image_path_flag_DE}",
+ alt: "Germany Flag",
+ }
+ img {
+ src: "{image_path_flag_PT}",
+ alt: "Portugal Flag",
+ }
+ img {
+ src: "{image_path_flag_BR}",
+ alt: "Brazil Flag",
+ }
+ img {
+ src: "{image_path_flag_IT}",
+ alt: "Italy Flag",
+ }
+ img {
+ src: "{image_path_flag_UR}",
+ alt: "Ukraine Flag",
+ }
+ img {
+ src: "{image_path_flag_BL}",
+ alt: "Belarus Flag",
+ }
+ img {
+ src: "{image_path_flag_JP}",
+ alt: "Japan Flag",
+ }
+ img {
+ src: "{image_path_flag_AU}",
+ alt: "Australia Flag",
+ }
+ img {
+ src: "{image_path_flag_IN}",
+ alt: "Indonesia Flag",
+ }
}
}
}
diff --git a/ui/wix/main.wxs b/ui/wix/main.wxs
index ed94d789669..48df63c5451 100644
--- a/ui/wix/main.wxs
+++ b/ui/wix/main.wxs
@@ -114,6 +114,45 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -186,6 +225,18 @@
+
+
+
+
+
+
+
+
+
+
+
+