Improve page icon styling

Author: timolins

src/components/page-icon.tsx

@@ -51,6 +51,7 @@ const PageIcon: React.FC<AssetProps> = ({
       <span
         className={classNames(
           className,
+          "notion-emoji",
           big ? "notion-page-icon-cover" : "notion-page-icon"
         )}
         role="img"

src/styles.css

@@ -180,6 +180,10 @@
   font-size: 1.25em;
   margin-top: 1em;
 }
+.notion-emoji {
+  font-family: "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji",
+    "Segoe UI Symbol";
+}
 .notion-page-cover {
   display: block;
   object-fit: cover;
@@ -279,7 +283,7 @@ img.notion-page-icon-offset {
 .notion-page-icon {
   font-size: 1.1em;
   margin-right: 4px;
-  margin-top: 2px;
+  margin-top: 1px;
   margin-left: 2px;
 }
 img.notion-page-icon {