joemaller

/* debugging colors */
:root {
  --p3-red: color(display-p3 1 0 0);
  --p3-green: color(display-p3 0 1 0);
  --p3-blue: color(display-p3 0 0 1);
  --p3-cyan: color(display-p3 0 1 1);
  --p3-yellow: color(display-p3 1 1 0);
  --p3-magenta: color(display-p3 1 0 1);
  --p3-white: color(display-p3 1 1 1);
  --p3-black: color(display-p3 0 0 0);

joemaller

// For working on the Two Factor plugin, which uses wp-env, I needed to merge
// the following onto VS Code's settings. 
// These were added to .vscode/settings.json

{
  "coverage-gutters.coverageBaseDir": "tests/logs",
  "coverage-gutters.coverageFileNames": ["clover.xml"],
  "coverage-gutters.remotePathResolve": [
    "/var/www/html/wp-content/plugins/two-factor/",
    "./"

joemaller

// Place your key bindings in this file to overwrite the defaultsauto[]
[
  // Format PHP files with `npx iop-html-php-prettier` via task
  {
    "key": "shift+alt+f",
    "command": "workbench.action.tasks.runTask",
    "when": "editorTextFocus && editorLangId == php",
    "args": "Format PHP with Prettier",
  },

joemaller

<?php 

/**
 * WordPress 6.7 introduced an inline style rule which can cause missing images to render at
 * huge sizes, breaking layouts. There are three possible solutions:
 * 
 * 1. Add a filter to disable auto sizes entirely: 
 * 
 *     add_filter( 'wp_img_tag_add_auto_sizes', '__return_false' );
 * 

joemaller

To enable thicker separator rules while still using theme.json and being able to let authors set the color of the separator, do this:

      "core/separator": {
        "border": {
          "top": {
            "style": "solid",
            "color": "transparent",
 "width": "3px"

joemaller

// webpack v5.102.1 (generated 2025-10-20)
import webpack from "webpack";
console.log("Webpack Compilation Stages:", webpack.Compilation);

// https://webpack.js.org/api/compilation-hooks/#list-of-asset-processing-stages
const result = {
  PROCESS_ASSETS_STAGE_ADDITIONAL: -2000,
  PROCESS_ASSETS_STAGE_PRE_PROCESS: -1000,
  PROCESS_ASSETS_STAGE_DERIVED: -200,
  PROCESS_ASSETS_STAGE_ADDITIONS: -100,

joemaller

# Connect and start an Exchange Online PowerShell session
Connect-ExchangeOnline -UserPrincipalName admin@example.com

# Publish the calendar
Set-MailboxCalendarFolder -Identity "cal-NAME@example.com:\Calendar" -PublishEnabled $true -DetailLevel FullDetails -PublishDateRangeFrom ThreeMonths -PublishDateRangeTo OneYear

# Print the Published ICS url
Get-MailboxCalendarFolder -Identity "cal-NAME@example.com:\Calendar" | Select-Object -ExpandProperty PublishedICalUrl

joemaller

# Display in a lower subgraph
declare lower; 

# Top-Five QQQ components with rankings from Invesco
input stock1 = "MSFT";
input weight1 = 8.85;

input stock2 = "NVDA";
input weight2 = 8.754;

joemaller

Input: Any Processing Instruction element, eg. <? string >?

Output modified Processing Instruction element

Expected Processing Instruction element passed through unchanged.

---

joemaller

Use Prettier to format HTML & PHP with a single VS Code command

Prettier is a fantastic tool, but doesn't natively support PHP. The Prettier PHP Plugin helps, but fully takes over formatting of PHP files and skips HTML in mixed documents.

There is a command-line solution (add --parser html), but most of the time I'm formatting on-the-fly in VS Code, so dropping out to the command line would be a huge slowdown.

Which brings up another problem: The Prettier VS Code extension hasn't worked with Prettier plugins since August 2023.

But, there's a solution to which works really well, even if it's a little slow.