This article was originally featured on the The Bubblin Blog. It has since been updated and migrated to the Toucaan blog because it is relevant here.
Raise your hands if you love the notched iPhones and Google Pixel. 🙋♀️🙋♂️
Okay. Not many hands went up there, but I am sure, as a web developer or designer, you wouldn't you like some extra real estate for your app?
Scaling the digital type across mediums has always been a difficult problem. In this post, we will talk about an intrinsically scaling typographic system that we have discovered while building our css framework.
As you'll see, this new system resolves most, if not all, of the challenges faced by a web developer. Let's start by solving this meme first:
This article was originally featured on the The Bubblin Blog.
Welcome to the newest chapter on Rethinking CSS Frameworks with the Toucaan. In this chapter, we will implement A CSS Router that will allow us to isolate and deliver only medium-specific stylesheets that make our apps "belong" to the device.
This css router will eventually form the backbone of the Applied Principles of Intrinsic Design, therefore, we recommend the end user to read this post carefully.
This article was originally featured on the The Bubblin Blog.
In the last chapter we floated the idea of replacing the first anti-pattern that pervades nearly all of the traditional css frameworks.
Here's a quick recap:
Hardcoded width-based MQ breakpoints that separate styles between desktop, mobile, and other category of devices is an anti-pattern.
CSS has had viewport units like vw, vh, vmin, and vmax for years with a great browser support. These units work fine in nearly all the scenarios except on a mobile where the height of the viewport (unit) changes as the page is scrolled up and the browser interface hides away.
Recently, a few new level-4 css units were announced as browser standards to address this issue.
Welcome to the Toucaan Blog. 🎉
Here you'll find articles and discussions on intrinsic application design.
Toucaan is a stack-agnostic vanilla styling framework for mobile apps and the web. Meaning it doesn't require javascript or any other frontend library to work.