split improvements and bugfixes

Author: todti

packages/web-awesome/src/components/ArrowButton/styles.scss

@@ -17,7 +17,7 @@
 }
 
 .arrow-button-m {
-  padding: 6px 6px;
+  padding: 4px 6px;
 }
 
 .icon-size-m {

packages/web-awesome/src/components/TestResult/TestResultHeader/styles.scss

@@ -17,7 +17,6 @@
 .test-result-breadcrumb {
   display: flex;
   gap: 4px;
-  align-items: center;
   color: var(--on-text-secondary);
   white-space: nowrap;
   text-overflow: ellipsis;

packages/web-awesome/src/components/TestResult/TestResultSteps/styles.scss

@@ -41,7 +41,7 @@
 
 .test-result-step-header {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 4px;
   transition: background-color 300ms;
   cursor: pointer;

packages/web-awesome/src/components/Tree/TreeItem.tsx

@@ -1,5 +1,5 @@
 import { type TestStatus, formatDuration } from "@allurereport/core-api";
-import { Text } from "@allurereport/web-components";
+import { Code, Text } from "@allurereport/web-components";
 import clsx from "clsx";
 import type { FunctionComponent } from "preact";
 import TreeItemIcon from "@/components/Tree/TreeItemIcon";
@@ -34,9 +34,9 @@ export const TreeItem: FunctionComponent<TreeItemProps> = ({
       id={id}
     >
       <TreeItemIcon status={status} />
-      <span data-testid="tree-leaf-order" class={styles.order}>
+      <Code data-testid="tree-leaf-order" size={"s"} className={styles.order}>
         {groupOrder}
-      </span>
+      </Code>
       <Text data-testid="tree-leaf-title" className={styles["item-title"]}>
         {name}
       </Text>

packages/web-awesome/src/components/Tree/styles.scss

@@ -178,7 +178,7 @@
   box-sizing: content-box;
   padding-top: 2px;
   line-height: 16px;
-  width: 24px;
+  //width: 24px;
 }
 
 .tree-item-marked {