Update article

Author: shiro

src/DialogImage.tsx

@@ -55,6 +55,10 @@ const _Thumbnail = css``;
 const _FullscreenImage = css`
   --w_limit: 90vw !important;
   --h_limit: 90vh !important;
+
+  // don't upscale
+  max-width: calc(var(--width) * 1px);
+  max-height: calc(var(--height) * 1px);
 `;
 
 export default withStyle(DialogImage, { Thumbnail: _Thumbnail });

src/LazyImage.tsx

@@ -66,8 +66,6 @@ const _LazyImage = css`
   --sf_px: min(var(--x_sf_px), var(--y_sf_px));
   width: calc((var(--width) * var(--sf_px) / 100));
   height: calc((var(--height) * var(--sf_px) / 100));
-  max-width: calc(var(--width) * 1px);
-  max-height: calc(var(--height) * 1px);
 
   ${breakpoint("xs")} {
     object-fit: cover !important;

src/articles/2024-04-28-deploying-a-solid-start-app-to-github-pages/article.mdx

@@ -215,6 +215,9 @@ caption="The workflow finished successfully"
 />
 
 Let's try opening the page and ensuring everything works as it should.
+Also check for any errors in the console and try clicking the button to increase the counter.
+If the counter works, it means that JS hydrated successfully and client side Javascript works
+as expected.
 
 <Img
 src={p3}