Quick patch to CSS generation (#10)

* fix css issue

* add changeset

* add deployment linker

.changeset/lemon-fans-join.md

@@ -0,0 +1,5 @@
+---
+"expressive-code-twoslash": patch
+---
+
+fix small css issue

.github/workflows/deployments.yml

@@ -0,0 +1,26 @@
+name: Deployments
+
+on: 
+  pull_request:
+    types: [opened, reopened]
+
+permissions:
+  pull-requests: write
+
+jobs:
+  deploymentmessage:
+    name: Send deployment links
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deployment Queued Comment
+        uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: `Thank you for submitting your Pull Request, the following links will become available for preview shortly:\n
+              - [`expressive-code-twoslash` Docs](https://${context.payload.pull_request.number}-twoslash.matthiesen.dev)
+            })

packages/twoslash/src/styles.ts

@@ -60,10 +60,16 @@ export const twoSlashStyleSettings = new PluginStyleSettings({
 			cursorColor: ({ theme }) => theme.colors["editorCursor.foreground"],
 			completionBoxBackground: ({ theme }) =>
 				theme.colors["editorSuggestWidget.background"] ||
-				theme.colors["twoSlash.background"],
+				theme.colors["editor.background"] ||
+				theme.bg,
 			completionBoxBorder: ({ theme }) =>
 				theme.colors["editorSuggestWidget.border"] ||
-				theme.colors["twoslash.borderColor"],
+				theme.colors["titleBar.border"] ||
+				lighten(
+					theme.colors["editor.background"],
+					theme.type === "dark" ? 0.5 : -0.15,
+				) ||
+				"transparent",
 			completionBoxColor: ({ theme }) =>
 				theme.colors["editorSuggestWidget.foreground"] ||
 				theme.colors["editor.foreground"] ||

playground/astro.config.mts

@@ -8,6 +8,7 @@ export default defineConfig({
 		starlight({
 			title: "Starlight",
 			expressiveCode: {
+				themes: ['github-dark-dimmed'],
 				plugins: [ectwoslash()],
 			},
 		}),