support/149584-180129-icon-edit

apps/app/src/client/components/Sidebar/PageCreateButton/CreateButton.module.scss

@@ -19,6 +19,12 @@
   :global(svg .background) {
     pointer-events: fill;
   }
+
+  :global(.hexagon-main),
+  :global(.pencil-icon) {
+    transition: transform 0.2s ease-in-out;
+    transform-origin: 22.5px 22px;
+  }
 }
 
 // == Colors
@@ -35,11 +41,13 @@
 .btn-create:hover {
   :global(svg) {
     fill: var(--bs-btn-hover-bg);
+    transform: scale(1.1);
   }
 }
 
 .btn-create:active {
   :global(svg) {
     fill: var(--bs-btn-active-bg);
+    transform: scale(1.1);
   }
 }

apps/app/src/client/components/Sidebar/PageCreateButton/DropendToggle.module.scss

@@ -4,7 +4,7 @@
 .btn-toggle {
   @extend %btn-basis;
 
-  left: 12px;
+  left: 14px;
   padding: 0;
 
   :global(.icon) {
@@ -18,6 +18,7 @@
 // no caret
 .btn-toggle {
   & {
+
     // no caret
     &::after {
       display: none !important;

apps/app/src/client/components/Sidebar/PageCreateButton/Hexagon.tsx

@@ -15,7 +15,7 @@ export const Hexagon = React.memo(
       <title>Create</title>
       <g className="background" transform="translate(0 0)">
         <path
-          d="M20.768,0l6.923,12L20.768,24H6.923L0,12,6.923,0Z"
+          d="M19.768,0.5 L25.691,10.5 A3,3 0 0,1 25.691,13.5 L19.768,23.5 A2,2 0 0,1 17.768,24 L7.923,24 A2,2 0 0,1 5.923,23.5 L0,13.5 A3,3 0 0,1 0,10.5 L5.923,0.5 A2,2 0 0,1 7.923,0 L17.768,0 A2,2 0 0,1 19.768,0.5 Z"
           transform="translate(0)"
         ></path>
       </g>

growi-cloud-next

@@ -0,0 +1 @@
+Subproject commit 1ea7e9970191f0d13b712fa766167821eb80a6fb