jonataswalker · jonataswalker · Jan 5, 2026 · Jan 5, 2026 · Jan 5, 2026
diff --git a/README.md b/README.md
@@ -32,25 +32,23 @@ A `contextmenu` extension for [OpenLayers](http://openlayers.org/). **Requires**
 
 ##### CDN Hosted - [jsDelivr](https://www.jsdelivr.com/package/npm/ol-contextmenu)
 
-Load CSS and Javascript:
+Load Javascript (CSS is bundled):
 
 ```HTML
-<link href="https://cdn.jsdelivr.net/npm/ol-contextmenu@latest/dist/ol-contextmenu.css" rel="stylesheet">
 <script src="https://cdn.jsdelivr.net/npm/ol-contextmenu"></script>
 ```
 
 ##### CDN Hosted - UNPKG
 
-Load CSS and Javascript:
+Load Javascript (CSS is bundled):
 
 ```HTML
-<link href="https://unpkg.com/ol-contextmenu/dist/ol-contextmenu.css" rel="stylesheet">
 <script src="https://unpkg.com/ol-contextmenu"></script>
 ```
 
 ##### Self hosted
 
-Download [latest release](https://github.com/jonataswalker/ol-contextmenu/releases/latest) and (obviously) load CSS and Javascript.
+Download [latest release](https://github.com/jonataswalker/ol-contextmenu/releases/latest) and load Javascript (CSS is bundled).
 
 ##### Instantiate with some options and add the Control
 

diff --git a/examples/contextmenu.html b/examples/contextmenu.html
@@ -4,7 +4,6 @@
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@v8.1.0/ol.css" />
-        <link rel="stylesheet" href="../dist/ol-contextmenu.css" />
         <link rel="stylesheet" href="contextmenu.css" />
     </head>
     <body>

diff --git a/examples/my-project-with-vite/README.md b/examples/my-project-with-vite/README.md
@@ -60,7 +60,7 @@ This example shows:
 - **Type Imports**: How to import TypeScript types from the library
 - **ES6 Modules**: Modern JavaScript module syntax
 - **Vite Bundling**: Fast development and optimized production builds
-- **CSS Imports**: How Vite handles CSS imports (via `style.css`)
+- **CSS Bundling**: CSS is automatically bundled into the JavaScript (no separate CSS import needed)
 - **Multi-level Nested Submenus**: Creating complex menu structures
 - **Default Items**: Using built-in Zoom In/Out items
 - **Event Handling**: Type-safe event listeners
@@ -71,7 +71,7 @@ This example shows:
 my-project-with-vite/
 ├── src/
 │   ├── main.ts          # Main application code (TypeScript)
-│   ├── style.css        # Custom styles (includes ol-contextmenu CSS)
+│   ├── style.css        # Custom styles (ol-contextmenu CSS is bundled in JS)
 │   └── vite-env.d.ts    # Vite type definitions
 ├── index.html           # HTML entry point
 ├── tsconfig.json        # TypeScript configuration
@@ -99,15 +99,9 @@ function center(obj: CallbackObject) {
 }
 ```
 
-### CSS Import
+### CSS Bundling
 
-The CSS is imported in `style.css`:
-
-```css
-@import "ol-contextmenu/ol-contextmenu.css";
-```
-
-Vite processes this import automatically.
+CSS is automatically bundled into the JavaScript when you import `ol-contextmenu`. No separate CSS import is needed. The CSS will be automatically injected into the page when the JavaScript loads.
 
 ### Creating Typed Menu Items
 
@@ -150,7 +144,7 @@ Using TypeScript types ensures your menu items are correctly structured.
 
 **Dev server won't start**: Check that all dependencies are installed and the parent package is built.
 
-**CSS not loading**: Ensure `ol-contextmenu` is properly installed and the CSS import path is correct in `style.css`.
+**CSS not loading**: CSS is automatically bundled into the JavaScript. If styles aren't appearing, check the browser console for errors.
 
 **TypeScript errors**: Run `npm run build` to see detailed TypeScript error messages.
 
diff --git a/examples/my-project-with-vite/src/main.ts b/examples/my-project-with-vite/src/main.ts
@@ -30,7 +30,7 @@ import { View, Feature, Map as OlMap } from 'ol'
 import type { Item, SingleItem, CallbackObject, ItemWithNested } from 'ol-contextmenu'
 
 // Import styles - Vite will process CSS imports automatically
-// The ol-contextmenu CSS is imported in style.css
+// Note: ol-contextmenu CSS is now bundled into the JavaScript, no separate import needed
 import './style.css'
 
 // ============================================================================

diff --git a/examples/my-project-with-vite/src/style.css b/examples/my-project-with-vite/src/style.css
@@ -1,5 +1,5 @@
 @import "ol/ol.css";
-@import "ol-contextmenu/ol-contextmenu.css";
+/* Note: ol-contextmenu CSS is now bundled into the JavaScript, no separate import needed */
 
 html,
 body {

diff --git a/examples/my-project-with-webpack/README.md b/examples/my-project-with-webpack/README.md
@@ -51,7 +51,7 @@ This example demonstrates how to integrate `ol-contextmenu` in a project using *
 This example shows:
 
 - **ES6 Module Imports**: How to import `ol-contextmenu` and OpenLayers using ES6 syntax
-- **CSS Imports**: How to import the required CSS file in a Webpack project
+- **CSS Bundling**: CSS is automatically bundled into the JavaScript (no separate CSS import needed)
 - **Multi-level Nested Submenus**: Creating submenus within submenus
 - **Default Items**: Using the `defaultItems` option to include built-in Zoom In/Out items
 - **Event Handling**: Using the `beforeopen` event to intercept menu opening
@@ -76,7 +76,7 @@ my-project-with-webpack/
 
 ```javascript
 import ContextMenu from 'ol-contextmenu'
-import 'ol-contextmenu/ol-contextmenu.css'
+// CSS is automatically bundled into the JavaScript, no separate import needed
 ```
 
 ### Creating Nested Submenus
@@ -116,7 +116,7 @@ contextmenu.on('beforeopen', (evt) => {
 
 **Build fails**: Make sure you've run `npm install` in the parent directory first to build `ol-contextmenu`.
 
-**Menu doesn't appear**: Check the browser console for errors. Make sure the CSS file is being loaded correctly.
+**Menu doesn't appear**: Check the browser console for errors. CSS is automatically injected when the JavaScript loads.
 
 **Icons don't show**: The example uses CDN-hosted icons. If they don't load, check your internet connection or replace with local icon files.
 
diff --git a/examples/my-project-with-webpack/src/index.js b/examples/my-project-with-webpack/src/index.js
@@ -17,8 +17,7 @@ import VectorSource from 'ol/source/Vector'
 import { Icon, Text, Style } from 'ol/style'
 import { View, Feature, Map as OlMap } from 'ol'
 
-// Import the CSS file - Webpack's css-loader and style-loader will handle this
-import 'ol-contextmenu/ol-contextmenu.css'
+// Note: CSS is now bundled into the JavaScript, no separate CSS import needed
 
 // Import custom styles
 import './style.css'