src/components/ui/Category.tsx

@@ -44,7 +44,7 @@ type Props = Omit<
 };
 
 export default function Category(props: Props) {
-    let { text, action, ...otherProps } = props;
+    const { text, action, ...otherProps } = props;
 
     return (
         <CategoryBase {...otherProps}>

src/components/ui/Checkbox.tsx

@@ -4,12 +4,12 @@ import styled, { css } from "styled-components";
 import { Children } from "../../types/Preact";
 
 const CheckboxBase = styled.label`
-    margin-top: 20px;
     gap: 4px;
     z-index: 1;
     display: flex;
-    border-radius: 4px;
+    margin-top: 20px;
     align-items: center;
+    border-radius: var(--border-radius);
 
     cursor: pointer;
     font-size: 18px;
@@ -57,9 +57,9 @@ const Checkmark = styled.div<{ checked: boolean }>`
     height: 24px;
     display: grid;
     flex-shrink: 0;
-    border-radius: 4px;
     place-items: center;
     transition: 0.2s ease all;
+    border-radius: var(--border-radius);
     background: var(--secondary-background);
 
     svg {

src/components/ui/ComboBox.tsx

 import styled from "styled-components";
 
 export default styled.select`
+    width: 100%;
     padding: 10px;
-    border-radius: 6px;
+    cursor: pointer;
+    border-radius: var(--border-radius);
+
     font-family: inherit;
+    font-size: var(--text-size);
     color: var(--secondary-foreground);
     background: var(--secondary-background);
-    font-size: var(--text-size);
+
     border: none;
     outline: 2px solid transparent;
-    transition: outline-color 0.2s ease-in-out;
     transition: box-shadow 0.2s ease-in-out;
-    cursor: pointer;
-    width: 100%;
+    transition: outline-color 0.2s ease-in-out;
 
     &:focus {
         box-shadow: 0 0 0 1.5pt var(--accent);

src/components/ui/DateDivider.tsx

@@ -12,8 +12,8 @@ const Base = styled.div<{ unread?: boolean }>`
 
     time {
         margin-top: -2px;
-        font-size: .6875rem;
-        line-height: .6875rem;
+        font-size: 0.6875rem;
+        line-height: 0.6875rem;
         padding: 2px 0 2px 0;
         padding-inline-end: 5px;
         color: var(--tertiary-foreground);