POST: Setting up Mac for the Linux user

_layouts/post.html

@@ -1,18 +1,34 @@
 ---
 layout: default
 ---
-<article class="Post">
-  {% include series.html %}
 
-  {{ content }}
+<article class="Post">
+  {% include series.html %} {{ content }}
 
   <!-- Prev Posts -->
-  <div class="Post-actions">
+  <div class="Post-actions flex justify-between">
     {% if page.previous.url %}
-      <a class="Post-actions--prev TooltipContainer" href="{{ page.previous.url }}" alt="{{ page.previous.title }}">&#171; Previous Post<div class="TooltipContainer-text TooltipContainer-text--post">{{ page.previous.title }}</div></a>
-    {% endif %}
-    {% if page.next.url %}
-      <a class="Post-actions--next TooltipContainer" href="{{ page.next.url }}" alt="{{ page.next.title }}">Next Post &#187;<div class="TooltipContainer-text TooltipContainer-text--post">{{ page.next.title }}</div></a>
+    <div class="flex-even">
+      <a
+        class="Post-actions--prev TooltipContainer"
+        href="{{ page.previous.url }}"
+        alt="{{ page.previous.title }}"
+      >
+        Previous
+      </a>
+      <p class="mt-2">{{ page.previous.title }}</p>
+    </div>
+    {% endif %} {% if page.next.url %}
+    <div class="flex-even flex flex-col items-end">
+      <a
+        class="Post-actions--next TooltipContainer"
+        href="{{ page.next.url }}"
+        alt="{{ page.next.title }}"
+      >
+        Next
+      </a>
+      <p class="mt-2 text-right">{{ page.next.title }}</p>
+    </div>
     {% endif %}
   </div>
 
@@ -24,13 +40,25 @@ <h2>Join the conversation</h2>
   </div>
 
   <script type="text/javascript">
-      var disqus_shortname = 'joshmfrankel';
-      (function() {
-          var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
-          dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
-          (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
-      })();
+    var disqus_shortname = "joshmfrankel";
+    (function () {
+      var dsq = document.createElement("script");
+      dsq.type = "text/javascript";
+      dsq.async = true;
+      dsq.src = "//" + disqus_shortname + ".disqus.com/embed.js";
+      (
+        document.getElementsByTagName("head")[0] ||
+        document.getElementsByTagName("body")[0]
+      ).appendChild(dsq);
+    })();
   </script>
-  <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
-  <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
+  <noscript
+    >Please enable JavaScript to view the
+    <a href="http://disqus.com/?ref_noscript"
+      >comments powered by Disqus.</a
+    ></noscript
+  >
+  <a href="http://disqus.com" class="dsq-brlink"
+    >comments powered by <span class="logo-disqus">Disqus</span></a
+  >
 </article>

_posts/2025/2025-03-05-setting-up-mac-for-the-linux-user.md

@@ -0,0 +1,176 @@
+---
+layout: post
+title: Setting up Mac for the Linux user
+categories:
+  - articles
+tags:
+  - mac
+  - linux
+  - setup
+---
+
+So you've got a new Mac. Maybe it's a work laptop, maybe you are switching from another operating system. Either way, if you're like me, you've got some set habits with your work environment. This article details all the configurations I do when setting up a new work laptop.
+
+<!--excerpt-->
+
+## Keyboard
+
+The first (and arguably most important) step of this guide is adjusting your modifier key mappings. This stems from my biggest gripe with Mac OSX. The **Command (⌘)** key is used for copying, pasting, switching workspaces, and all other **Ctrl (^)** key related functionality. I've grown accustomed to how Linux sets its key mappings, which flips these two keys.
+
+Luckily, Mac OSX has the concept of custom modifier keys, which define actions for several keys. Using spotlight search or **System Settings->Keyboard->Keyboard Shortcuts->Modifier Keys**, you can access the modifier keys configuration page.
+
+![Spotlight Modifier Key](/img/2025/setting-up-mac-for-the-linux-user/spotlight-modifier-key.png "Mac Spotlight search for modifier keys")
+
+Once on the page, you can switch the **Control (^)** and **Command (⌘)** keys to their opposite settings. A further step that I take is to map the **CapsLock** key to also perform **Command (⌘)** modifier actions. Because when is the last time you actually used your CapsLock key? Pretty much never for me.
+
+![Modifier Keys Settings](/img/2025/setting-up-mac-for-the-linux-user/modifier-keys-settings.png "Modifier keys settings menu")
+
+The great thing about changing the modifier keys, is that it applies everywhere system-wide. Previously, I've used tools like [Karabiner-elements](https://karabiner-elements.pqrs.org/) which give you granular control over application and system shortcuts, but that comes with lots of configuration and some idiosyncrasies.
+
+### Spotlight
+
+- Show spotlight search — `Control (^) + Space`
+
+![Spotlight Shortcuts](/img/2025/setting-up-mac-for-the-linux-user/spotlight-shortcuts.png "Spotlight shortcut settings")
+
+### Screenshots
+
+- Copy Picture of selected area to clipboard — `F13 (Printscrn)`
+
+![Screenshot Shortcuts](/img/2025/setting-up-mac-for-the-linux-user/screenshots.png "Screenshot shortcut settings")
+
+### Mission Control
+
+Set movement of workspaces to utilize the newly mapped `Control (^) key`
+![Mission Control Shortcuts](/img/2025/setting-up-mac-for-the-linux-user/mission-control.png "Mission Control Shortcuts")
+
+With that, you have basic keyboard configuration setup. Next up let's adjust the Mouse and Trackpad.
+
+## Mouse and Trackpad
+
+My preference is to disable Natural Scrolling for both mouse wheel and trackpad. This means that scrolling up on the mouse wheel moves the scrollbar up the page instead of down.
+
+![Mouse settings](/img/2025/setting-up-mac-for-the-linux-user/mouse-settings.png "Mouse settings")
+![Trackpad scroll settings](/img/2025/setting-up-mac-for-the-linux-user/trackpad-scrolling.png "Trackpad scroll settings")
+
+Additionally, I like having the Trackpad respond from a single click to perform actions and the secondary click be set to the bottom right corner of the Trackpad. The single click to perform actions from my experience is on by default in several Linux distros.
+
+![Trackpad pointer settings](/img/2025/setting-up-mac-for-the-linux-user/trackpad-pointer-settings.png "Trackpad pointer settings")
+
+Next up let's update the Dock.
+
+## Desktop & Dock
+
+The Dock is my favorite part of both Mac OSX and many Linux distributions. If you're using Fedora Workstation or Elementary OS, the Dock in each of the these are fantastic. Mac's Dock is pretty good by default as well. I like to get information out of the way unless I need it, so hiding the dock until the mouse hovers over it is a key change I make.
+
+![Dock Settings](/img/2025/setting-up-mac-for-the-linux-user/dock-settings.png "Dock settings")
+
+To accomplish this, you'll need to enable "Automatically hide and show the Dock". This hides the Dock until the mouse moves over it. Now by default this animation is rather slow. I believe it is trying to mimic a pressure reveal. However, I want this to be smooth and snappy. Luckily, some enterprising individuals have figured out the internal settings used to calculate both the delay for showing as well as the animation timing. Here is the result of making the change.
+
+![Dock Animation](/img/2025/setting-up-mac-for-the-linux-user/dock-animation.gif "Dock Animation")
+
+In order to configure this, you'll need to open your Terminal and run the following lines. `autohide-delay` is how long to wait before starting the show/hide transition, while `autohide-time-modifier` is the animation timing. You can see that we set it to zero in order for it to immediately start transitioning states.
+
+```
+defaults write com.apple.dock autohide-delay -int 0
+defaults write com.apple.dock autohide-time-modifier -float 0.4
+killall Dock
+```
+
+[Original source](https://apple.stackexchange.com/a/70598/612153)
+
+Here are some additional Dock settings that I utilize for a better overall experience:
+
+- Minimize windows using **Scale Effect** gives a more consistent animation transition experience.
+- Enabling **Minimize windows into application icon** ensures that each application in the Dock provides all the open windows of itself. Otherwise, these open next to the Downloads and Trash Can for each window.
+
+![Minimize app into Dock](/img/2025/setting-up-mac-for-the-linux-user/minimize-app-into-dock.png "Minimize app into Dock")
+
+- Disabling "Show suggested and recent apps in Dock" helps to remove clutter in the Dock for a feature I never use.
+
+### App set to specific workspace
+
+I like to have 4 Workspaces when programming: Browser, Editor, Git Gui, and Spotify. So after opening an application you can set the application to always open in a specific Workspace with the context menu in the Dock.
+
+![App set to specific workspace](/img/2025/setting-up-mac-for-the-linux-user/app-set-to-specific-workspace.png "App set to specific workspace")
+
+### Control Center
+
+Within here there are a couple of nice tweaks we can make in the **Menu Bar Only** section.
+
+- Spotlight set to "Don't show in Menu Bar". Spotlight is more useful from a keyboard shortcut.
+- Automatically hide and show the menu bar set to "Always". This will hide your top menu bar and allow more focus on current work (as well as more screen real estate).
+- Recent Documents, applications, and servers set to "None". I prefer to have the quick open functionality focus only on what is currently open. So right clicking on a Dock icon will show me all the windows I have currently open without past open files.
+
+![Recent documents settings](/img/2025/setting-up-mac-for-the-linux-user/recent-documents.png "Recent documents settings")
+
+### Mission Control
+
+Now on the same settings page under "Mission Control", the first option "Automatically rearrange spaces based on use" should be disabled. This prevents your workspaces from changing their order based on usage. I have my workspaces setup in the following order: Browser & Slack, Editor, Git Merge Tool, and Spotify. This allows me a consistent development experience to easily move back and forth between tasks.
+
+Much like the Dock's show/hide timing, we can adjust Workspace switching by setting the following value:
+
+```
+defaults write com.apple.dock workspaces-swoosh-animation-off -bool YES
+killall Dock
+```
+
+This can help, but there is still some slowness from switching spaces, depending on when you activate the keyboard shortcut to switch. I'm not aware of other methods to speed switching up further.
+
+Next up are several general System Settings.
+
+## Appearance
+
+Personally I prefer a dark theme as it is easier on the eyes. I do enjoy a good pop of color, so I select the Purple accent for the system.
+
+![Apperance Settings](/img/2025/setting-up-mac-for-the-linux-user/appearance-settings.png "Apperance Settings")
+
+## Display
+
+I use a laptop connected to a primary monitor. I've used a single monitor for years and years, so I don't use the laptop for anything but powering the screen. Because of this, I've set my display mode to Mirror screen.
+
+## Homebrew
+
+The defacto package manager for Mac. Get it as it is nearly guaranteed that at some point you'll need it.
+
+[https://brew.sh/](https://brew.sh/)
+
+```
+/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
+```
+
+## Applications
+
+Over the years, I've come to use the following applications consistently. I won't go into too much more detail around application configuration until a follow-up post, but here is the list of apps that I use. Coming from a Linux background, I have focused on apps which are free. The only fully paid app below is Magnet (window snapping) while Sublime Text, Sublime Merge, and Cursor have free versions with less functionality.
+
+- [1Clipboard](https://1clipboard.io/) - For Clipboard management
+- [Brave Browser](https://brave.com/) - For Ad-free web browsing
+- [Docker](https://www.docker.com/) - For Containerization
+- [Giphy Capture](https://apps.apple.com/us/app/giphy-capture-the-gif-maker/id668208984?mt=12) - For recording short animated demos in Gif format
+- [Hidden Bar](https://apps.apple.com/us/app/hidden-bar/id1452453066?mt=12) - For customizing the top bar application tray
+- [iA Writer](https://ia.net/writer) - For focused writing
+- [Bruno](https://www.usebruno.com/) - For API development
+- [Magnet](https://apps.apple.com/us/app/magnet/id441258766?mt=12) - For enhanced application tiling
+- [MeetingBar](https://meetingbar.app/) - For meeting notifications and joining video calls
+- [Spotify](https://www.spotify.com/us/download/mac/) - For vibes
+- [Slack](https://slack.com/) - For chatting
+- [Sublime Merge](https://www.sublimemerge.com/) - For Git Client
+- [Sublime Text](https://www.sublimetext.com/) and [Cursor](https://www.cursor.com/) - For Code editing
+- [Tabby](https://tabby.sh/) - For modern terminal
+
+### NoTunes
+
+This is a nice quality of life change for how the media buttons interact with the default Mac audio applications.
+Specifically, it can be used to change the default program to something like Spotify instead of Music or Tunes.
+
+[NoTunes](https://github.com/tombonez/noTunes)
+
+1. Install - `brew install --cask notunes`
+2. Right click or control-click the menu bar icon and click Hide Icon.
+3. Replace with Spotify or other app - `defaults write digital.twisted.noTunes replacement /Applications/Spotify.app`
+
+## Conclusion
+
+Now we've ironed out a bunch of rough edges for those of us coming from a Linux environment. Such smooth. Many nice. Stay tuned for a similiar post regarding my Fedora Workstation setup.
+
+Got any Mac OSX tweaks or settings you use? Leave a comment below to get the discussion started.

_sass/_base.scss

@@ -51,15 +51,18 @@ mark {
   cursor: help;
   font-style: italic;
 }
-p, blockquote, li {
+p,
+blockquote,
+li {
   font: 300 2rem/32px $railway;
 }
 blockquote {
   border-left: 5px solid $primary-color;
   margin: 0;
   padding: 20px;
 
-  p, li {
+  p,
+  li {
     line-height: 40px;
   }
   a {
@@ -84,13 +87,15 @@ blockquote {
 ul {
   padding-left: 25px;
 }
-p, li {
+p,
+li {
   color: $p-color;
 }
 .highlight {
   margin: 0;
   font-size: 1.7rem;
   clear: both; // Prevent .Info from compacting code
+  border-radius: 4px;
 }
 abbr {
   text-decoration: none;
@@ -120,7 +125,8 @@ table {
       color: $darker-gray-hover;
     }
   }
-  th, td {
+  th,
+  td {
     padding: 15px;
   }
   tbody tr:nth-child(even) {

_sass/_tailwindcss.scss

@@ -1,7 +1,3 @@
-.inline-flex {
-  display: inline-flex;
-}
-
 .p-2\.5 {
   padding: 10px;
 }
@@ -10,6 +6,18 @@
   aspect-ratio: 1 / 1;
 }
 
+.mt-2 {
+  margin-top: 8px;
+}
+
+/**
+ * Typography
+ **/
+
+.text-right {
+  text-align: right;
+}
+
 /**
  * Colors
  **/
@@ -40,6 +48,30 @@
   justify-content: center;
 }
 
+.justify-between {
+  justify-content: space-between;
+}
+
+.inline-flex {
+  display: inline-flex;
+}
+
+.flex {
+  display: flex;
+}
+
+.flex-col {
+  flex-direction: column;
+}
+
+.items-end {
+  align-items: flex-end;
+}
+
+.flex-even {
+  flex: 1 1 0px;
+}
+
 /**
  * Transitions
  **/
@@ -50,7 +82,8 @@
 }
 
 .transition-colors {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }