Cleanup

package.json

@@ -8,10 +8,7 @@
     "build": "sapper build",
     "export": "sapper export",
     "start": "node __sapper__/build",
-    "cy:run": "cypress run",
-    "cy:open": "cypress open",
-    "test": "run-p --race dev cy:run",
-    "format": "prettier --write {src,static,cypress}/**/*.{js,svelte,css}"
+    "format": "prettier --write {src,static}/**/*.{js,svelte,css}"
   },
   "dependencies": {
     "compression": "^1.7.1",

src/components/home-ad.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { ADS } from '../routes/_ads.js'
+  import { ADS } from "../routes/_ads.js";
 
-  export let ad = ADS[Math.floor(Math.random() * ADS.length)]
+  export let ad = ADS[Math.floor(Math.random() * ADS.length)];
 </script>
 
 <style>

src/components/recipe-summary.svelte

@@ -78,7 +78,8 @@
     <p class="Description">{recipe.description}</p>
     <footer class="Facts">
       {calories} cal / {toGrams(carbs)} carbs / {toGrams(fat)} fat / {toGrams(protein)}
-      protein / <b>{toGrams(fiber)} fiber</b>
+      protein /
+      <b>{toGrams(fiber)} fiber</b>
     </footer>
   </div>
 </a>

src/components/recipe.svelte

@@ -79,15 +79,15 @@
     white-space: nowrap;
   }
 
-   input {
-     background: rgba(0, 0, 0, 0.43);
-     border-radius: 3px;
-     border: 0;
-     box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
-     color: white;
-     max-width: 100%;
-     padding: 4px 7px;
-     width: 100%;
+  input {
+    background: rgba(0, 0, 0, 0.43);
+    border-radius: 3px;
+    border: 0;
+    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
+    color: white;
+    max-width: 100%;
+    padding: 4px 7px;
+    width: 100%;
   }
 </style>
 
@@ -127,17 +127,11 @@
       <td>Servings (split)</td>
       <td class="nowrap">
         <label>
-          <input
-            type="number"
-            step="0.5"
-            min="0.5"
-            bind:value={servings} />
+          <input type="number" step="0.5" min="0.5" bind:value={servings} />
           <span class="visuallyhidden">Change serving size</span>
         </label>
       </td>
-      <td class="Number">
-        {toGrams(servingGrams)}
-      </td>
+      <td class="Number">{toGrams(servingGrams)}</td>
       <td class="Number">{toFixed(servingsCalories)}</td>
       <td class="Number">{toGrams(servingsCarbs)}</td>
       <td class="Number">{toGrams(servingsFat)}</td>

src/routes/_ads.js

@@ -12,7 +12,8 @@ export const ADS = [
     title: "Pup of Joe"
   },
   {
-    alt: "Barkley and Wags - does your human owe you treats and walkies? Call the law offices of Barkley and Wags.",
+    alt:
+      "Barkley and Wags - does your human owe you treats and walkies? Call the law offices of Barkley and Wags.",
     slug: "barkley-and-wags",
     src: "/ads/barkley-and-wags.jpg",
     title: "Barkey and Wags"
@@ -24,7 +25,8 @@ export const ADS = [
     title: "Scraps Sharks"
   },
   {
-    alt: "Guard puppy - protecs from murderers, out of place objects on the sidewalk, other doggies, and interactions with other humans in public.",
+    alt:
+      "Guard puppy - protecs from murderers, out of place objects on the sidewalk, other doggies, and interactions with other humans in public.",
     slug: "guard-puppy",
     src: "/ads/guard-puppy.jpg",
     title: "Guard Puppy"

src/routes/ads/[slug].svelte

@@ -2,25 +2,25 @@
   import { ADS } from "../_ads.js";
 
   export async function preload({ params, query }) {
-    const ad = ADS.find(ad => ad.slug == params.slug) || ADS[0]
+    const ad = ADS.find(ad => ad.slug == params.slug) || ADS[0];
 
-    return { ad }
+    return { ad };
   }
 </script>
 
 <script>
-  import { onMount } from 'svelte'
-  import HomeAd from '../../components/home-ad.svelte';
+  import { onMount } from "svelte";
+  import HomeAd from "../../components/home-ad.svelte";
 
   export let ad;
 
-  const prod = process.env.NODE_ENV !== 'development'
+  const prod = process.env.NODE_ENV !== "development";
 
   onMount(() => {
     if (prod) {
-      fetch("https://fibercandy.cool/.netlify/functions/ad-tracker")
+      fetch("https://fibercandy.cool/.netlify/functions/ad-tracker");
     }
-  })
+  });
 </script>
 
 <style>
@@ -54,19 +54,21 @@
 
 <section>
   <div class="Content">
-    <HomeAd ad={ad} />
+    <HomeAd {ad} />
 
     <h1>Just kidding!</h1>
 
     <p>
-      This ad is fake. <b>{ad.title}</b> isn't real (as far as we
-      know), but we've still added $0.04 to the Sage Cheese Fund.
+      This ad is fake.
+      <b>{ad.title}</b>
+      isn't real (as far as we know), but we've still added $0.04 to the Sage
+      Cheese Fund.
     </p>
 
     <p>
-      4 whole cents! That's like... insane ad revenue if we weren't
-      paying for it ourselves. We're going to go broke while our dog
-      guzzles down gruyere.
+      4 whole cents! That's like... insane ad revenue. It's a shame we're paying
+      for it ourselves. We're going to go broke while our dog guzzles down
+      gruyere.
     </p>
 
     <p>Sage thanks you for your generous gift.</p>

src/routes/recipes/green-juice.svelte

@@ -1,7 +1,7 @@
 <script>
   import { RECIPES } from "../_recipes.js";
   import Recipe from "../../components/recipe.svelte";
-  import HomeAd from '../../components/home-ad.svelte'
+  import HomeAd from "../../components/home-ad.svelte";
 
   const recipe = RECIPES.find(recipe => recipe.slug === "green-juice");
   const ingredients = recipe ? recipe.ingredients : [];
@@ -57,20 +57,34 @@
   </div>
 
   <div class="Content">
-    <p>We originally found this recipe over at <a href="https://greenkitchenstories.com/drink-your-greens-yellows-reds/">Green Kitchen Stories</a>. Over the years we've made a few modifications, and lean hard into the chunkiness of this recipe.</p>
+    <p>
+      We originally found this recipe over at
+      <a href="https://greenkitchenstories.com/drink-your-greens-yellows-reds/">
+        Green Kitchen Stories
+      </a>
+      . Over the years we've made a few modifications, and lean hard into the
+      chunkiness of this recipe.
+    </p>
     <p>Be ready to drink pulp. Lots of it.</p>
 
     <HomeAd />
 
-    <p>
-      Basically chop everything, but here are some useful tips:
-    </p>
+    <p>Basically chop everything, but here are some useful tips:</p>
 
     <ul>
-      <li>First thing, pour in the almond milk and chia seeds so that they can soak while you chop other ingredients.</li>
-      <li>We like to keep frozen bananas on hand. We just have a bunch in the freezer. It only needs to thaw about 5 minutes.</li>
+      <li>
+        First thing, pour in the almond milk and chia seeds so that they can
+        soak while you chop other ingredients.
+      </li>
+      <li>
+        We like to keep frozen bananas on hand. We just have a bunch in the
+        freezer. It only needs to thaw about 5 minutes.
+      </li>
       <li>Refridgerate for about 10 minutes after making.</li>
-      <li>If we can't find a kiwi, we also make this juice with Mangos. Just substitute 2 kiwis for 1 mango.</li>
+      <li>
+        If we can't find a kiwi, we also make this juice with Mangos. Just
+        substitute 2 kiwis for 1 mango.
+      </li>
     </ul>
   </div>
 </section>

src/routes/recipes/popcorn.svelte

@@ -1,7 +1,7 @@
 <script>
   import { RECIPES } from "../_recipes.js";
   import Recipe from "../../components/recipe.svelte";
-  import HomeAd from '../../components/home-ad.svelte'
+  import HomeAd from "../../components/home-ad.svelte";
 
   const recipe = RECIPES.find(recipe => recipe.slug === "popcorn");
   const ingredients = recipe ? recipe.ingredients : [];
@@ -44,7 +44,10 @@
 <section>
   <div class="Content">
     <h1>{recipe.title}</h1>
-    <p>This popcorn recipe is probably killing us, but we just can't stop. So much butter. So much salt. So much cumin.</p>
+    <p>
+      This popcorn recipe is probably killing us, but we just can't stop. So
+      much butter. So much salt. So much cumin.
+    </p>
     <p>Don't stop us now.</p>
   </div>
 
@@ -53,24 +56,38 @@
   </div>
 
   <div class="Content">
-    <p>
-      We don't follow the amounts perfectly. You kind of have to feel it.
-    </p>
+    <p>We don't follow the amounts perfectly. You kind of have to feel it.</p>
 
     <HomeAd />
 
-    <p>This is generally pretty easy to make, but we have some tips for the popcorn:</p>
+    <p>
+      This is generally pretty easy to make, but we have some tips for the
+      popcorn:
+    </p>
 
     <ol>
-      <li>Heat the oil in a large pot over medium heat with 3 kernels in the pan</li>
+      <li>
+        Heat the oil in a large pot over medium heat with 3 kernels in the pan
+      </li>
       <li>Wait for all three kernels to pop</li>
-      <li>Take off heat, put remaining kernels in pot. Count a full 30 seconds</li>
-      <li>Return to pot to heat. Occasionally shake the pot to drop the kernels to the bottom</li>
+      <li>
+        Take off heat, put remaining kernels in pot. Count a full 30 seconds
+      </li>
+      <li>
+        Return to pot to heat. Occasionally shake the pot to drop the kernels to
+        the bottom
+      </li>
       <li>Remove from heat when the popcorn stops popping</li>
       <li>Divide popcorn into two large bowls</li>
-      <li>Divide remaining ingredients in half. Stir each portion of popcorn in pot with ingredients</li>
+      <li>
+        Divide remaining ingredients in half. Stir each portion of popcorn in
+        pot with ingredients
+      </li>
     </ol>
 
-    <p>Also consider adding cayenne pepper or parmasian cheese for something different.</p>
+    <p>
+      Also consider adding cayenne pepper or parmasian cheese for something
+      different.
+    </p>
   </div>
 </section>

static/global.css

@@ -200,8 +200,11 @@ img {
   position: absolute;
   overflow: hidden;
   clip: rect(0 0 0 0);
-  height: 1px; width: 1px;
-  margin: -1px; padding: 0; border: 0;
+  height: 1px;
+  width: 1px;
+  margin: -1px;
+  padding: 0;
+  border: 0;
 }
 
 li {