diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml index 8d878e3..4d9e63f 100644 --- a/.github/workflows/publish.yml +++ b/.github/workflows/publish.yml @@ -32,9 +32,9 @@ jobs: VSCE_PAT: ${{ secrets.VSCE_PAT }} run: npx @vscode/vsce publish --pat $VSCE_PAT - # - name: Setup npm authentication - # run: | - # echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > ~/.npmrc + - name: Setup npm authentication + run: | + echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > ~/.npmrc - # - name: Publish to npm - # run: npm publish \ No newline at end of file + - name: Publish to npm + run: npm publish diff --git a/.vscode/extensions.json b/.vscode/extensions.json index a27eb04..c1f5053 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -1,5 +1,5 @@ { "recommendations": [ - "pierre-computer-co.pierre-vscode-theme" + "pierrecomputer.pierre-theme" ] } \ No newline at end of file diff --git a/README.md b/README.md index 3f63ddd..e2e743d 100644 --- a/README.md +++ b/README.md @@ -1,20 +1,38 @@ -# Pierre VS Code Theme +# Pierre Theme + +Light and dark themes for Visual Studio Code, Cursor, and Shiki. Built for [Diffs.com](https://diffs.com) by [The Pierre Computer Company](https://pierre.computer). + +## Preview ![Pierre dark theme screenshot](https://github.com/user-attachments/assets/e8b2a6e0-995b-4515-997a-f805f4fbc5bf) ![Pierre light theme screenshot](https://github.com/user-attachments/assets/2ebb09d0-eb42-4c28-9617-35873d96ed8f) ## Install -1. Go to the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=pierre-computer-co.pierre-vscode-theme). -2. Click on the "Install" button. -3. Then [select a theme](https://code.visualstudio.com/docs/getstarted/themes#_selecting-the-color-theme). Four themes are included: - - `Pierre Light` - - `Pierre Dark` +### Visual Studio Code + +From the menu in Visual Studio Code: + +- View > Extensions (or hit Command+Shift+X or Control+Shift+X) +- Search for `Pierre Theme` +- Click install + +You can also install or download from the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=pierrecomputer.pierre-theme). + +### Cursor + +From the menu in Cursor: + +- View > Extensions (or hit Command+Shift+X or Control+Shift+X) +- Search for `Pierre Theme` +- Click install + +You can also install or download from the [Open VSX registry](https://open-vsx.org/extension/pierrecomputer/pierre-theme). ## Vibrant themes (Display P3) > [!NOTE] -> Vibrant themes do not work in VS Code at this time as it does not support color formats other than Hex or RGB. You can, however, use these with [Diffs](https://diffs.com) or any [Shiki](https://shiki.style) project to render code. +> Vibrant themes do not work in VS Code or Cursor at this time as it does not support color formats other than Hex or RGB. You can, however, use these with [Diffs](https://diffs.com) or any [Shiki](https://shiki.style) project to render code. The **Vibrant** theme variants use CSS's `color(display-p3 r g b)` format with enhanced saturation to fully utilize Display P3's wider color gamut. Display P3 can represent ~25% more colors than standard sRGB, and these themes are optimized to take full advantage of that on compatible displays. @@ -26,11 +44,11 @@ To override this (or any other) theme in your personal config file, please follo ## Contribute -1. Clone and open this [repo](https://github.com/pierrecomputer/pierre-vscode-theme) in VS Code -2. Run `yarn` to install the dependencies. +1. Clone and open this [repo](https://github.com/pierrecomputer/theme) in your editor +2. Run `npm install` to install the dependencies. 3. Press `F5` to open a new window with your extension loaded 4. Open `Code > Preferences > Color Theme` [`⌘k ⌘t`] and pick the "Pierre…" theme you want to test. -5. Make changes to the [`/src/theme.ts`](https://github.com/pierrecomputer/pierre-vscode-theme/blob/main/src/theme.ts) file. +5. Make changes to the [`/src/theme.ts`](https://github.com/pierrecomputer/theme/blob/main/src/theme.ts) file. 6. Run `npm run build` to update the theme. You can also run `npm run start` instead to automatically rebuild the theme while making changes and no reloading should be necessary. 7. Run `npm test` to validate your changes (this runs automatically on PRs). 8. Once you're happy, commit your changes and open a PR. @@ -46,4 +64,4 @@ To override this (or any other) theme in your personal config file, please follo ## Credit -This theme was built on top of [GitHub's VS Code Theme](https://github.com/primer/github-vscode-theme). All credit to them for the technique and build tooling, which we've since iterated on for more specific language tokens. +This theme was built on top of [GitHub's Visual Studio Code Theme](https://github.com/primer/github-vscode-theme). All credit to them for the technique and build tooling, which we've since iterated on for more specific language tokens. diff --git a/package-lock.json b/package-lock.json index 9f235aa..d93c142 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { - "name": "pierre-vscode-theme", - "version": "0.0.17", + "name": "@pierre/theme", + "version": "0.0.19", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "pierre-vscode-theme", - "version": "0.0.17", + "name": "@pierre/theme", + "version": "0.0.19", "license": "MIT", "devDependencies": { "@vscode/vsce": "^3.2.2", diff --git a/package.json b/package.json index 3ec9d09..b1b67d4 100644 --- a/package.json +++ b/package.json @@ -1,9 +1,9 @@ { - "name": "pierre-vscode-theme", + "name": "@pierre/theme", "displayName": "Pierre Theme", "description": "Pierre theme for Shiki, VS Code, and more", - "version": "0.0.17", - "publisher": "pierre-computer-co", + "version": "0.0.19", + "publisher": "pierrecomputer", "icon": "icon.png", "galleryBanner": { "color": "#141415", @@ -12,10 +12,10 @@ "license": "MIT", "repository": { "type": "git", - "url": "https://github.com/pierrecomputer/pierre-vscode-theme" + "url": "https://github.com/pierrecomputer/theme" }, "bugs": { - "url": "https://github.com/pierrecomputer/pierre-vscode-theme/issues" + "url": "https://github.com/pierrecomputer/theme/issues" }, "engines": { "vscode": "^1.0.0" @@ -47,7 +47,7 @@ "build": "ts-node src/build.ts", "test": "npm run build && ts-node src/test.ts", "start": "nodemon --watch src --ext ts --exec npm run build", - "package": "vsce package" + "package": "ts-node src/package-vsix.ts" }, "devDependencies": { "nodemon": "^3.1.11", diff --git a/src/package-vsix.ts b/src/package-vsix.ts new file mode 100644 index 0000000..5596344 --- /dev/null +++ b/src/package-vsix.ts @@ -0,0 +1,22 @@ +import { readFileSync, writeFileSync } from "fs"; +import { execSync } from "child_process"; +import { join } from "path"; + +const pkgPath = join(__dirname, "..", "package.json"); +const original = readFileSync(pkgPath, "utf-8"); +const pkg = JSON.parse(original); + +// Store original name and swap to unscoped version for VSIX +const originalName = pkg.name; +pkg.name = "pierre-theme"; + +console.log(`Temporarily renaming package: ${originalName} → ${pkg.name}\n`); + +try { + writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + "\n"); + execSync("vsce package", { stdio: "inherit", cwd: join(__dirname, "..") }); +} finally { + // Always restore original package.json + writeFileSync(pkgPath, original); + console.log(`\nRestored package name: ${originalName}`); +}