From 33753ea4ee7310c93dc6801d0e3a3ed1d839ecc0 Mon Sep 17 00:00:00 2001 From: chuanqisun Date: Wed, 5 May 2021 00:34:36 +0000 Subject: [PATCH] deploy: 597223b752d52c784aca1431187acf898070007e --- cache.json | 143 ++++++++++++++++++---------------- index.html | 224 +++++++++++++++++++++++++++-------------------------- 2 files changed, 191 insertions(+), 176 deletions(-) diff --git a/cache.json b/cache.json index 9648fb6..8d2cef2 100644 --- a/cache.json +++ b/cache.json @@ -3,11 +3,47 @@ { "href": "https://css-tricks.com/feed/", "articles": [ + { + "description": "This was a great “Today I Learned” for me from Josh W. Comeau. If the font-size of an <input> is 16px or larger, Safari on iOS will focus into the input normally. But as soon as the font-size is …\nThe post 16px or Larger Text Prevents iOS Form Zoom appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://css-tricks.com/16px-or-larger-text-prevents-ios-form-zoom/", + "publishedOn": "2021-05-04T21:16:04.000Z", + "wordCount": 590, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "16px or Larger Text Prevents iOS Form Zoom" + }, + { + "description": "Here’s a dilemma: what happens if your WooCommerce site has a problem and the quickest and best way to fix it is to roll back to a previous version? The dilemma is, if you roll back the database, you would …\nThe post Jetpack Backup: Roll Back Your WooCommerce Site Without Losing Orders appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://css-tricks.com/jetpack-backup-roll-back-your-woocommerce-site-without-losing-orders/", + "publishedOn": "2021-05-04T21:15:57.000Z", + "wordCount": 450, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "Jetpack Backup: Roll Back Your WooCommerce Site Without Losing Orders" + }, + { + "description": "I was just chatting with Eric Meyer the other day and I remembered an Eric Meyer story from my formative years. I wrote a blog post about CSS specificity, and Eric took the time to point out the misleading nature …\nThe post Let’s use (X, X, X, X) for talking about specificity appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://css-tricks.com/lets-use-x-x-x-x-for-talking-about-specificity/", + "publishedOn": "2021-05-04T14:19:55.000Z", + "wordCount": 861, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "Let’s use (X, X, X, X) for talking about specificity" + }, + { + "description": "A bona fide CSS trick from Kirupa Chinnathambi here. To match a colored shadow with the colors in the background-image of an element, you inherit the background in a pseudo-element, kick it behind the original, then blur and filter it. …\nThe post Creating Colorful, Smart Shadows appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", + "link": "https://www.kirupa.com/html5/creating_colorful_smart_shadows.htm", + "publishedOn": "2021-05-04T14:19:48.000Z", + "wordCount": 1279, + "sourceHref": "https://css-tricks.com/feed/", + "sourceTitle": "CSS-Tricks", + "title": "Creating Colorful, Smart Shadows" + }, { "description": "In June of 2006, web developers and designers from around the world came to London for the second annual @media conference. The first had been a huge success, and @media 2006 had even more promise. Its speaker lineup was pulled …\nThe post Chapter 8: CSS appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/chapter-8-css/", "publishedOn": "2021-05-03T21:52:08.000Z", - "wordCount": 6272, + "wordCount": 6465, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Chapter 8: CSS" @@ -34,7 +70,7 @@ "description": "Yay, it’s here! Safari 14.1 reportedly adds support for the gap property in flexbox layouts. We’ve had grid-gap support for some time, but true to its name, it’s limited to grid layouts. Now we can use gap in either type …\nThe post Safari 14.1 Adds Support for Flexbox Gaps appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/safari-14-1-adds-support-for-flexbox-gaps/", "publishedOn": "2021-04-30T21:51:08.000Z", - "wordCount": 749, + "wordCount": 785, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Safari 14.1 Adds Support for Flexbox Gaps" @@ -61,7 +97,7 @@ "description": "Labels are a feature that have existed since the creation of JavaScript. They aren’t new! I don’t think all that many people know about them and I’d even argue they are a bit confusing. But, as we’ll see, labels can …\nThe post You Can Label a JavaScript `if` Statement appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", "link": "https://css-tricks.com/you-can-label-a-javascript-if-statement/", "publishedOn": "2021-04-30T14:29:32.000Z", - "wordCount": 1992, + "wordCount": 2196, "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "You Can Label a JavaScript `if` Statement" @@ -101,48 +137,30 @@ "sourceHref": "https://css-tricks.com/feed/", "sourceTitle": "CSS-Tricks", "title": "Your Team is Not “Them”" - }, - { - "description": "Click, drag, release: you’ve just selected some text on a webpage — probably to copy and paste it somewhere or to share it. Wouldn’t it be cool if selecting that text revealed some options that make those tasks easier? That’s …\nThe post How to Create Actions for Selected Text With the Selection API appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/how-to-create-actions-for-selected-text-with-the-selection-api/", - "publishedOn": "2021-04-28T14:19:54.000Z", - "wordCount": 1560, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "How to Create Actions for Selected Text With the Selection API" - }, - { - "description": "I was just Hoping for Better Native Page Transitions, and Bramus commented that Chrome is working on something. Looks like it has some fresh enthusiasm for it, as there is a brand new repo, and you can literally test …\nThe post Shared Element Transitions appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/shared-element-transitions/", - "publishedOn": "2021-04-27T20:12:04.000Z", - "wordCount": 1121, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "Shared Element Transitions" - }, - { - "description": "Everything important and useful to know about CSS Custom Properties. Like that they are often referred to as \"CSS Variables\" but that's not their real name.\nThe post A Complete Guide to Custom Properties appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/a-complete-guide-to-custom-properties/", - "publishedOn": "2021-04-27T14:26:16.000Z", - "wordCount": 5544, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "A Complete Guide to Custom Properties" - }, - { - "description": "I saw in the release notes for Safari Technical Preview 122 that it has support for a color-contrast() function in CSS. Safari is first out of the gate here. As far as I know, no other browser supports this yet …\nThe post Exploring color-contrast() for the First Time appeared first on CSS-Tricks.\nYou can support CSS-Tricks by being an MVP Supporter.", - "link": "https://css-tricks.com/exploring-color-contrast-for-the-first-time/", - "publishedOn": "2021-04-26T21:02:49.000Z", - "wordCount": 1031, - "sourceHref": "https://css-tricks.com/feed/", - "sourceTitle": "CSS-Tricks", - "title": "Exploring color-contrast() for the First Time" } ] }, { "href": "https://www.smashingmagazine.com/feed/", "articles": [ + { + "description": "No matter how experienced you are, mistakes are an inevitable part of software development. But we can learn to repair them! And this is what we'll be looking at in this two-part series: how to undo mistakes using Git.", + "link": "https://smashingmagazine.com/2021/05/undoing-mistakes-git-part1/", + "publishedOn": "2021-05-04T14:30:00.000Z", + "wordCount": 1791, + "sourceHref": "https://www.smashingmagazine.com/feed/", + "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", + "title": "A Guide To Undoing Mistakes With Git" + }, + { + "description": "In this episode, we’re starting our new season of the Smashing Podcast with a look at the future of CSS. What new specs will be landing in browsers soon? Drew McLellan talks to expert Miriam Suzanne to find out.", + "link": "https://smashingmagazine.com/2021/05/smashing-podcast-episode-36/", + "publishedOn": "2021-05-04T05:00:00.000Z", + "wordCount": 6993, + "sourceHref": "https://www.smashingmagazine.com/feed/", + "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", + "title": "Smashing Podcast Episode 36 With Miriam Suzanne: What Is The Future Of CSS?" + }, { "description": "Web-oriented databases, frameworks like Nuxt and Next.js, and even frameworkless approaches are evolving the Jamstack, but the core principles are more powerful than ever.", "link": "https://smashingmagazine.com/2021/05/evolution-jamstack/", @@ -340,21 +358,30 @@ "sourceHref": "https://www.smashingmagazine.com/feed/", "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", "title": "Don’t Lose Your Head: Evaluating Headless" - }, - { - "description": "A guide to vanilla JavaScript code snippets — with resources and lightweight libraries to help you solve a problem without a large overhead or third-party dependencies.", - "link": "https://smashingmagazine.com/2021/04/vanilla-javascript-code-snippets/", - "publishedOn": "2021-04-05T10:30:00.000Z", - "wordCount": 2018, - "sourceHref": "https://www.smashingmagazine.com/feed/", - "sourceTitle": "Articles on Smashing Magazine — For Web Designers And Developers", - "title": "Vanilla JavaScript Code Snippets" } ] }, { "href": "https://www.freecodecamp.org/news/rss/", "articles": [ + { + "description": "A complete guide to Node.js async await", + "link": "https://www.freecodecamp.org/news/node-js-async-await-tutorial-with-asynchronous-javascript-examples/", + "publishedOn": "2021-05-04T16:07:17.000Z", + "wordCount": 2235, + "sourceHref": "https://www.freecodecamp.org/news/rss/", + "sourceTitle": "freeCodeCamp.org", + "title": "Node.js Async Await Tutorial – With Asynchronous JavaScript Examples" + }, + { + "description": "To copy files or directories in Unix-based operating systems (Linux and MacOS), you use the cp command. The cp command is a relatively simple command, but its behavior changes slightly depending on the inputs (files vs directories) and the options you pass to it. To view the documentation or manual", + "link": "https://www.freecodecamp.org/news/copy-a-directory-in-linux-how-to-cp-a-folder-in-the-command-line-in-linux-and-unix-macos/", + "publishedOn": "2021-05-04T15:33:12.000Z", + "wordCount": 1012, + "sourceHref": "https://www.freecodecamp.org/news/rss/", + "sourceTitle": "freeCodeCamp.org", + "title": "Copy a Directory in Linux – How to cp a Folder in the Command Line in Linux and Unix (MacOS)" + }, { "description": "Let's go through the five best ways that you can fetch data with React from a GraphQL API. While there are a couple of popular libraries which are made to interact with GraphQL APIs from a React application, there are many different ways to fetch data with GraphQL. I've included", "link": "https://www.freecodecamp.org/news/5-ways-to-fetch-data-react-graphql/", @@ -426,27 +453,9 @@ "sourceHref": "https://www.freecodecamp.org/news/rss/", "sourceTitle": "freeCodeCamp.org", "title": "CSS Flexbox Tutorial with Flexbox Properties Cheat Sheet 🎖️" - }, - { - "description": "The MERN stack is a popular way to make a full stack web app. MERN stands for MongoDB, Express, React, and Node.js. We just published a course on the freeCodeCamp.org YouTube channel that will teach you how to use the MERN stack by building a restaurant review web", - "link": "https://www.freecodecamp.org/news/create-a-mern-stack-app-with-a-serverless-backend/", - "publishedOn": "2021-04-28T14:05:56.000Z", - "wordCount": 384, - "sourceHref": "https://www.freecodecamp.org/news/rss/", - "sourceTitle": "freeCodeCamp.org", - "title": "Create a MERN Stack App with a Serverless Backend" - }, - { - "description": "JavaScript is an easy-to-learn programming language compared to many of its counterparts. However, a few basic concepts need a bit more attention if you want to understand, debug, and write better code. In this article, we will learn about two such concepts, Execution ContextHoistingAs a beginner to JavaScript, understanding these", - "link": "https://www.freecodecamp.org/news/javascript-execution-context-and-hoisting/", - "publishedOn": "2021-04-27T22:53:14.000Z", - "wordCount": 2010, - "sourceHref": "https://www.freecodecamp.org/news/rss/", - "sourceTitle": "freeCodeCamp.org", - "title": "JavaScript Execution Context and Hoisting Explained with Code Examples" } ] } ], - "cliVersion": "1.3.0" + "cliVersion": "1.3.1" } \ No newline at end of file diff --git a/index.html b/index.html index c6aae26..3261d58 100644 --- a/index.html +++ b/index.html @@ -1,15 +1,124 @@ + osmos::feed + - osmos::feed - + +
+

2021-05-04

+ +

CSS-Tricks

+
+ +
+
+ 16px or Larger Text Prevents iOS Form Zoom +
+

This was a great “Today I Learned” for me from Josh W. Comeau. If the font-size of an <input> is 16px or larger, Safari on iOS will focus into the input normally. But as soon as the font-size is … +The post 16px or Larger Text Prevents iOS Form Zoom appeared first on CSS-Tricks. +You can support CSS-Tricks by being an MVP Supporter.

+ Read · 2 min +
+
+
+ +
+
+ Jetpack Backup: Roll Back Your WooCommerce Site Without Losing Orders +
+

Here’s a dilemma: what happens if your WooCommerce site has a problem and the quickest and best way to fix it is to roll back to a previous version? The dilemma is, if you roll back the database, you would … +The post Jetpack Backup: Roll Back Your WooCommerce Site Without Losing Orders appeared first on CSS-Tricks. +You can support CSS-Tricks by being an MVP Supporter.

+ Read · 2 min +
+
+
+ +
+
+ Let’s use (X, X, X, X) for talking about specificity +
+

I was just chatting with Eric Meyer the other day and I remembered an Eric Meyer story from my formative years. I wrote a blog post about CSS specificity, and Eric took the time to point out the misleading nature … +The post Let’s use (X, X, X, X) for talking about specificity appeared first on CSS-Tricks. +You can support CSS-Tricks by being an MVP Supporter.

+ Read · 3 min +
+
+
+ +
+
+ Creating Colorful, Smart Shadows +
+

A bona fide CSS trick from Kirupa Chinnathambi here. To match a colored shadow with the colors in the background-image of an element, you inherit the background in a pseudo-element, kick it behind the original, then blur and filter it. … +The post Creating Colorful, Smart Shadows appeared first on CSS-Tricks. +You can support CSS-Tricks by being an MVP Supporter.

+ Read · 4 min +
+
+
+
+ + +

freeCodeCamp.org

+
+ +
+
+ Node.js Async Await Tutorial – With Asynchronous JavaScript Examples +
+

A complete guide to Node.js async await

+ Read · 7 min +
+
+
+ +
+
+ Copy a Directory in Linux – How to cp a Folder in the Command Line in Linux and Unix (MacOS) +
+

To copy files or directories in Unix-based operating systems (Linux and MacOS), you use the cp command. The cp command is a relatively simple command, but its behavior changes slightly depending on the inputs (files vs directories) and the options you pass to it. To view the documentation or manual

+ Read · 3 min +
+
+
+
+ + +

Articles on Smashing Magazine — For Web Designers And Developers

+
+ +
+
+ A Guide To Undoing Mistakes With Git +
+

No matter how experienced you are, mistakes are an inevitable part of software development. But we can learn to repair them! And this is what we'll be looking at in this two-part series: how to undo mistakes using Git.

+ Read · 6 min +
+
+
+ +
+
+ Smashing Podcast Episode 36 With Miriam Suzanne: What Is The Future Of CSS? +
+

In this episode, we’re starting our new season of the Smashing Podcast with a look at the future of CSS. What new specs will be landing in browsers soon? Drew McLellan talks to expert Miriam Suzanne to find out.

+ Read · 23 min +
+
+
+
+ +
+ +

2021-05-03

@@ -23,7 +132,7 @@

In June of 2006, web developers and designers from around the world came to London for the second annual @media conference. The first had been a huge success, and @media 2006 had even more promise. Its speaker lineup was pulled … The post Chapter 8: CSS appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.

- Read · 21 min + Read · 22 min @@ -129,7 +238,7 @@ You can support CSS-Tricks by being an MVP Supporter.

Yay, it’s here! Safari 14.1 reportedly adds support for the gap property in flexbox layouts. We’ve had grid-gap support for some time, but true to its name, it’s limited to grid layouts. Now we can use gap in either type … The post Safari 14.1 Adds Support for Flexbox Gaps appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.

- Read · 2 min + Read · 3 min @@ -311,18 +420,6 @@ You can support CSS-Tricks by being an MVP Supporter.

- -
-
- How to Create Actions for Selected Text With the Selection API -
-

Click, drag, release: you’ve just selected some text on a webpage — probably to copy and paste it somewhere or to share it. Wouldn’t it be cool if selecting that text revealed some options that make those tasks easier? That’s … -The post How to Create Actions for Selected Text With the Selection API appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 5 min -
-
-
@@ -338,16 +435,6 @@ You can support CSS-Tricks by being an MVP Supporter.

- -
-
- Create a MERN Stack App with a Serverless Backend -
-

The MERN stack is a popular way to make a full stack web app. MERN stands for MongoDB, Express, React, and Node.js. We just published a course on the freeCodeCamp.org YouTube channel that will teach you how to use the MERN stack by building a restaurant review web

- Read · 1 min -
-
-
@@ -371,50 +458,6 @@ You can support CSS-Tricks by being an MVP Supporter.

2021-04-27

-

freeCodeCamp.org

-
- -
-
- JavaScript Execution Context and Hoisting Explained with Code Examples -
-

JavaScript is an easy-to-learn programming language compared to many of its counterparts. However, a few basic concepts need a bit more attention if you want to understand, debug, and write better code. In this article, we will learn about two such concepts, Execution ContextHoistingAs a beginner to JavaScript, understanding these

- Read · 7 min -
-
-
-
- - -

CSS-Tricks

-
- -
-
- Shared Element Transitions -
-

I was just Hoping for Better Native Page Transitions, and Bramus commented that Chrome is working on something. Looks like it has some fresh enthusiasm for it, as there is a brand new repo, and you can literally test … -The post Shared Element Transitions appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 4 min -
-
-
- -
-
- A Complete Guide to Custom Properties -
-

Everything important and useful to know about CSS Custom Properties. Like that they are often referred to as "CSS Variables" but that's not their real name. -The post A Complete Guide to Custom Properties appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 18 min -
-
-
-
- -

Articles on Smashing Magazine — For Web Designers And Developers

@@ -435,23 +478,6 @@ You can support CSS-Tricks by being an MVP Supporter.

2021-04-26

-

CSS-Tricks

-
- -
-
- Exploring color-contrast() for the First Time -
-

I saw in the release notes for Safari Technical Preview 122 that it has support for a color-contrast() function in CSS. Safari is first out of the gate here. As far as I know, no other browser supports this yet … -The post Exploring color-contrast() for the First Time appeared first on CSS-Tricks. -You can support CSS-Tricks by being an MVP Supporter.

- Read · 3 min -
-
-
-
- -

Articles on Smashing Magazine — For Web Designers And Developers

@@ -768,29 +794,9 @@ You can support CSS-Tricks by being an MVP Supporter.

- -
-

2021-04-05

- -

Articles on Smashing Magazine — For Web Designers And Developers

-
- -
-
- Vanilla JavaScript Code Snippets -
-

A guide to vanilla JavaScript code snippets — with resources and lightweight libraries to help you solve a problem without a large overhead or third-party dependencies.

- Read · 7 min -
-
-
-
- -
-