diff --git a/src/components/native/Titlebar.tsx b/src/components/native/Titlebar.tsx index c3677c53..96c9cf83 100644 --- a/src/components/native/Titlebar.tsx +++ b/src/components/native/Titlebar.tsx @@ -1,4 +1,4 @@ -import { Wrench } from "@styled-icons/boxicons-solid"; +import { Wrench, Microphone, VolumeFull } from "@styled-icons/boxicons-solid"; import styled from "styled-components"; import Tooltip from "../common/Tooltip"; @@ -10,16 +10,37 @@ const TitlebarBase = styled.div` gap: 6px; user-select: none; align-items: center; - - .title { + .drag { flex-grow: 1; -webkit-app-region: drag; - height: var(--titlebar-height); + margin-top: 10px; + height: 100%; + } + + .quick { + color: var(--secondary-foreground); + + > div, > div > div { + width: var(--titlebar-height) !important; + } + + &.disabled { + color: var(--error); + } + + &.unavailable { + background: var(--error); + } + } + + .title { + -webkit-app-region: drag; + /*height: var(--titlebar-height);*/ font-size: 16px; font-weight: 600; margin-inline-start: 10px; - margin-top: 4px; + margin-top: 10px; gap: 6px; display: flex; align-items: center; @@ -28,7 +49,7 @@ const TitlebarBase = styled.div` color: var(--titlebar-logo-color); svg { - margin-bottom: 4px; + margin-bottom: 10px; } svg:first-child { @@ -80,6 +101,23 @@ export function Titlebar() { {window.native.getConfig().build === "dev" && } + {/*
+ +
+ +
+
+ +
+ +
+
+
*/} +