Merge 3719b4943a into a55fff68e1

Use modern way to achieve aspect-ratio without any hacks and workarounds.

README.md

@@ -10,7 +10,7 @@ pairing with smart people at Hashrocket.
 
 For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186).
 
-_1637 TILs and counting..._
+_1638 TILs and counting..._
 
 See some of the other learning resources I work on:
 - [Ruby Operator Lookup](https://www.visualmode.dev/ruby-operators)
@@ -333,6 +333,7 @@ If you've learned something here, support my efforts writing daily TILs by
 - [Dropping Commits With Git Rebase](git/dropping-commits-with-git-rebase.md)
 - [Dry Runs in Git](git/dry-runs-in-git.md)
 - [Exclude A File From A Diff Output](git/exclude-a-file-from-a-diff-output.md)
+- [Exclude A Directory During A Command](git/exclude-a-directory-during-a-command.md)
 - [Excluding Files Locally](git/excluding-files-locally.md)
 - [Extend Git With Custom Commands](git/extend-git-with-custom-commands.md)
 - [Files With Local Changes Cannot Be Removed](git/files-with-local-changes-cannot-be-removed.md)

css/display-responsive-iframe-maintaining-aspect-ratio.md

@@ -1,4 +1,4 @@
-# Display Responsive iframe Maintaining Aspect Ratio
+# Display Responsive iframe Maintaining Aspect Ratio modern way
 
 Generally when rendering an iframe, you'll specify the `width` and `height`
 properties to give it a fixed display size.
@@ -6,9 +6,8 @@ properties to give it a fixed display size.
 You can make the iframe responsively expand to the full width of its parent
 while maintaining its aspect ratio using a little CSS.
 
-First, remove the `width` and `height` properties.
+1. First, remove the `width` and `height` properties.
-
+2. Second, add a wrapping iframe container:
-Second, add a wrapping iframe container:
 
 ```html
 <div class="iframe-container">
@@ -16,23 +15,12 @@ Second, add a wrapping iframe container:
 </div>
 ```
 
-Third, sprinkle on a little CSS to make it responsive:
+3. Sprinkle on a little CSS to make it responsive:
 
 ```css
 .iframe-container {
-  position: relative;
-  overflow: hidden;
-  /* 16:9 aspect ratio */
-  padding-top: 56.25%;
-}
-
-.iframe-container iframe {
-  position: absolute;
   width: 100%;
-  height: 100%;
+  aspect-ratio: 16 / 9;
-  top: 0;
-  left: 0;
-  border: 0;
 }
 ```
 

git/exclude-a-directory-during-a-command.md

@@ -0,0 +1,32 @@
+# Exclude A Directory During A Command
+
+Many of the git commands we use, such as `git add`, `git restore`, etc., target
+files and paths relative to the current directory. This is typically exactly
+what we want, to stage and unstage and so forth the files and directories in
+front of us.
+
+I recently ran into a situation where I needed to restore a small subset of
+changes. At the same time, I had a massive number of auto-generated files
+recording HTTP interactions (hundreds of files, modified on the working tree).
+I wanted to run a `git restore`, but wading through all those HTTP recording
+files was not feasible.
+
+I needed to exclude those files. They all belonged to a `spec/cassettes`
+directory. I could exclude them with a _pathspec_ magic signature pattern which
+is used to alter and limit the paths in a git command.
+
+A _pathspec_ magic signature is a special pattern made up of a `:` followed by
+some signature declaring what the pattern means.
+
+The `(exclude)`, `!`, and `^` magic signatures all mean the same thing —
+exclude. So, we can exclude a directory from a `git restore` command like so:
+
+```bash
+$ git restore --patch -- . ':!spec/cassettes'
+```
+
+We've employed two pathspec patterns here. The first, `.`, scopes everything to
+the current directory. The second, `':!spec/cassettes'` excludes everything in
+the `spec/cassettes` directory.
+
+See `man gitglossary` for more on _pathspecs_.