diff --git a/README.md b/README.md index c172850..95120c7 100644 --- a/README.md +++ b/README.md @@ -20,7 +20,7 @@ I usually don't want to include all of them in my project. So I collect most popular layouts and components that can be built with pure CSS. They are powered by modern CSS features such as flexbox and grid. -They are great starting points and could be picked and customized easily for each specific need. +They are great starting points to be picked and customized easily for each specific need. By composing them, you can have any possible layout that exists in the real life. The entire website is powered by @@ -33,8 +33,12 @@ this .then(r => optimizeAndBundle(webpack)) .then(r => exportHtml(react-snap)) .then(r => deploy(Netlify)) - .assert([scalableCode, superFastWebsite, seoFriendly]) - .finally(/* Give me 1 star */) 🎉 + .then(r => { + expect(r).is(scalableCode); + expect(r).is(superFastWebsite); + expect(r).is(seoFriendly); + }) + .finally(() => {/* Give me 1 star */}) 🎉 ~~~ ## Running it on local diff --git a/client/Explore.tsx b/client/Explore.tsx index d12e90d..d9beaf2 100644 --- a/client/Explore.tsx +++ b/client/Explore.tsx @@ -58,13 +58,16 @@ const Home = () => { fontSize: '24px', fontWeight: 300, lineHeight: 1.5, - margin: 0, - padding: '32px 0', + margin: '32px 0 16px 0', + padding: '0', textAlign: 'center', }} > Here is the collection of patterns +
+ All covers you see in this page are made with CSS only. Inspect them! 🎉 +
diff --git a/client/Home.tsx b/client/Home.tsx index a90be5b..f4c1ae7 100644 --- a/client/Home.tsx +++ b/client/Home.tsx @@ -55,6 +55,28 @@ const Home = () => { a collection of popular layouts and patterns made with CSS +
+
+
+ Components, patterns and layouts are things you have to deal with everyday. +
+
There are a lot of CSS frameworks that provide rich set of layouts and patterns, + but I usually don't want to include all of them in my project.
+
+
+
+ So that I collect most popular layouts and patterns that can be built with pure CSS. +
+
They are powered by modern CSS features such as flexbox and CSS grid.
+
+
+
+ Starting with the most basic part, you can customize easily for each specific need. +
+
By composing them, you can have any possible layout that exists in the real life.
+
+
+