diff --git a/packages/theme/styles/components.scss b/packages/theme/styles/components.scss
index 0256035704..58404c1bcd 100644
--- a/packages/theme/styles/components.scss
+++ b/packages/theme/styles/components.scss
@@ -509,6 +509,7 @@
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
+  gap: var(--spacing-1);
   margin: 0;
   padding: var(--spacing-1) var(--spacing-1_5) var(--spacing-1) var(--spacing-0_75);
   width: 100%;
@@ -520,7 +521,7 @@
   outline: none;
   
   &.small {
-    max-height: var(--global-medium-Size);
+    max-height: var(--global-max-Size);
   }
 
   .hulyToDoLine-dragbox,
diff --git a/packages/ui/src/components/AccordionItem.svelte b/packages/ui/src/components/AccordionItem.svelte
index afacb8af5b..e76e1a595c 100644
--- a/packages/ui/src/components/AccordionItem.svelte
+++ b/packages/ui/src/components/AccordionItem.svelte
@@ -25,6 +25,7 @@
   export let icon: Asset | AnySvelteComponent | ComponentType | undefined = undefined
   export let iconProps: any | undefined = undefined
   export let size: 'small' | 'medium' | 'large'
+  export let kind: 'default' | 'second' = 'default'
   export let nested: boolean = false
   export let isOpen: boolean = false
   export let selected: boolean = false
@@ -35,9 +36,9 @@
   export let background: string | undefined = undefined
 </script>
 
-<div class="hulyAccordionItem-container default" class:nested>
+<div class="hulyAccordionItem-container {kind}" class:nested>
   <button
-    class="hulyAccordionItem-header default {size}"
+    class="hulyAccordionItem-header {kind} {size}"
     class:bottomSpace
     class:nested
     class:isOpen
diff --git a/plugins/tags-resources/src/components/TagReferencePresenter.svelte b/plugins/tags-resources/src/components/TagReferencePresenter.svelte
index 5a26e9c52a..36715fd567 100644
--- a/plugins/tags-resources/src/components/TagReferencePresenter.svelte
+++ b/plugins/tags-resources/src/components/TagReferencePresenter.svelte
@@ -80,6 +80,7 @@
 <style lang="scss">
   .todoLabel-container {
     padding: var(--spacing-0_25) var(--spacing-0_5);
+    color: var(--global-on-accent-TextColor);
     border-radius: var(--extra-small-BorderRadius);
   }
   .listitems-container {
diff --git a/plugins/tags-resources/src/components/TagsReferencePresenter.svelte b/plugins/tags-resources/src/components/TagsReferencePresenter.svelte
index d280df3db6..5caa54782b 100644
--- a/plugins/tags-resources/src/components/TagsReferencePresenter.svelte
+++ b/plugins/tags-resources/src/components/TagsReferencePresenter.svelte
@@ -45,7 +45,7 @@
       </span>
     </div>
   {:else if kind === 'todo'}
-    <div class="todoLabel-container font-medium-12 overflow-label max-w-40" style:background-color={colors[0].color}>
+    <div class="todoLabel-container font-medium-12 max-w-40" style:background-color={colors[0].color}>
       <Label label={plugin.string.NumberLabels} params={{ count: items.length }} />
     </div>
   {/if}
@@ -54,6 +54,7 @@
 <style lang="scss">
   .todoLabel-container {
     padding: var(--spacing-0_25) var(--spacing-0_5);
+    color: var(--global-on-accent-TextColor);
     border-radius: var(--extra-small-BorderRadius);
   }
   .listitems-container {