feat: Add Cascadia font (#465)

* adding cascadia font

* adding font file

public/index.html

@@ -55,6 +55,13 @@
       type="font/ttf"
       crossorigin="anonymous"
     />
+    <link
+      rel="preload"
+      href="https://uploads.codesandbox.io/uploads/user/5f5b1ecd-ac15-4c7f-803e-e11ff53ea4ce/z1tp-Cascadia.ttf"
+      as="font"
+      type="font/ttf"
+      crossorigin="anonymous"
+    />
 
     <script
       async

src/actions/actionProperties.tsx

@@ -248,7 +248,7 @@ export const actionChangeFontFamily: Action = {
         options={[
           { value: "Virgil", text: "Hand-drawn" },
           { value: "Helvetica", text: "Normal" },
-          { value: "Courier", text: "Code" }
+          { value: "Cascadia", text: "Code" }
         ]}
         value={getSelectedAttribute(
           elements,

src/styles.scss

@@ -7,6 +7,13 @@
   font-display: swap;
 }
 
+/* https://github.com/microsoft/cascadia-code */
+@font-face {
+  font-family: "Cascadia";
+  src: url("https://uploads.codesandbox.io/uploads/user/5f5b1ecd-ac15-4c7f-803e-e11ff53ea4ce/z1tp-Cascadia.ttf");
+  font-display: swap;
+}
+
 body {
   margin: 0;
   font-family: Arial, Helvetica, sans-serif;