Makzan’s Weekly Dispatch 2019w21-22: Scroll Snap code example

Makzan / I share what I learnt

Hi there,

This is week 21 and 22 of 2019. In my recent work, I need to access a phpBB forum. A very old code base that use table layout and doesn’t have mobile friendly CSS. By using the WKWebView in iOS, I can inject CSS to change the loaded HTML. Specifically, I apply the following style:

- Make the wrapper `100vw` width.
- Turn `td` into block element.
- Apply image `max-width` to 100%.
- Adjust font-size to fit mobile reading.

I also inject JavaScript to auto login for me, so that I can access the content right after I launch the app, without any further inputs and taps.

One more benefit of creating a wrapper is to keep the page in memory while switching apps. It is especially useful because the default web browser usually contains many tabs throughout the day. Using a dedicated app can keep the web content there whenever I need it, without sinking in my hundreds of tabs.

In additional to a web wrapper, I use the UITabBarController to create multiple web view instances. Now I can have some reference tabs for information while posting a new post on the phpBB forum.

Links worth sharing

Web Standard → W3C and WHATWG to work together

This is a good match between the living standard and W3C mains a list of recommendations.

> “HTML and DOM shall be developed principally in the WHATWG, following WHATWG Living Standard (LS) specification process. W3C intends to give input to and endorse WHATWG Review Drafts to become W3C Recommendations, through the W3C Process from Candidate Recommendation (CR) through Proposed Recommendation (PR) to Recommendation (REC). Our Design Goal is that the W3C CR, PR, and REC, and the WHATWG Review Draft are the same document.” — WHATWG and W3C MOU

Beyond the Tablet → MacStories’ review on using iPad as main computer for years

I have been in favor of using iPad than MacBook for years. but something sill requires a Mac, such as writing software. Still, I prefer iPad as my main computer and MacBook as a fallback when things can’t be achieved on iPad as effective.

Working Copy updates to support markdown content block

This is a nice to have especially for writer that uses iA Writer and the Content Blockfeature. I tried the update of Working Copy. Its content block doesn’t nest, while iA Writer’s allows nesting the content block include inside another one.

Gmail Tracks Your Purchase History

I am actually not surprise to see such news. As I mentioned in my previous newsletter, I quitted using Gmail the first day they included ads in the inbox.

Rough.js → A tiny JS graphics library that create hand-draw style of shapes

It works in both canvas and SVG. Suitable for doodling style web projects.

Code worth sharing

The old CSS scroll snap syntax will be dropped. I created a demo on using it and make it mobile friendly:

Quote worth sharing

“Logic will get you from A to Z; imagination will get you everywhere.” — Albert Einstein

Until next week,
Thomas Mak

If you would like to share this post, please share with and thanks for sharing!

If you are reading this newsletter for the first time, you can subscribe at

Thanks again for reading my newsletter.