优化 cm-lintPoint 样式

适配 Vite v8.2

Author: wherewhere

SharpScript/SharpScript.csproj

@@ -16,8 +16,8 @@
     <PackageReference Include="ILAssembler" Version="11.0.0-build.8.1" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.10" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.10" PrivateAssets="all" />
-    <PackageReference Include="Microsoft.CodeAnalysis.CSharp.Features" Version="5.11.0-1.26379.13" />
-    <PackageReference Include="Microsoft.CodeAnalysis.VisualBasic.Features" Version="5.11.0-1.26379.13" />
+    <PackageReference Include="Microsoft.CodeAnalysis.CSharp.Features" Version="5.11.0-1.26380.4" />
+    <PackageReference Include="Microsoft.CodeAnalysis.VisualBasic.Features" Version="5.11.0-1.26380.4" />
     <PackageReference Include="Mobius.ILasm" Version="0.1.0" />
     <PackageReference Include="System.Security.Permissions" Version="10.0.10" />
   </ItemGroup>

SharpScript/Site/components/CodeMirror.vue

@@ -305,7 +305,9 @@
         outline: none;
 
         .cm-gutters {
-            transition: $base-transition;
+            border-right-width: 1px;
+            border-right-style: solid;
+            transition: $base-transition, border-color colors.$control-faster-animation-duration ease-in-out;
 
             .cm-gutter-lint {
                 width: 3px;
@@ -543,40 +545,62 @@
             opacity: 0.467;
         }
 
+        .cm-lintRange-hint::after,
+        .cm-lintRange-info::after,
+        .cm-lintPoint::after {
+            border: none;
+            width: 2px;
+            height: 2px;
+            border-radius: 50%;
+            bottom: 0.5px;
+        }
+
+        .cm-lintPoint::after {
+            left: -1px;
+            transition: background-color colors.$control-faster-animation-duration ease-in-out;
+        }
+
         .cm-lintRange-hint,
         .cm-lintRange-info {
             position: relative;
 
             &::after {
-                width: 2px;
-                height: 2px;
-                border-radius: 50%;
                 content: '';
                 position: absolute;
-                bottom: 0.5px;
                 left: 1px;
+                transition: background-color colors.$control-faster-animation-duration ease-in-out,
+                    box-shadow colors.$control-faster-animation-duration ease-in-out;
             }
         }
 
-        .cm-lintRange-hint::after {
-            transition: background-color colors.$control-faster-animation-duration ease-in-out,
-                box-shadow colors.$control-faster-animation-duration ease-in-out;
+        .cm-lintRange-hint:hover::after,
+        .cm-lintRange-info::after,
+        .cm-lintPoint-hint:hover::after,
+        .cm-lintPoint-info::after {
+            background: #a5a5a5;
         }
 
         .cm-lintRange-hint:hover::after,
         .cm-lintRange-info::after {
-            background: #a5a5a5;
             box-shadow: 3.5px 0 0 #a5a5a5;
         }
 
         .cm-lintRange-warning {
             background-image: underline(#008000);
         }
 
+        .cm-lintPoint-warning::after {
+            background: #008000;
+        }
+
         .cm-lintRange-error {
             background-image: underline(#ff0000);
         }
 
+        .cm-lintPoint-error::after {
+            background: #ff0000;
+        }
+
         .cm-searchMatch {
             background-color: rgba(234, 92, 0, 0.33);
         }
@@ -627,7 +651,7 @@
             }
 
             .cm-searchMatch-selected {
-                background-color: #9e6a03;
+                background-color: #9E6A03;
             }
         }
 

SharpScript/Site/components/SplitPanels.vue

@@ -321,6 +321,7 @@
         span.handle {
             border-radius: 1px;
             margin: $sizer-base-padding;
+            transition: border-color colors.$control-faster-animation-duration ease-in-out;
         }
 
         @include theme.auto-theme {

…helpers/dotnet-framework-static-files.ts …elpers/dotnet-framework-static-files.mtsSharpScript/Site/helpers/dotnet-framework-static-files.ts renamed to SharpScript/Site/helpers/dotnet-framework-static-files.mts SharpScript/Site/helpers/dotnet-framework-static-files.ts renamed to SharpScript/Site/helpers/dotnet-framework-static-files.mts

@@ -8,7 +8,7 @@ export default {
     configureServer(server) {
         server.middlewares.use((req, res, next) => {
             if (req.url && req.url.startsWith("/_framework")) {
-                const frameworkRoot = path.resolve(__dirname, "../../bin/Release/net10.0-browser/publish/wwwroot");
+                const frameworkRoot = path.resolve(import.meta.dirname, "../../bin/Release/net10.0-browser/publish/wwwroot");
                 const rawPath = decodeURIComponent(req.url.split('?')[0]);
                 let filePath = path.resolve(frameworkRoot, `.${rawPath}`);
                 fs.stat(filePath, (err, stat) => {

…rpScript/Site/helpers/github-importer.ts …pScript/Site/helpers/github-importer.mtsSharpScript/Site/helpers/github-importer.ts renamed to SharpScript/Site/helpers/github-importer.mts SharpScript/Site/helpers/github-importer.ts renamed to SharpScript/Site/helpers/github-importer.mts

@@ -9,6 +9,7 @@ export const vscodeDark = vscodeDarkInit({
         selectionMatch: "#ADD6FF26",
         gutterForeground: "#6E7681",
         gutterActiveForeground: "#CCCCCC",
+        gutterBorder: "#404040",
         fontFamily: "var(--font-monospace)"
     }
 });
@@ -18,6 +19,7 @@ export const vscodeLight = vscodeLightInit({
         selectionMatch: "#ADD6FF80",
         gutterForeground: "#6E7681",
         gutterActiveForeground: "#171184",
+        gutterBorder: "#D3D3D3",
         fontFamily: "var(--font-monospace)"
     }
 });

SharpScript/Site/helpers/output.ts SharpScript/Site/helpers/output.mtsSharpScript/Site/helpers/output.ts renamed to SharpScript/Site/helpers/output.mts

@@ -2,10 +2,10 @@ import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
 import svgLoader from "vite-svg-loader";
 import simpleHtmlPlugin from "vite-plugin-simple-html";
-import dotnetFrameworkStaticFiles from "./helpers/dotnet-framework-static-files";
-import githubImporter from "./helpers/github-importer";
+import dotnetFrameworkStaticFiles from "./helpers/dotnet-framework-static-files.mts";
+import githubImporter from "./helpers/github-importer.mts";
 import cssnano from "cssnano";
-import getOutputOptions from "./helpers/output";
+import getOutputOptions from "./helpers/output.mts";
 
 export default defineConfig(({ mode }) => {
     return {