Fix: fix sidebar marker for webkit

pkgs/webview-ui/app/src/components/Sidebar/index.tsx

@@ -19,20 +19,22 @@ export const SidebarSection = (props: {
 
   return (
     <details class="sidebar__section accordeon" open>
-      <summary class="accordeon__header">
+      <summary style="display: contents;">
-        <Typography
+        <div class="accordeon__header">
-          class="inline-flex w-full gap-2 uppercase !tracking-wider"
+          <Typography
-          tag="p"
+            class="inline-flex w-full gap-2 uppercase !tracking-wider"
-          hierarchy="body"
+            tag="p"
-          size="xxs"
+            hierarchy="body"
-          weight="normal"
+            size="xxs"
-          color="tertiary"
+            weight="normal"
-          inverted={true}
+            color="tertiary"
-        >
+            inverted={true}
-          <Icon class="opacity-90" icon={props.icon} size={13} />
+          >
-          {title}
+            <Icon class="opacity-90" icon={props.icon} size={13} />
-          <Icon icon="CaretDown" class="ml-auto" size={10} />
+            {title}
-        </Typography>
+            <Icon icon="CaretDown" class="ml-auto" size={10} />
+          </Typography>
+        </div>
       </summary>
       <div class="accordeon__body">{children}</div>
     </details>

pkgs/webview-ui/app/src/index.css

@@ -11,11 +11,13 @@
   font-weight: 400;
   src: url(../.fonts/ArchivoSemiCondensed-Regular.woff2) format("woff2");
 }
+
 @font-face {
   font-family: "Archivo";
   font-weight: 500;
   src: url(../.fonts/ArchivoSemiCondensed-Medium.woff2) format("woff2");
 }
+
 @font-face {
   font-family: "Archivo";
   font-weight: 600;
@@ -73,10 +75,14 @@ html {
   overflow-x: hidden;
   overflow-y: hidden;
 
-  -webkit-user-select: none; /* Safari */
+  -webkit-user-select: none;
-  -moz-user-select: none; /* Firefox */
+  /* Safari */
-  -ms-user-select: none; /* Internet Explorer/Edge */
+  -moz-user-select: none;
-  user-select: none; /* Standard */
+  /* Firefox */
+  -ms-user-select: none;
+  /* Internet Explorer/Edge */
+  user-select: none;
+  /* Standard */
 }
 
 .accordeon {

pkgs/webview-ui/app/src/layout/header.tsx

@@ -9,7 +9,7 @@ interface HeaderProps {
 }
 export const Header = (props: HeaderProps) => {
   return (
-    <div class="sticky top-0 z-20 border-b bg-white/80 px-6 py-4 backdrop-blur-md border-def-3">
+    <div class="sticky top-0 z-20 flex items-center border-b bg-white/80 px-6 py-4 backdrop-blur-md border-def-3">
       <div class="flex-none">
         {props.showBack && <BackButton />}
         <span class=" lg:hidden" data-tip="Menu">