mirrors/OverlayScrollbars
2
0
Fork 0
mirror of https://github.com/tenrok/OverlayScrollbars.git synced 2026-06-20 23:00:35 +03:00
Code Issues Packages Projects Releases Wiki Activity

add examples readme and add title to example apps

Browse Source
This commit is contained in:
Rene Haas
2022-11-25 11:52:55 +01:00
parent a89d4a7921
commit 2122378a5e
6 changed files with 39 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/README.md
+24
View File
@@ -0,0 +1,24 @@
# Examples
Run example applications with `OverlayScrollbars`.
> __Note__: All commands must be executed from the root directory of the repository unless stated differently.
## Install and Build
Before you can start any application you have to install all dependencies and build the library:
1. `npm i`
2. `npm run build:os`
## Run Example
The following examples are available:
| App | Command |
| :--- | :--- |
| React | `npm run example:react` |
| Vue | `npm run example:vue` |
| Angular | `npm run example:ngx` |
| Svelte | `npm run example:svelte` |
| Solid | `npm run example:solid` |
examples/angular/src/index.html
+11 -11
View File
@@ -1,13 +1,13 @@
<!doctype html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<title>Example</title> <base href="/" />
<base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico" />
<link rel="icon" type="image/x-icon" href="favicon.ico"> <title>OverlayScrollbars & Angular</title>
</head> </head>
<body> <body>
<app-root></app-root> <app-root></app-root>
</body> </body>
</html> </html>
examples/react/index.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title> <title>OverlayScrollbars & React</title>
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
examples/solid/index.html
+1 -1
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" /> <link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" />
<title>Solid App</title> <title>OverlayScrollbars & Solid</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
examples/svelte/src/routes/+page.svelte
+1 -2
View File
@@ -4,8 +4,7 @@
</script> </script>
<svelte:head> <svelte:head>
<title>Home</title> <title>OverlayScrollbars & Svelte</title>
<meta name="description" content="Svelte demo app" />
</svelte:head> </svelte:head>
<OverlayScrollbarsComponent style="height: 222px; width: 222px" :options="options"> <OverlayScrollbarsComponent style="height: 222px; width: 222px" :options="options">
examples/vue/index.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>OverlayScrollbars & Vue</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>