fix: titlebar on windows
This commit is contained in:
@@ -26,6 +26,7 @@
|
|||||||
"core:window:allow-set-size",
|
"core:window:allow-set-size",
|
||||||
"core:window:allow-set-focus",
|
"core:window:allow-set-focus",
|
||||||
"core:window:allow-start-dragging",
|
"core:window:allow-start-dragging",
|
||||||
|
"core:window:allow-toggle-maximize",
|
||||||
"decorum:allow-show-snap-overlay",
|
"decorum:allow-show-snap-overlay",
|
||||||
"prevent-default:default",
|
"prevent-default:default",
|
||||||
"updater:default",
|
"updater:default",
|
||||||
|
|||||||
@@ -73,10 +73,6 @@ fn main() {
|
|||||||
let handle = app.handle();
|
let handle = app.handle();
|
||||||
let main_window = app.get_webview_window("main").unwrap();
|
let main_window = app.get_webview_window("main").unwrap();
|
||||||
|
|
||||||
// Open devtools
|
|
||||||
#[cfg(debug_assertions)]
|
|
||||||
main_window.open_devtools();
|
|
||||||
|
|
||||||
// Set custom decoration
|
// Set custom decoration
|
||||||
#[cfg(target_os = "windows")]
|
#[cfg(target_os = "windows")]
|
||||||
main_window.create_overlay_titlebar().unwrap();
|
main_window.create_overlay_titlebar().unwrap();
|
||||||
@@ -85,7 +81,7 @@ fn main() {
|
|||||||
#[cfg(target_os = "macos")]
|
#[cfg(target_os = "macos")]
|
||||||
main_window.set_traffic_lights_inset(12.0, 18.0).unwrap();
|
main_window.set_traffic_lights_inset(12.0, 18.0).unwrap();
|
||||||
|
|
||||||
// Workaround for reset traffic light when window resized
|
// Workaround for reset traffic light when theme changed
|
||||||
#[cfg(target_os = "macos")]
|
#[cfg(target_os = "macos")]
|
||||||
let win_ = main_window.clone();
|
let win_ = main_window.clone();
|
||||||
#[cfg(target_os = "macos")]
|
#[cfg(target_os = "macos")]
|
||||||
@@ -165,9 +161,8 @@ fn main() {
|
|||||||
|
|
||||||
Ok(())
|
Ok(())
|
||||||
})
|
})
|
||||||
.enable_macos_default_menu(false)
|
.plugin(prevent_default())
|
||||||
.plugin(tauri_plugin_fs::init())
|
.plugin(tauri_plugin_fs::init())
|
||||||
.plugin(tauri_plugin_prevent_default::init())
|
|
||||||
.plugin(tauri_plugin_process::init())
|
.plugin(tauri_plugin_process::init())
|
||||||
.plugin(tauri_plugin_updater::Builder::new().build())
|
.plugin(tauri_plugin_updater::Builder::new().build())
|
||||||
.plugin(tauri_plugin_os::init())
|
.plugin(tauri_plugin_os::init())
|
||||||
@@ -179,3 +174,17 @@ fn main() {
|
|||||||
.run(tauri::generate_context!())
|
.run(tauri::generate_context!())
|
||||||
.expect("error while running tauri application");
|
.expect("error while running tauri application");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[cfg(debug_assertions)]
|
||||||
|
fn prevent_default() -> tauri::plugin::TauriPlugin<tauri::Wry> {
|
||||||
|
use tauri_plugin_prevent_default::Flags;
|
||||||
|
|
||||||
|
tauri_plugin_prevent_default::Builder::new()
|
||||||
|
.with_flags(Flags::all().difference(Flags::CONTEXT_MENU))
|
||||||
|
.build()
|
||||||
|
}
|
||||||
|
|
||||||
|
#[cfg(not(debug_assertions))]
|
||||||
|
fn prevent_default() -> tauri::plugin::TauriPlugin<tauri::Wry> {
|
||||||
|
tauri_plugin_prevent_default::Builder::new().build()
|
||||||
|
}
|
||||||
|
|||||||
132
src/global.css
132
src/global.css
@@ -3,98 +3,106 @@
|
|||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
@layer utilities {
|
@layer utilities {
|
||||||
.break-message {
|
.break-message {
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@apply cursor-default no-underline !important;
|
@apply cursor-default no-underline !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
@apply cursor-default focus:outline-none;
|
@apply cursor-default focus:outline-none;
|
||||||
}
|
}
|
||||||
|
|
||||||
input::-ms-reveal,
|
input::-ms-reveal,
|
||||||
input::-ms-clear {
|
input::-ms-clear {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-input-placeholder {
|
::-webkit-input-placeholder {
|
||||||
line-height: normal;
|
line-height: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
div[data-tauri-decorum-tb] {
|
||||||
|
@apply h-12 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.decorum-tb-btn {
|
||||||
|
@apply h-12 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner-leaf {
|
.spinner-leaf {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: calc(50% - 12.5% / 2);
|
left: calc(50% - 12.5% / 2);
|
||||||
width: 12.5%;
|
width: 12.5%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
animation: spinner-leaf-fade 800ms linear infinite;
|
animation: spinner-leaf-fade 800ms linear infinite;
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "";
|
content: "";
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 30%;
|
height: 30%;
|
||||||
background-color: currentColor;
|
background-color: currentColor;
|
||||||
@apply rounded;
|
@apply rounded;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(1)) {
|
&:where(:nth-child(1)) {
|
||||||
transform: rotate(0deg);
|
transform: rotate(0deg);
|
||||||
animation-delay: -800ms;
|
animation-delay: -800ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(2)) {
|
&:where(:nth-child(2)) {
|
||||||
transform: rotate(45deg);
|
transform: rotate(45deg);
|
||||||
animation-delay: -700ms;
|
animation-delay: -700ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(3)) {
|
&:where(:nth-child(3)) {
|
||||||
transform: rotate(90deg);
|
transform: rotate(90deg);
|
||||||
animation-delay: -600ms;
|
animation-delay: -600ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(4)) {
|
&:where(:nth-child(4)) {
|
||||||
transform: rotate(135deg);
|
transform: rotate(135deg);
|
||||||
animation-delay: -500ms;
|
animation-delay: -500ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(5)) {
|
&:where(:nth-child(5)) {
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
animation-delay: -400ms;
|
animation-delay: -400ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(6)) {
|
&:where(:nth-child(6)) {
|
||||||
transform: rotate(225deg);
|
transform: rotate(225deg);
|
||||||
animation-delay: -300ms;
|
animation-delay: -300ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(7)) {
|
&:where(:nth-child(7)) {
|
||||||
transform: rotate(270deg);
|
transform: rotate(270deg);
|
||||||
animation-delay: -200ms;
|
animation-delay: -200ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:where(:nth-child(8)) {
|
&:where(:nth-child(8)) {
|
||||||
transform: rotate(315deg);
|
transform: rotate(315deg);
|
||||||
animation-delay: -100ms;
|
animation-delay: -100ms;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes spinner-leaf-fade {
|
@keyframes spinner-leaf-fade {
|
||||||
from {
|
from {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
opacity: 0.25;
|
opacity: 0.25;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -46,13 +46,17 @@ function Screen() {
|
|||||||
|
|
||||||
function Header() {
|
function Header() {
|
||||||
const { account, id } = Route.useParams();
|
const { account, id } = Route.useParams();
|
||||||
|
const { platform } = Route.useRouteContext();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
data-tauri-drag-region
|
data-tauri-drag-region
|
||||||
className="h-12 shrink-0 flex items-center justify-between px-3.5 border-b border-neutral-100 dark:border-neutral-800"
|
className={cn(
|
||||||
|
"h-12 shrink-0 flex items-center justify-between border-b border-neutral-100 dark:border-neutral-800",
|
||||||
|
platform === "windows" ? "pl-3.5 pr-[150px]" : "px-3.5"
|
||||||
|
)}
|
||||||
>
|
>
|
||||||
<div>
|
<div className="z-[200]">
|
||||||
<div className="flex -space-x-1 overflow-hidden">
|
<div className="flex -space-x-1 overflow-hidden">
|
||||||
<User.Provider pubkey={account}>
|
<User.Provider pubkey={account}>
|
||||||
<User.Root className="size-8 rounded-full inline-block ring-2 ring-white dark:ring-neutral-900">
|
<User.Root className="size-8 rounded-full inline-block ring-2 ring-white dark:ring-neutral-900">
|
||||||
|
|||||||
@@ -57,7 +57,7 @@ function Header() {
|
|||||||
<div
|
<div
|
||||||
data-tauri-drag-region
|
data-tauri-drag-region
|
||||||
className={cn(
|
className={cn(
|
||||||
"shrink-0 h-12 flex items-center justify-between",
|
"z-[200] shrink-0 h-12 flex items-center justify-between",
|
||||||
platform === "macos" ? "pl-[78px] pr-3.5" : "px-3.5",
|
platform === "macos" ? "pl-[78px] pr-3.5" : "px-3.5",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -59,7 +59,7 @@ function Screen() {
|
|||||||
|
|
||||||
if (res.status === "ok") {
|
if (res.status === "ok") {
|
||||||
navigate({
|
navigate({
|
||||||
to: "/$account/chats",
|
to: "/$account/chats/new",
|
||||||
params: { account: res.data },
|
params: { account: res.data },
|
||||||
replace: true,
|
replace: true,
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user