apply animation to pagetree triangle button

packages/app/src/components/Sidebar/PageTree/Item.tsx

@@ -177,7 +177,7 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
   const opacityStyle = { opacity: 1.0 };
   if (page.isTarget) opacityStyle.opacity = 0.7;
 
-  const buttonClass = isOpen ? 'rotate' : 'hoge';
+  const buttonClass = isOpen ? 'grw-pagetree-open' : 'grw-pagetree-close';
 
   return (
     <div className="grw-pagetree-item-wrapper">

packages/app/src/styles/_page-tree.scss

@@ -19,13 +19,12 @@
 
     .grw-pagetree-button {
       background-color: transparent;
+      transition: 0.5s;
 
-      &.rotate {
-        transition: 0.5s;
+      &.grw-pagetree-open {
         transform: rotate(90deg);
       }
-      &.hoge {
-        transition: 0.5s;
+      &.grw-pagetree-close {
         transform: rotate(0deg);
       }
     }