├── .gitattributes ├── .github └── workflows │ └── build.yml ├── .gitignore ├── .vscode ├── launch.json └── tasks.json ├── LICENSE ├── Makefile ├── MinimalWebView.csproj ├── MinimalWebView.sln ├── NativeMethods.txt ├── Program.cs ├── README.md ├── UiThreadSynchronizationContext.cs ├── app.manifest ├── dotnet-releaser.toml └── wwwroot ├── index.html ├── tailwind-input.css └── tailwind.css /.gitattributes: -------------------------------------------------------------------------------- 1 | ############################################################################### 2 | # Set default behavior to automatically normalize line endings. 3 | ############################################################################### 4 | * text=auto 5 | 6 | # exclude demo html+CSS from GitHub stats 7 | wwwroot/* linguist-vendored 8 | 9 | ############################################################################### 10 | # Set default behavior for command prompt diff. 11 | # 12 | # This is need for earlier builds of msysgit that does not have it on by 13 | # default for csharp files. 14 | # Note: This is only used by command line 15 | ############################################################################### 16 | #*.cs diff=csharp 17 | 18 | ############################################################################### 19 | # Set the merge driver for project and solution files 20 | # 21 | # Merging from the command prompt will add diff markers to the files if there 22 | # are conflicts (Merging from VS is not affected by the settings below, in VS 23 | # the diff markers are never inserted). Diff markers may cause the following 24 | # file extensions to fail to load in VS. An alternative would be to treat 25 | # these files as binary and thus will always conflict and require user 26 | # intervention with every merge. To do so, just uncomment the entries below 27 | ############################################################################### 28 | #*.sln merge=binary 29 | #*.csproj merge=binary 30 | #*.vbproj merge=binary 31 | #*.vcxproj merge=binary 32 | #*.vcproj merge=binary 33 | #*.dbproj merge=binary 34 | #*.fsproj merge=binary 35 | #*.lsproj merge=binary 36 | #*.wixproj merge=binary 37 | #*.modelproj merge=binary 38 | #*.sqlproj merge=binary 39 | #*.wwaproj merge=binary 40 | 41 | ############################################################################### 42 | # behavior for image files 43 | # 44 | # image files are treated as binary by default. 45 | ############################################################################### 46 | #*.jpg binary 47 | #*.png binary 48 | #*.gif binary 49 | 50 | ############################################################################### 51 | # diff behavior for common document formats 52 | # 53 | # Convert binary document formats to text before diffing them. This feature 54 | # is only available from the command line. Turn it on by uncommenting the 55 | # entries below. 56 | ############################################################################### 57 | #*.doc diff=astextplain 58 | #*.DOC diff=astextplain 59 | #*.docx diff=astextplain 60 | #*.DOCX diff=astextplain 61 | #*.dot diff=astextplain 62 | #*.DOT diff=astextplain 63 | #*.pdf diff=astextplain 64 | #*.PDF diff=astextplain 65 | #*.rtf diff=astextplain 66 | #*.RTF diff=astextplain 67 | -------------------------------------------------------------------------------- /.github/workflows/build.yml: -------------------------------------------------------------------------------- 1 | name: build 2 | 3 | on: 4 | push: 5 | pull_request: 6 | branches: [ main ] 7 | paths: 8 | - '**.cs' 9 | - '**.csproj' 10 | - '**.sln' 11 | 12 | env: 13 | DOTNET_VERSION: '6.0.x' # The .NET SDK version to use 14 | 15 | jobs: 16 | build: 17 | 18 | name: build-${{matrix.os}} 19 | runs-on: ${{ matrix.os }} 20 | strategy: 21 | matrix: 22 | os: [ubuntu-latest, windows-latest] 23 | 24 | steps: 25 | - uses: actions/checkout@v2 26 | - name: Setup .NET Core 27 | uses: actions/setup-dotnet@v1 28 | with: 29 | dotnet-version: ${{ env.DOTNET_VERSION }} 30 | include-prerelease: true 31 | 32 | - name: Install dependencies 33 | run: dotnet restore 34 | 35 | - name: Build 36 | run: dotnet build --configuration Release --no-restore 37 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | ## Ignore Visual Studio temporary files, build results, and 2 | ## files generated by popular Visual Studio add-ons. 3 | ## 4 | ## Get latest from https://github.com/github/gitignore/blob/master/VisualStudio.gitignore 5 | 6 | # User-specific files 7 | *.rsuser 8 | *.suo 9 | *.user 10 | *.userosscache 11 | *.sln.docstates 12 | 13 | # User-specific files (MonoDevelop/Xamarin Studio) 14 | *.userprefs 15 | 16 | # Mono auto generated files 17 | mono_crash.* 18 | 19 | # Build results 20 | [Dd]ebug/ 21 | [Dd]ebugPublic/ 22 | [Rr]elease/ 23 | [Rr]eleases/ 24 | x64/ 25 | x86/ 26 | [Ww][Ii][Nn]32/ 27 | [Aa][Rr][Mm]/ 28 | [Aa][Rr][Mm]64/ 29 | bld/ 30 | [Bb]in/ 31 | [Oo]bj/ 32 | [Oo]ut/ 33 | [Ll]og/ 34 | [Ll]ogs/ 35 | 36 | # Visual Studio 2015/2017 cache/options directory 37 | .vs/ 38 | # Uncomment if you have tasks that create the project's static files in wwwroot 39 | #wwwroot/ 40 | 41 | # Visual Studio 2017 auto generated files 42 | Generated\ Files/ 43 | 44 | # MSTest test Results 45 | [Tt]est[Rr]esult*/ 46 | [Bb]uild[Ll]og.* 47 | 48 | # NUnit 49 | *.VisualState.xml 50 | TestResult.xml 51 | nunit-*.xml 52 | 53 | # Build Results of an ATL Project 54 | [Dd]ebugPS/ 55 | [Rr]eleasePS/ 56 | dlldata.c 57 | 58 | # Benchmark Results 59 | BenchmarkDotNet.Artifacts/ 60 | 61 | # .NET Core 62 | project.lock.json 63 | project.fragment.lock.json 64 | artifacts/ 65 | 66 | # ASP.NET Scaffolding 67 | ScaffoldingReadMe.txt 68 | 69 | # StyleCop 70 | StyleCopReport.xml 71 | 72 | # Files built by Visual Studio 73 | *_i.c 74 | *_p.c 75 | *_h.h 76 | *.ilk 77 | *.meta 78 | *.obj 79 | *.iobj 80 | *.pch 81 | *.pdb 82 | *.ipdb 83 | *.pgc 84 | *.pgd 85 | *.rsp 86 | *.sbr 87 | *.tlb 88 | *.tli 89 | *.tlh 90 | *.tmp 91 | *.tmp_proj 92 | *_wpftmp.csproj 93 | *.log 94 | *.vspscc 95 | *.vssscc 96 | .builds 97 | *.pidb 98 | *.svclog 99 | *.scc 100 | 101 | # Chutzpah Test files 102 | _Chutzpah* 103 | 104 | # Visual C++ cache files 105 | ipch/ 106 | *.aps 107 | *.ncb 108 | *.opendb 109 | *.opensdf 110 | *.sdf 111 | *.cachefile 112 | *.VC.db 113 | *.VC.VC.opendb 114 | 115 | # Visual Studio profiler 116 | *.psess 117 | *.vsp 118 | *.vspx 119 | *.sap 120 | 121 | # Visual Studio Trace Files 122 | *.e2e 123 | 124 | # TFS 2012 Local Workspace 125 | $tf/ 126 | 127 | # Guidance Automation Toolkit 128 | *.gpState 129 | 130 | # ReSharper is a .NET coding add-in 131 | _ReSharper*/ 132 | *.[Rr]e[Ss]harper 133 | *.DotSettings.user 134 | 135 | # TeamCity is a build add-in 136 | _TeamCity* 137 | 138 | # DotCover is a Code Coverage Tool 139 | *.dotCover 140 | 141 | # AxoCover is a Code Coverage Tool 142 | .axoCover/* 143 | !.axoCover/settings.json 144 | 145 | # Coverlet is a free, cross platform Code Coverage Tool 146 | coverage*.json 147 | coverage*.xml 148 | coverage*.info 149 | 150 | # Visual Studio code coverage results 151 | *.coverage 152 | *.coveragexml 153 | 154 | # NCrunch 155 | _NCrunch_* 156 | .*crunch*.local.xml 157 | nCrunchTemp_* 158 | 159 | # MightyMoose 160 | *.mm.* 161 | AutoTest.Net/ 162 | 163 | # Web workbench (sass) 164 | .sass-cache/ 165 | 166 | # Installshield output folder 167 | [Ee]xpress/ 168 | 169 | # DocProject is a documentation generator add-in 170 | DocProject/buildhelp/ 171 | DocProject/Help/*.HxT 172 | DocProject/Help/*.HxC 173 | DocProject/Help/*.hhc 174 | DocProject/Help/*.hhk 175 | DocProject/Help/*.hhp 176 | DocProject/Help/Html2 177 | DocProject/Help/html 178 | 179 | # Click-Once directory 180 | publish/ 181 | 182 | # Publish Web Output 183 | *.[Pp]ublish.xml 184 | *.azurePubxml 185 | # Note: Comment the next line if you want to checkin your web deploy settings, 186 | # but database connection strings (with potential passwords) will be unencrypted 187 | #*.pubxml 188 | *.publishproj 189 | 190 | # Microsoft Azure Web App publish settings. Comment the next line if you want to 191 | # checkin your Azure Web App publish settings, but sensitive information contained 192 | # in these scripts will be unencrypted 193 | PublishScripts/ 194 | 195 | # NuGet Packages 196 | *.nupkg 197 | # NuGet Symbol Packages 198 | *.snupkg 199 | # The packages folder can be ignored because of Package Restore 200 | **/[Pp]ackages/* 201 | # except build/, which is used as an MSBuild target. 202 | !**/[Pp]ackages/build/ 203 | # Uncomment if necessary however generally it will be regenerated when needed 204 | #!**/[Pp]ackages/repositories.config 205 | # NuGet v3's project.json files produces more ignorable files 206 | *.nuget.props 207 | *.nuget.targets 208 | 209 | # Microsoft Azure Build Output 210 | csx/ 211 | *.build.csdef 212 | 213 | # Microsoft Azure Emulator 214 | ecf/ 215 | rcf/ 216 | 217 | # Windows Store app package directories and files 218 | AppPackages/ 219 | BundleArtifacts/ 220 | Package.StoreAssociation.xml 221 | _pkginfo.txt 222 | *.appx 223 | *.appxbundle 224 | *.appxupload 225 | 226 | # Visual Studio cache files 227 | # files ending in .cache can be ignored 228 | *.[Cc]ache 229 | # but keep track of directories ending in .cache 230 | !?*.[Cc]ache/ 231 | 232 | # Others 233 | ClientBin/ 234 | ~$* 235 | *~ 236 | *.dbmdl 237 | *.dbproj.schemaview 238 | *.jfm 239 | *.pfx 240 | *.publishsettings 241 | orleans.codegen.cs 242 | 243 | # Including strong name files can present a security risk 244 | # (https://github.com/github/gitignore/pull/2483#issue-259490424) 245 | #*.snk 246 | 247 | # Since there are multiple workflows, uncomment next line to ignore bower_components 248 | # (https://github.com/github/gitignore/pull/1529#issuecomment-104372622) 249 | #bower_components/ 250 | 251 | # RIA/Silverlight projects 252 | Generated_Code/ 253 | 254 | # Backup & report files from converting an old project file 255 | # to a newer Visual Studio version. Backup files are not needed, 256 | # because we have git ;-) 257 | _UpgradeReport_Files/ 258 | Backup*/ 259 | UpgradeLog*.XML 260 | UpgradeLog*.htm 261 | ServiceFabricBackup/ 262 | *.rptproj.bak 263 | 264 | # SQL Server files 265 | *.mdf 266 | *.ldf 267 | *.ndf 268 | 269 | # Business Intelligence projects 270 | *.rdl.data 271 | *.bim.layout 272 | *.bim_*.settings 273 | *.rptproj.rsuser 274 | *- [Bb]ackup.rdl 275 | *- [Bb]ackup ([0-9]).rdl 276 | *- [Bb]ackup ([0-9][0-9]).rdl 277 | 278 | # Microsoft Fakes 279 | FakesAssemblies/ 280 | 281 | # GhostDoc plugin setting file 282 | *.GhostDoc.xml 283 | 284 | # Node.js Tools for Visual Studio 285 | .ntvs_analysis.dat 286 | node_modules/ 287 | 288 | # Visual Studio 6 build log 289 | *.plg 290 | 291 | # Visual Studio 6 workspace options file 292 | *.opt 293 | 294 | # Visual Studio 6 auto-generated workspace file (contains which files were open etc.) 295 | *.vbw 296 | 297 | # Visual Studio LightSwitch build output 298 | **/*.HTMLClient/GeneratedArtifacts 299 | **/*.DesktopClient/GeneratedArtifacts 300 | **/*.DesktopClient/ModelManifest.xml 301 | **/*.Server/GeneratedArtifacts 302 | **/*.Server/ModelManifest.xml 303 | _Pvt_Extensions 304 | 305 | # Paket dependency manager 306 | .paket/paket.exe 307 | paket-files/ 308 | 309 | # FAKE - F# Make 310 | .fake/ 311 | 312 | # CodeRush personal settings 313 | .cr/personal 314 | 315 | # Python Tools for Visual Studio (PTVS) 316 | __pycache__/ 317 | *.pyc 318 | 319 | # Cake - Uncomment if you are using it 320 | # tools/** 321 | # !tools/packages.config 322 | 323 | # Tabs Studio 324 | *.tss 325 | 326 | # Telerik's JustMock configuration file 327 | *.jmconfig 328 | 329 | # BizTalk build output 330 | *.btp.cs 331 | *.btm.cs 332 | *.odx.cs 333 | *.xsd.cs 334 | 335 | # OpenCover UI analysis results 336 | OpenCover/ 337 | 338 | # Azure Stream Analytics local run output 339 | ASALocalRun/ 340 | 341 | # MSBuild Binary and Structured Log 342 | *.binlog 343 | 344 | # NVidia Nsight GPU debugger configuration file 345 | *.nvuser 346 | 347 | # MFractors (Xamarin productivity tool) working folder 348 | .mfractor/ 349 | 350 | # Local History for Visual Studio 351 | .localhistory/ 352 | 353 | # BeatPulse healthcheck temp database 354 | healthchecksdb 355 | 356 | # Backup folder for Package Reference Convert tool in Visual Studio 2017 357 | MigrationBackup/ 358 | 359 | # Ionide (cross platform F# VS Code tools) working folder 360 | .ionide/ 361 | 362 | # Fody - auto-generated XML schema 363 | FodyWeavers.xsd 364 | 365 | # dotnet-releaser artifacts 366 | artifacts-dotnet-releaser/ 367 | -------------------------------------------------------------------------------- /.vscode/launch.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "0.2.0", 3 | "configurations": [ 4 | { 5 | // Use IntelliSense to find out which attributes exist for C# debugging 6 | // Use hover for the description of the existing attributes 7 | // For further information visit https://github.com/OmniSharp/omnisharp-vscode/blob/master/debugger-launchjson.md 8 | "name": ".NET Core Launch (console)", 9 | "type": "coreclr", 10 | "request": "launch", 11 | "preLaunchTask": "build", 12 | // If you have changed target frameworks, make sure to update the program path. 13 | "program": "${workspaceFolder}/bin/Debug/net6.0-windows/MinimalWebView.dll", 14 | "args": [], 15 | "cwd": "${workspaceFolder}", 16 | // For more information about the 'console' field, see https://aka.ms/VSCode-CS-LaunchJson-Console 17 | "console": "internalConsole", 18 | "stopAtEntry": false 19 | }, 20 | { 21 | "name": ".NET Core Attach", 22 | "type": "coreclr", 23 | "request": "attach" 24 | } 25 | ] 26 | } -------------------------------------------------------------------------------- /.vscode/tasks.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "2.0.0", 3 | "tasks": [ 4 | { 5 | "label": "build", 6 | "command": "dotnet", 7 | "type": "process", 8 | "args": [ 9 | "build", 10 | "${workspaceFolder}/MinimalWebView.csproj", 11 | "/property:GenerateFullPaths=true", 12 | "/consoleloggerparameters:NoSummary" 13 | ], 14 | "problemMatcher": "$msCompile" 15 | }, 16 | { 17 | "label": "publish", 18 | "command": "dotnet", 19 | "type": "process", 20 | "args": [ 21 | "publish", 22 | "${workspaceFolder}/MinimalWebView.csproj", 23 | "/property:GenerateFullPaths=true", 24 | "/consoleloggerparameters:NoSummary" 25 | ], 26 | "problemMatcher": "$msCompile" 27 | }, 28 | { 29 | "label": "watch", 30 | "command": "dotnet", 31 | "type": "process", 32 | "args": [ 33 | "watch", 34 | "run", 35 | "--project", 36 | "${workspaceFolder}/MinimalWebView.csproj" 37 | ], 38 | "problemMatcher": "$msCompile" 39 | } 40 | ] 41 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 Reilly Wood 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /Makefile: -------------------------------------------------------------------------------- 1 | # Currently hardcodes to x64, later can try these answers to detect ARM: 2 | # https://stackoverflow.com/questions/4058840/makefile-that-distinguishes-between-windows-and-unix-like-systems 3 | 4 | build: 5 | dotnet publish --configuration Release --runtime win-x64 --self-contained true -p:PublishSingleFile=true -p:IncludeNativeLibrariesForSelfExtract=true -p:DebugType=embedded --output publish/ 6 | -------------------------------------------------------------------------------- /MinimalWebView.csproj: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | WinExe 6 | net6.0-windows 7 | app.manifest 8 | true 9 | 0.4.4 10 | A tiny .NET 6 Windows application that hosts web UI in WebView2 11 | MIT 12 | 13 | 14 | 15 | 16 | 17 | all 18 | runtime; build; native; contentfiles; analyzers; buildtransitive 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | PreserveNewest 29 | 30 | 31 | PreserveNewest 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /MinimalWebView.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio Version 17 4 | VisualStudioVersion = 17.0.31521.260 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "MinimalWebView", "MinimalWebView.csproj", "{43FA1E68-30C5-4956-9C84-6BABA20EEA83}" 7 | EndProject 8 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution Items", "{D81AED21-103F-4310-A4C7-EC2A1437A697}" 9 | ProjectSection(SolutionItems) = preProject 10 | README.md = README.md 11 | EndProjectSection 12 | EndProject 13 | Global 14 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 15 | Debug|Any CPU = Debug|Any CPU 16 | Release|Any CPU = Release|Any CPU 17 | EndGlobalSection 18 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 19 | {43FA1E68-30C5-4956-9C84-6BABA20EEA83}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 20 | {43FA1E68-30C5-4956-9C84-6BABA20EEA83}.Debug|Any CPU.Build.0 = Debug|Any CPU 21 | {43FA1E68-30C5-4956-9C84-6BABA20EEA83}.Release|Any CPU.ActiveCfg = Release|Any CPU 22 | {43FA1E68-30C5-4956-9C84-6BABA20EEA83}.Release|Any CPU.Build.0 = Release|Any CPU 23 | EndGlobalSection 24 | GlobalSection(SolutionProperties) = preSolution 25 | HideSolutionNode = FALSE 26 | EndGlobalSection 27 | GlobalSection(ExtensibilityGlobals) = postSolution 28 | SolutionGuid = {0E01EB95-8119-43B3-B8C7-F0355951BA64} 29 | EndGlobalSection 30 | EndGlobal 31 | -------------------------------------------------------------------------------- /NativeMethods.txt: -------------------------------------------------------------------------------- 1 | // This file configures CsWin32 and tells it which bindings to generate 2 | // https://github.com/microsoft/CsWin32 3 | 4 | RegisterClass 5 | CreateWindowEx 6 | ShowWindow 7 | 8 | GetMessage 9 | SendMessage 10 | PostMessage 11 | DispatchMessage 12 | TranslateMessage 13 | DefWindowProc 14 | PostQuitMessage 15 | 16 | GetModuleHandle 17 | GetClientRect 18 | CreateSolidBrush 19 | CW_USEDEFAULT 20 | SYS_COLOR_INDEX 21 | 22 | WM_SIZE 23 | WM_CLOSE 24 | WM_USER 25 | 26 | AllocConsole 27 | 28 | MessageBox -------------------------------------------------------------------------------- /Program.cs: -------------------------------------------------------------------------------- 1 | using System.Drawing; 2 | using System.Reflection; 3 | using Microsoft.Web.WebView2.Core; 4 | using Windows.Win32; 5 | using Windows.Win32.Foundation; 6 | using Windows.Win32.Graphics.Gdi; 7 | using Windows.Win32.UI.WindowsAndMessaging; 8 | 9 | namespace MinimalWebView; 10 | 11 | class Program 12 | { 13 | internal const uint WM_SYNCHRONIZATIONCONTEXT_WORK_AVAILABLE = PInvoke.WM_USER + 1; 14 | private const string StaticFileDirectory = "wwwroot"; 15 | private static CoreWebView2Controller _controller; 16 | private static UiThreadSynchronizationContext _uiThreadSyncCtx; 17 | 18 | [STAThread] 19 | static int Main(string[] args) 20 | { 21 | #if DEBUG // By default GUI apps have no console. Open one to enable Console.WriteLine debugging 🤠 22 | PInvoke.AllocConsole(); 23 | #endif 24 | HWND hwnd; 25 | 26 | unsafe 27 | { 28 | HINSTANCE hInstance = PInvoke.GetModuleHandle((char*)null); 29 | ushort classId; 30 | 31 | HBRUSH backgroundBrush = PInvoke.CreateSolidBrush(0x271811); // this is actually #111827, Windows uses BBGGRR 32 | if (backgroundBrush.IsNull) 33 | { 34 | // fallback to the system background color in case it fails 35 | backgroundBrush = (HBRUSH)(IntPtr)(SYS_COLOR_INDEX.COLOR_BACKGROUND + 1); 36 | } 37 | 38 | fixed (char* classNamePtr = "MinimalWebView") 39 | { 40 | WNDCLASSW wc = new() 41 | { 42 | lpfnWndProc = WndProc, 43 | lpszClassName = classNamePtr, 44 | hInstance = hInstance, 45 | hbrBackground = backgroundBrush, 46 | style = WNDCLASS_STYLES.CS_VREDRAW | WNDCLASS_STYLES.CS_HREDRAW 47 | }; 48 | classId = PInvoke.RegisterClass(wc); 49 | 50 | if (classId == 0) 51 | throw new Exception("class not registered"); 52 | } 53 | 54 | fixed (char* windowNamePtr = $"MinimalWebView {Assembly.GetExecutingAssembly().GetName().Version}") 55 | { 56 | hwnd = PInvoke.CreateWindowEx( 57 | 0, 58 | (char*)classId, 59 | windowNamePtr, 60 | WINDOW_STYLE.WS_OVERLAPPEDWINDOW, 61 | PInvoke.CW_USEDEFAULT, PInvoke.CW_USEDEFAULT, 600, 500, 62 | new HWND(), 63 | new HMENU(), 64 | hInstance, 65 | null); 66 | } 67 | } 68 | 69 | if (hwnd.Value == 0) 70 | throw new Exception("hwnd not created"); 71 | 72 | PInvoke.ShowWindow(hwnd, SHOW_WINDOW_CMD.SW_NORMAL); 73 | 74 | _uiThreadSyncCtx = new UiThreadSynchronizationContext(hwnd); 75 | SynchronizationContext.SetSynchronizationContext(_uiThreadSyncCtx); 76 | 77 | // Start initializing WebView2 in a fire-and-forget manner. Errors will be handled in the initialization function 78 | _ = CreateCoreWebView2Async(hwnd); 79 | 80 | Console.WriteLine("Starting message pump..."); 81 | MSG msg; 82 | while (PInvoke.GetMessage(out msg, new HWND(), 0, 0)) 83 | { 84 | PInvoke.TranslateMessage(msg); 85 | PInvoke.DispatchMessage(msg); 86 | } 87 | 88 | return (int)msg.wParam.Value; 89 | } 90 | 91 | private static LRESULT WndProc(HWND hwnd, uint msg, WPARAM wParam, LPARAM lParam) 92 | { 93 | switch (msg) 94 | { 95 | case PInvoke.WM_SIZE: 96 | OnSize(hwnd, wParam, GetLowWord(lParam.Value), GetHighWord(lParam.Value)); 97 | break; 98 | case WM_SYNCHRONIZATIONCONTEXT_WORK_AVAILABLE: 99 | _uiThreadSyncCtx.RunAvailableWorkOnCurrentThread(); 100 | break; 101 | case PInvoke.WM_CLOSE: 102 | PInvoke.PostQuitMessage(0); 103 | break; 104 | } 105 | 106 | return PInvoke.DefWindowProc(hwnd, msg, wParam, lParam); 107 | } 108 | 109 | private static void OnSize(HWND hwnd, WPARAM wParam, int width, int height) 110 | { 111 | if (_controller != null) 112 | _controller.Bounds = new Rectangle(0, 0, width, height); 113 | } 114 | 115 | private static async Task CreateCoreWebView2Async(HWND hwnd) 116 | { 117 | try 118 | { 119 | Console.WriteLine("Initializing WebView2..."); 120 | var environment = await CoreWebView2Environment.CreateAsync(null, null, null); 121 | _controller = await environment.CreateCoreWebView2ControllerAsync(hwnd); 122 | 123 | _controller.DefaultBackgroundColor = Color.Transparent; // avoids flash of white when page first renders 124 | _controller.CoreWebView2.WebMessageReceived += CoreWebView2_WebMessageReceived; 125 | _controller.CoreWebView2.SetVirtualHostNameToFolderMapping("minimalwebview.example", StaticFileDirectory, CoreWebView2HostResourceAccessKind.Allow); 126 | PInvoke.GetClientRect(hwnd, out var hwndRect); 127 | _controller.Bounds = new Rectangle(0, 0, hwndRect.right, hwndRect.bottom); 128 | _controller.IsVisible = true; 129 | _controller.CoreWebView2.Navigate("https://minimalwebview.example/index.html"); 130 | 131 | Console.WriteLine("WebView2 initialization succeeded."); 132 | } 133 | catch (WebView2RuntimeNotFoundException) 134 | { 135 | var result = PInvoke.MessageBox(hwnd, "WebView2 runtime not installed.", "Error", MESSAGEBOX_STYLE.MB_OK | MESSAGEBOX_STYLE.MB_ICONERROR); 136 | 137 | if (result == MESSAGEBOX_RESULT.IDYES) 138 | { 139 | //TODO: download WV2 bootstrapper from https://go.microsoft.com/fwlink/p/?LinkId=2124703 and run it 140 | } 141 | 142 | Environment.Exit(1); 143 | } 144 | catch (Exception ex) 145 | { 146 | PInvoke.MessageBox(hwnd, $"Failed to initialize WebView2:{Environment.NewLine}{ex}", "Error", MESSAGEBOX_STYLE.MB_OK | MESSAGEBOX_STYLE.MB_ICONERROR); 147 | Environment.Exit(1); 148 | } 149 | } 150 | 151 | private static async void CoreWebView2_WebMessageReceived(object sender, CoreWebView2WebMessageReceivedEventArgs e) 152 | { 153 | var webMessage = e.TryGetWebMessageAsString(); 154 | if (string.IsNullOrEmpty(webMessage)) 155 | return; 156 | 157 | // simulate moving some slow operation to a background thread 158 | await Task.Run(() => Thread.Sleep(200)); 159 | 160 | // this will blow up if not run on the UI thread, so the SynchronizationContext needs to have been wired up correctly 161 | await _controller.CoreWebView2.ExecuteScriptAsync($"alert('Hi from the UI thread! I got a message from the browser: {webMessage}')"); 162 | } 163 | 164 | private static int GetLowWord(nint value) 165 | { 166 | uint xy = (uint)value; 167 | int x = unchecked((short)xy); 168 | return x; 169 | } 170 | 171 | private static int GetHighWord(nint value) 172 | { 173 | uint xy = (uint)value; 174 | int y = unchecked((short)(xy >> 16)); 175 | return y; 176 | } 177 | } 178 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # MinimalWebView 2 | [![build](https://github.com/rgwood/MinimalWebView/actions/workflows/build.yml/badge.svg)](https://github.com/rgwood/MinimalWebView/actions/workflows/build.yml) 3 | 4 | A tiny .NET 6 Windows application that hosts web UI in [WebView2](https://developer.microsoft.com/en-us/microsoft-edge/webview2/). No UI framework, just a plain old Win32 message loop. 5 | 6 | ![image](https://user-images.githubusercontent.com/26268125/139745909-90a75ad0-a9da-4cff-82e1-81538eee45d5.png) 7 | 8 | This is very bare-bones and is mostly useful as an educational example. If you're looking for more functionality, my [MaximalWebView](https://github.com/rgwood/MaximalWebView) builds on top of this. 9 | 10 | ## Motivation 11 | 12 | This is an experiment to see how far I can push a slim Windows application that uses C# for the hosting logic and web UI for the "front-end". 13 | 14 | The native UI situation on Windows is a little bleak and WebView2 ships with Windows 11, so it's a good time to lean into web UI a little more. But... the .NET team has been killing it recently, I'd like to write my code that lives outside Chromium in C# or F#. 15 | 16 | Microsoft provides WinForms and WPF wrappers for WebView2, so I could embed web UI in a plain old .NET GUI app. But WinForms and WPF are *big* dependencies and they're mostly unnecessary for web UI. Why not see how far we can get with an old-school Win32 message pump? 17 | 18 | ## Dependencies 19 | 20 | [Microsoft.Web.WebView2.Core](https://www.nuget.org/packages/Microsoft.Web.WebView2/) to interact with WebView2, and [CsWin32](https://github.com/microsoft/CsWin32) to generate bindings to native Windows APIs (at compile time only). 21 | 22 | ## Known Issues 23 | 24 | The resulting application cannot currently be [trimmed](https://docs.microsoft.com/en-us/dotnet/core/deploying/trimming-options) because of the way Microsoft.Web.WebView2.Core does COM interop. Please upvote [this issue](https://github.com/MicrosoftEdge/WebView2Feedback/issues/1490). 25 | 26 | ## Credits 27 | 28 | Initially derived from Vítězslav Imrýšek's handy [CsWin32Playground]( https://github.com/VitezslavImrysek/CsWin32Playground), where he shows how to create a message pump using CsWin32. 29 | -------------------------------------------------------------------------------- /UiThreadSynchronizationContext.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Concurrent; 2 | using Windows.Win32; 3 | using Windows.Win32.Foundation; 4 | 5 | namespace MinimalWebView; 6 | 7 | // based on this very good Stephen Toub article: https://devblogs.microsoft.com/pfxteam/await-synchronizationcontext-and-console-apps/ 8 | internal sealed class UiThreadSynchronizationContext : SynchronizationContext 9 | { 10 | private readonly BlockingCollection> m_queue = new(); 11 | private readonly HWND hwnd; 12 | 13 | public UiThreadSynchronizationContext(HWND hwnd) : base() 14 | { 15 | this.hwnd = hwnd; 16 | } 17 | 18 | public override void Post(SendOrPostCallback d, object state) 19 | { 20 | m_queue.Add(new KeyValuePair(d, state)); 21 | PInvoke.PostMessage(hwnd, Program.WM_SYNCHRONIZATIONCONTEXT_WORK_AVAILABLE, 0, 0); 22 | } 23 | 24 | public override void Send(SendOrPostCallback d, object state) 25 | { 26 | m_queue.Add(new KeyValuePair(d, state)); 27 | PInvoke.SendMessage(hwnd, Program.WM_SYNCHRONIZATIONCONTEXT_WORK_AVAILABLE, 0, 0); 28 | } 29 | 30 | public void RunAvailableWorkOnCurrentThread() 31 | { 32 | while (m_queue.TryTake(out KeyValuePair workItem)) 33 | workItem.Key(workItem.Value); 34 | } 35 | 36 | public void Complete() { m_queue.CompleteAdding(); } 37 | } 38 | -------------------------------------------------------------------------------- /app.manifest: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 7 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 39 | 40 | 41 | 42 | PerMonitorV2,PerMonitor 43 | 44 | true 45 | true 46 | 47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /dotnet-releaser.toml: -------------------------------------------------------------------------------- 1 | # configuration file for dotnet-releaser 2 | 3 | # disable default settings 4 | profile = "custom" 5 | 6 | [msbuild] 7 | project = "MinimalWebView.csproj" 8 | 9 | [msbuild.properties] 10 | PublishTrimmed = false 11 | PublishSingleFile = true 12 | SelfContained = true 13 | PublishReadyToRun = false 14 | CopyOutputSymbolsToPublishDirectory = false 15 | SkipCopyingSymbolsToOutputDirectory = true 16 | DebugType = "embedded" 17 | IncludeNativeLibrariesForSelfExtract = true 18 | 19 | [github] 20 | user = "rgwood" 21 | repo = "MinimalWebView" 22 | 23 | [changelog] 24 | publish = true 25 | # disable auto-labeling/categorization of commits 26 | defaults = false 27 | 28 | [[changelog.category]] 29 | title = "" 30 | labels = ["any"] 31 | 32 | [[changelog.autolabeler]] 33 | label = "any" 34 | title = '.*' 35 | 36 | [nuget] 37 | publish = false 38 | 39 | [[pack]] 40 | rid = ["win-x64", "win-arm64"] 41 | kinds = ["zip"] 42 | -------------------------------------------------------------------------------- /wwwroot/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Hello, world! 7 | 8 | 9 | 10 | 11 | 12 |

Hello, 🌍!

13 |

This is a tiny .NET 6 Windows application hosting web UI in WebView2. No WinForms, no WPF, no WinUI - just a Win32 message pump.

14 | 15 | 16 | 17 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /wwwroot/tailwind-input.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | @layer components { 5 | 6 | body > * { 7 | @apply mb-3; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /wwwroot/tailwind.css: -------------------------------------------------------------------------------- 1 | /* 2 | ! tailwindcss v3.0.5 | MIT License | https://tailwindcss.com 3 | */ 4 | 5 | /* 6 | 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 7 | 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) 8 | */ 9 | 10 | *, 11 | ::before, 12 | ::after { 13 | box-sizing: border-box; 14 | /* 1 */ 15 | border-width: 0; 16 | /* 2 */ 17 | border-style: solid; 18 | /* 2 */ 19 | border-color: currentColor; 20 | /* 2 */ 21 | } 22 | 23 | ::before, 24 | ::after { 25 | --tw-content: ''; 26 | } 27 | 28 | /* 29 | 1. Use a consistent sensible line-height in all browsers. 30 | 2. Prevent adjustments of font size after orientation changes in iOS. 31 | 3. Use a more readable tab size. 32 | 4. Use the user's configured `sans` font-family by default. 33 | */ 34 | 35 | html { 36 | line-height: 1.5; 37 | /* 1 */ 38 | -webkit-text-size-adjust: 100%; 39 | /* 2 */ 40 | -moz-tab-size: 4; 41 | /* 3 */ 42 | -o-tab-size: 4; 43 | tab-size: 4; 44 | /* 3 */ 45 | font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; 46 | /* 4 */ 47 | } 48 | 49 | /* 50 | 1. Remove the margin in all browsers. 51 | 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. 52 | */ 53 | 54 | body { 55 | margin: 0; 56 | /* 1 */ 57 | line-height: inherit; 58 | /* 2 */ 59 | } 60 | 61 | /* 62 | 1. Add the correct height in Firefox. 63 | 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 64 | 3. Ensure horizontal rules are visible by default. 65 | */ 66 | 67 | hr { 68 | height: 0; 69 | /* 1 */ 70 | color: inherit; 71 | /* 2 */ 72 | border-top-width: 1px; 73 | /* 3 */ 74 | } 75 | 76 | /* 77 | Add the correct text decoration in Chrome, Edge, and Safari. 78 | */ 79 | 80 | abbr[title] { 81 | -webkit-text-decoration: underline dotted; 82 | text-decoration: underline dotted; 83 | } 84 | 85 | /* 86 | Remove the default font size and weight for headings. 87 | */ 88 | 89 | h1, 90 | h2, 91 | h3, 92 | h4, 93 | h5, 94 | h6 { 95 | font-size: inherit; 96 | font-weight: inherit; 97 | } 98 | 99 | /* 100 | Reset links to optimize for opt-in styling instead of opt-out. 101 | */ 102 | 103 | a { 104 | color: inherit; 105 | text-decoration: inherit; 106 | } 107 | 108 | /* 109 | Add the correct font weight in Edge and Safari. 110 | */ 111 | 112 | b, 113 | strong { 114 | font-weight: bolder; 115 | } 116 | 117 | /* 118 | 1. Use the user's configured `mono` font family by default. 119 | 2. Correct the odd `em` font sizing in all browsers. 120 | */ 121 | 122 | code, 123 | kbd, 124 | samp, 125 | pre { 126 | font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 127 | /* 1 */ 128 | font-size: 1em; 129 | /* 2 */ 130 | } 131 | 132 | /* 133 | Add the correct font size in all browsers. 134 | */ 135 | 136 | small { 137 | font-size: 80%; 138 | } 139 | 140 | /* 141 | Prevent `sub` and `sup` elements from affecting the line height in all browsers. 142 | */ 143 | 144 | sub, 145 | sup { 146 | font-size: 75%; 147 | line-height: 0; 148 | position: relative; 149 | vertical-align: baseline; 150 | } 151 | 152 | sub { 153 | bottom: -0.25em; 154 | } 155 | 156 | sup { 157 | top: -0.5em; 158 | } 159 | 160 | /* 161 | 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 162 | 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 163 | 3. Remove gaps between table borders by default. 164 | */ 165 | 166 | table { 167 | text-indent: 0; 168 | /* 1 */ 169 | border-color: inherit; 170 | /* 2 */ 171 | border-collapse: collapse; 172 | /* 3 */ 173 | } 174 | 175 | /* 176 | 1. Change the font styles in all browsers. 177 | 2. Remove the margin in Firefox and Safari. 178 | 3. Remove default padding in all browsers. 179 | */ 180 | 181 | button, 182 | input, 183 | optgroup, 184 | select, 185 | textarea { 186 | font-family: inherit; 187 | /* 1 */ 188 | font-size: 100%; 189 | /* 1 */ 190 | line-height: inherit; 191 | /* 1 */ 192 | color: inherit; 193 | /* 1 */ 194 | margin: 0; 195 | /* 2 */ 196 | padding: 0; 197 | /* 3 */ 198 | } 199 | 200 | /* 201 | Remove the inheritance of text transform in Edge and Firefox. 202 | */ 203 | 204 | button, 205 | select { 206 | text-transform: none; 207 | } 208 | 209 | /* 210 | 1. Correct the inability to style clickable types in iOS and Safari. 211 | 2. Remove default button styles. 212 | */ 213 | 214 | button, 215 | [type='button'], 216 | [type='reset'], 217 | [type='submit'] { 218 | -webkit-appearance: button; 219 | /* 1 */ 220 | background-color: transparent; 221 | /* 2 */ 222 | background-image: none; 223 | /* 2 */ 224 | } 225 | 226 | /* 227 | Use the modern Firefox focus style for all focusable elements. 228 | */ 229 | 230 | :-moz-focusring { 231 | outline: auto; 232 | } 233 | 234 | /* 235 | Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) 236 | */ 237 | 238 | :-moz-ui-invalid { 239 | box-shadow: none; 240 | } 241 | 242 | /* 243 | Add the correct vertical alignment in Chrome and Firefox. 244 | */ 245 | 246 | progress { 247 | vertical-align: baseline; 248 | } 249 | 250 | /* 251 | Correct the cursor style of increment and decrement buttons in Safari. 252 | */ 253 | 254 | ::-webkit-inner-spin-button, 255 | ::-webkit-outer-spin-button { 256 | height: auto; 257 | } 258 | 259 | /* 260 | 1. Correct the odd appearance in Chrome and Safari. 261 | 2. Correct the outline style in Safari. 262 | */ 263 | 264 | [type='search'] { 265 | -webkit-appearance: textfield; 266 | /* 1 */ 267 | outline-offset: -2px; 268 | /* 2 */ 269 | } 270 | 271 | /* 272 | Remove the inner padding in Chrome and Safari on macOS. 273 | */ 274 | 275 | ::-webkit-search-decoration { 276 | -webkit-appearance: none; 277 | } 278 | 279 | /* 280 | 1. Correct the inability to style clickable types in iOS and Safari. 281 | 2. Change font properties to `inherit` in Safari. 282 | */ 283 | 284 | ::-webkit-file-upload-button { 285 | -webkit-appearance: button; 286 | /* 1 */ 287 | font: inherit; 288 | /* 2 */ 289 | } 290 | 291 | /* 292 | Add the correct display in Chrome and Safari. 293 | */ 294 | 295 | summary { 296 | display: list-item; 297 | } 298 | 299 | /* 300 | Removes the default spacing and border for appropriate elements. 301 | */ 302 | 303 | blockquote, 304 | dl, 305 | dd, 306 | h1, 307 | h2, 308 | h3, 309 | h4, 310 | h5, 311 | h6, 312 | hr, 313 | figure, 314 | p, 315 | pre { 316 | margin: 0; 317 | } 318 | 319 | fieldset { 320 | margin: 0; 321 | padding: 0; 322 | } 323 | 324 | legend { 325 | padding: 0; 326 | } 327 | 328 | ol, 329 | ul, 330 | menu { 331 | list-style: none; 332 | margin: 0; 333 | padding: 0; 334 | } 335 | 336 | /* 337 | Prevent resizing textareas horizontally by default. 338 | */ 339 | 340 | textarea { 341 | resize: vertical; 342 | } 343 | 344 | /* 345 | 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 346 | 2. Set the default placeholder color to the user's configured gray 400 color. 347 | */ 348 | 349 | input::-moz-placeholder, textarea::-moz-placeholder { 350 | opacity: 1; 351 | /* 1 */ 352 | color: #9ca3af; 353 | /* 2 */ 354 | } 355 | 356 | input:-ms-input-placeholder, textarea:-ms-input-placeholder { 357 | opacity: 1; 358 | /* 1 */ 359 | color: #9ca3af; 360 | /* 2 */ 361 | } 362 | 363 | input::placeholder, 364 | textarea::placeholder { 365 | opacity: 1; 366 | /* 1 */ 367 | color: #9ca3af; 368 | /* 2 */ 369 | } 370 | 371 | /* 372 | Set the default cursor for buttons. 373 | */ 374 | 375 | button, 376 | [role="button"] { 377 | cursor: pointer; 378 | } 379 | 380 | /* 381 | Make sure disabled buttons don't get the pointer cursor. 382 | */ 383 | 384 | :disabled { 385 | cursor: default; 386 | } 387 | 388 | /* 389 | 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 390 | 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) 391 | This can trigger a poorly considered lint error in some tools but is included by design. 392 | */ 393 | 394 | img, 395 | svg, 396 | video, 397 | canvas, 398 | audio, 399 | iframe, 400 | embed, 401 | object { 402 | display: block; 403 | /* 1 */ 404 | vertical-align: middle; 405 | /* 2 */ 406 | } 407 | 408 | /* 409 | Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) 410 | */ 411 | 412 | img, 413 | video { 414 | max-width: 100%; 415 | height: auto; 416 | } 417 | 418 | /* 419 | Ensure the default browser behavior of the `hidden` attribute. 420 | */ 421 | 422 | [hidden] { 423 | display: none; 424 | } 425 | 426 | body > * { 427 | margin-bottom: 0.75rem; 428 | } 429 | 430 | .mb-5 { 431 | margin-bottom: 1.25rem; 432 | } 433 | 434 | .self-center { 435 | align-self: center; 436 | } 437 | 438 | .rounded-md { 439 | border-radius: 0.375rem; 440 | } 441 | 442 | .bg-gray-900 { 443 | --tw-bg-opacity: 1; 444 | background-color: rgb(17 24 39 / var(--tw-bg-opacity)); 445 | } 446 | 447 | .bg-indigo-600 { 448 | --tw-bg-opacity: 1; 449 | background-color: rgb(79 70 229 / var(--tw-bg-opacity)); 450 | } 451 | 452 | .p-5 { 453 | padding: 1.25rem; 454 | } 455 | 456 | .py-1 { 457 | padding-top: 0.25rem; 458 | padding-bottom: 0.25rem; 459 | } 460 | 461 | .px-4 { 462 | padding-left: 1rem; 463 | padding-right: 1rem; 464 | } 465 | 466 | .font-mono { 467 | font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 468 | } 469 | 470 | .text-5xl { 471 | font-size: 3rem; 472 | line-height: 1; 473 | } 474 | 475 | .font-bold { 476 | font-weight: 700; 477 | } 478 | 479 | .text-indigo-200 { 480 | --tw-text-opacity: 1; 481 | color: rgb(199 210 254 / var(--tw-text-opacity)); 482 | } 483 | 484 | .text-indigo-400 { 485 | --tw-text-opacity: 1; 486 | color: rgb(129 140 248 / var(--tw-text-opacity)); 487 | } 488 | 489 | .text-white { 490 | --tw-text-opacity: 1; 491 | color: rgb(255 255 255 / var(--tw-text-opacity)); 492 | } 493 | 494 | .hover\:bg-indigo-800:hover { 495 | --tw-bg-opacity: 1; 496 | background-color: rgb(55 48 163 / var(--tw-bg-opacity)); 497 | } --------------------------------------------------------------------------------