diff --git a/README.md b/README.md index dc0199c..7a320a2 100644 --- a/README.md +++ b/README.md @@ -50,6 +50,13 @@ $ cd my-solid-project $ pnpm install # or npm install or yarn install ``` +```bash +# Typescript bootstrap (5) template +$ npx degit amoutonbrady/vite-template-solid/ts-bootstrap my-solid-project +$ cd my-solid-project +$ pnpm install # or npm install or yarn install +``` + ## I don't see a template that matches my need? You wish there was a template with a router? Bootstrap? Your favorite library? diff --git a/ts-bootstrap/.gitignore b/ts-bootstrap/.gitignore new file mode 100644 index 0000000..76add87 --- /dev/null +++ b/ts-bootstrap/.gitignore @@ -0,0 +1,2 @@ +node_modules +dist \ No newline at end of file diff --git a/ts-bootstrap/README.md b/ts-bootstrap/README.md new file mode 100644 index 0000000..d307303 --- /dev/null +++ b/ts-bootstrap/README.md @@ -0,0 +1,33 @@ +## Usage + +Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. +This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder. + +Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. + +```bash +$ pnpm install # or npm install or yarn install +``` + +## Available Scripts + +In the project directory, you can run: + +### `npm run dev` + +Runs the app in the development mode.
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser. + +The page will reload if you make edits.
+ +### `npm run build` + +Builds the app for production to the `dist` folder.
+It correctly bundles Solid in production mode and optimizes the build for the best performance. + +The build is minified and the filenames include the hashes.
+Your app is ready to be deployed! + +## Deployment + +You can deploy the `dist` folder to any static host provider (netlify, surge, now, etc.) diff --git a/ts-bootstrap/index.html b/ts-bootstrap/index.html new file mode 100644 index 0000000..1905a04 --- /dev/null +++ b/ts-bootstrap/index.html @@ -0,0 +1,15 @@ + + + + + + + Solid App + + + +
+ + + + diff --git a/ts-bootstrap/package.json b/ts-bootstrap/package.json new file mode 100644 index 0000000..583968e --- /dev/null +++ b/ts-bootstrap/package.json @@ -0,0 +1,20 @@ +{ + "name": "vite-template-solid", + "version": "0.0.0", + "description": "My solid + vite project + ts", + "scripts": { + "dev": "vite", + "build": "vite build" + }, + "license": "ISC", + "devDependencies": { + "sass": "^1.32.8", + "vite": "^2.1.5", + "vite-plugin-solid": "^1.5.0" + }, + "dependencies": { + "@popperjs/core": "^2.9.2", + "bootstrap": "^5.0.0-beta3", + "solid-js": "^0.25.1" + } +} diff --git a/ts-bootstrap/pnpm-lock.yaml b/ts-bootstrap/pnpm-lock.yaml new file mode 100644 index 0000000..c77f9b8 --- /dev/null +++ b/ts-bootstrap/pnpm-lock.yaml @@ -0,0 +1,704 @@ +dependencies: + '@popperjs/core': 2.9.2 + bootstrap: 5.0.0-beta3_@popperjs+core@2.9.2 + solid-js: 0.25.1 +devDependencies: + sass: 1.32.8 + vite: 2.1.5 + vite-plugin-solid: 1.5.0 +lockfileVersion: 5.2 +packages: + /@babel/code-frame/7.12.13: + dependencies: + '@babel/highlight': 7.13.10 + dev: true + resolution: + integrity: sha512-HV1Cm0Q3ZrpCR93tkWOYiuYIgLxZXZFVG2VgK+MBWjUqZTundupbfx2aXarXuw5Ko5aMcjtJgbSs4vUGBS5v6g== + /@babel/compat-data/7.13.12: + dev: true + resolution: + integrity: sha512-3eJJ841uKxeV8dcN/2yGEUy+RfgQspPEgQat85umsE1rotuquQ2AbIub4S6j7c50a2d+4myc+zSlnXeIHrOnhQ== + /@babel/core/7.13.14: + dependencies: + '@babel/code-frame': 7.12.13 + '@babel/generator': 7.13.9 + '@babel/helper-compilation-targets': 7.13.13_@babel+core@7.13.14 + '@babel/helper-module-transforms': 7.13.14 + '@babel/helpers': 7.13.10 + '@babel/parser': 7.13.13 + '@babel/template': 7.12.13 + '@babel/traverse': 7.13.13 + '@babel/types': 7.13.14 + convert-source-map: 1.7.0 + debug: 4.3.1 + gensync: 1.0.0-beta.2 + json5: 2.2.0 + semver: 6.3.0 + source-map: 0.5.7 + dev: true + engines: + node: '>=6.9.0' + resolution: + integrity: sha512-wZso/vyF4ki0l0znlgM4inxbdrUvCb+cVz8grxDq+6C9k6qbqoIJteQOKicaKjCipU3ISV+XedCqpL2RJJVehA== + /@babel/generator/7.13.9: + dependencies: + '@babel/types': 7.13.14 + jsesc: 2.5.2 + source-map: 0.5.7 + dev: true + resolution: + integrity: sha512-mHOOmY0Axl/JCTkxTU6Lf5sWOg/v8nUa+Xkt4zMTftX0wqmb6Sh7J8gvcehBw7q0AhrhAR+FDacKjCZ2X8K+Sw== + /@babel/helper-compilation-targets/7.13.13_@babel+core@7.13.14: + dependencies: + '@babel/compat-data': 7.13.12 + '@babel/core': 7.13.14 + '@babel/helper-validator-option': 7.12.17 + browserslist: 4.16.3 + semver: 6.3.0 + dev: true + peerDependencies: + '@babel/core': ^7.0.0 + resolution: + integrity: sha512-q1kcdHNZehBwD9jYPh3WyXcsFERi39X4I59I3NadciWtNDyZ6x+GboOxncFK0kXlKIv6BJm5acncehXWUjWQMQ== + /@babel/helper-create-class-features-plugin/7.13.11_@babel+core@7.13.14: + dependencies: + '@babel/core': 7.13.14 + '@babel/helper-function-name': 7.12.13 + '@babel/helper-member-expression-to-functions': 7.13.12 + '@babel/helper-optimise-call-expression': 7.12.13 + '@babel/helper-replace-supers': 7.13.12 + '@babel/helper-split-export-declaration': 7.12.13 + dev: true + peerDependencies: + '@babel/core': ^7.0.0 + resolution: + integrity: sha512-ays0I7XYq9xbjCSvT+EvysLgfc3tOkwCULHjrnscGT3A9qD4sk3wXnJ3of0MAWsWGjdinFvajHU2smYuqXKMrw== + /@babel/helper-function-name/7.12.13: + dependencies: + '@babel/helper-get-function-arity': 7.12.13 + '@babel/template': 7.12.13 + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-TZvmPn0UOqmvi5G4vvw0qZTpVptGkB1GL61R6lKvrSdIxGm5Pky7Q3fpKiIkQCAtRCBUwB0PaThlx9vebCDSwA== + /@babel/helper-get-function-arity/7.12.13: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-DjEVzQNz5LICkzN0REdpD5prGoidvbdYk1BVgRUOINaWJP2t6avB27X1guXK1kXNrX0WMfsrm1A/ZBthYuIMQg== + /@babel/helper-member-expression-to-functions/7.13.12: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-48ql1CLL59aKbU94Y88Xgb2VFy7a95ykGRbJJaaVv+LX5U8wFpLfiGXJJGUozsmA1oEh/o5Bp60Voq7ACyA/Sw== + /@babel/helper-module-imports/7.13.12: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-4cVvR2/1B693IuOvSI20xqqa/+bl7lqAMR59R4iu39R9aOX8/JoYY1sFaNvUMyMBGnHdwvJgUrzNLoUZxXypxA== + /@babel/helper-module-transforms/7.13.14: + dependencies: + '@babel/helper-module-imports': 7.13.12 + '@babel/helper-replace-supers': 7.13.12 + '@babel/helper-simple-access': 7.13.12 + '@babel/helper-split-export-declaration': 7.12.13 + '@babel/helper-validator-identifier': 7.12.11 + '@babel/template': 7.12.13 + '@babel/traverse': 7.13.13 + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-QuU/OJ0iAOSIatyVZmfqB0lbkVP0kDRiKj34xy+QNsnVZi/PA6BoSoreeqnxxa9EHFAIL0R9XOaAR/G9WlIy5g== + /@babel/helper-optimise-call-expression/7.12.13: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-BdWQhoVJkp6nVjB7nkFWcn43dkprYauqtk++Py2eaf/GRDFm5BxRqEIZCiHlZUGAVmtwKcsVL1dC68WmzeFmiA== + /@babel/helper-plugin-utils/7.13.0: + dev: true + resolution: + integrity: sha512-ZPafIPSwzUlAoWT8DKs1W2VyF2gOWthGd5NGFMsBcMMol+ZhK+EQY/e6V96poa6PA/Bh+C9plWN0hXO1uB8AfQ== + /@babel/helper-replace-supers/7.13.12: + dependencies: + '@babel/helper-member-expression-to-functions': 7.13.12 + '@babel/helper-optimise-call-expression': 7.12.13 + '@babel/traverse': 7.13.13 + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-Gz1eiX+4yDO8mT+heB94aLVNCL+rbuT2xy4YfyNqu8F+OI6vMvJK891qGBTqL9Uc8wxEvRW92Id6G7sDen3fFw== + /@babel/helper-simple-access/7.13.12: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-7FEjbrx5SL9cWvXioDbnlYTppcZGuCY6ow3/D5vMggb2Ywgu4dMrpTJX0JdQAIcRRUElOIxF3yEooa9gUb9ZbA== + /@babel/helper-split-export-declaration/7.12.13: + dependencies: + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-tCJDltF83htUtXx5NLcaDqRmknv652ZWCHyoTETf1CXYJdPC7nohZohjUgieXhv0hTJdRf2FjDueFehdNucpzg== + /@babel/helper-validator-identifier/7.12.11: + dev: true + resolution: + integrity: sha512-np/lG3uARFybkoHokJUmf1QfEvRVCPbmQeUQpKow5cQ3xWrV9i3rUHodKDJPQfTVX61qKi+UdYk8kik84n7XOw== + /@babel/helper-validator-option/7.12.17: + dev: true + resolution: + integrity: sha512-TopkMDmLzq8ngChwRlyjR6raKD6gMSae4JdYDB8bByKreQgG0RBTuKe9LRxW3wFtUnjxOPRKBDwEH6Mg5KeDfw== + /@babel/helpers/7.13.10: + dependencies: + '@babel/template': 7.12.13 + '@babel/traverse': 7.13.13 + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-4VO883+MWPDUVRF3PhiLBUFHoX/bsLTGFpFK/HqvvfBZz2D57u9XzPVNFVBTc0PW/CWR9BXTOKt8NF4DInUHcQ== + /@babel/highlight/7.13.10: + dependencies: + '@babel/helper-validator-identifier': 7.12.11 + chalk: 2.4.2 + js-tokens: 4.0.0 + dev: true + resolution: + integrity: sha512-5aPpe5XQPzflQrFwL1/QoeHkP2MsA4JCntcXHRhEsdsfPVkvPi2w7Qix4iV7t5S/oC9OodGrggd8aco1g3SZFg== + /@babel/parser/7.13.13: + dev: true + engines: + node: '>=6.0.0' + hasBin: true + resolution: + integrity: sha512-OhsyMrqygfk5v8HmWwOzlYjJrtLaFhF34MrfG/Z73DgYCI6ojNUTUp2TYbtnjo8PegeJp12eamsNettCQjKjVw== + /@babel/plugin-syntax-jsx/7.12.13_@babel+core@7.13.14: + dependencies: + '@babel/core': 7.13.14 + '@babel/helper-plugin-utils': 7.13.0 + dev: true + peerDependencies: + '@babel/core': ^7.0.0-0 + resolution: + integrity: sha512-d4HM23Q1K7oq/SLNmG6mRt85l2csmQ0cHRaxRXjKW0YFdEXqlZ5kzFQKH5Uc3rDJECgu+yCRgPkG04Mm98R/1g== + /@babel/plugin-syntax-typescript/7.12.13_@babel+core@7.13.14: + dependencies: + '@babel/core': 7.13.14 + '@babel/helper-plugin-utils': 7.13.0 + dev: true + peerDependencies: + '@babel/core': ^7.0.0-0 + resolution: + integrity: sha512-cHP3u1JiUiG2LFDKbXnwVad81GvfyIOmCD6HIEId6ojrY0Drfy2q1jw7BwN7dE84+kTnBjLkXoL3IEy/3JPu2w== + /@babel/plugin-transform-typescript/7.13.0_@babel+core@7.13.14: + dependencies: + '@babel/core': 7.13.14 + '@babel/helper-create-class-features-plugin': 7.13.11_@babel+core@7.13.14 + '@babel/helper-plugin-utils': 7.13.0 + '@babel/plugin-syntax-typescript': 7.12.13_@babel+core@7.13.14 + dev: true + peerDependencies: + '@babel/core': ^7.0.0-0 + resolution: + integrity: sha512-elQEwluzaU8R8dbVuW2Q2Y8Nznf7hnjM7+DSCd14Lo5fF63C9qNLbwZYbmZrtV9/ySpSUpkRpQXvJb6xyu4hCQ== + /@babel/preset-typescript/7.13.0_@babel+core@7.13.14: + dependencies: + '@babel/core': 7.13.14 + '@babel/helper-plugin-utils': 7.13.0 + '@babel/helper-validator-option': 7.12.17 + '@babel/plugin-transform-typescript': 7.13.0_@babel+core@7.13.14 + dev: true + peerDependencies: + '@babel/core': ^7.0.0-0 + resolution: + integrity: sha512-LXJwxrHy0N3f6gIJlYbLta1D9BDtHpQeqwzM0LIfjDlr6UE/D5Mc7W4iDiQzaE+ks0sTjT26ArcHWnJVt0QiHw== + /@babel/template/7.12.13: + dependencies: + '@babel/code-frame': 7.12.13 + '@babel/parser': 7.13.13 + '@babel/types': 7.13.14 + dev: true + resolution: + integrity: sha512-/7xxiGA57xMo/P2GVvdEumr8ONhFOhfgq2ihK3h1e6THqzTAkHbkXgB0xI9yeTfIUoH3+oAeHhqm/I43OTbbjA== + /@babel/traverse/7.13.13: + dependencies: + '@babel/code-frame': 7.12.13 + '@babel/generator': 7.13.9 + '@babel/helper-function-name': 7.12.13 + '@babel/helper-split-export-declaration': 7.12.13 + '@babel/parser': 7.13.13 + '@babel/types': 7.13.14 + debug: 4.3.1 + globals: 11.12.0 + dev: true + resolution: + integrity: sha512-CblEcwmXKR6eP43oQGG++0QMTtCjAsa3frUuzHoiIJWpaIIi8dwMyEFUJoXRLxagGqCK+jALRwIO+o3R9p/uUg== + /@babel/types/7.13.14: + dependencies: + '@babel/helper-validator-identifier': 7.12.11 + lodash: 4.17.21 + to-fast-properties: 2.0.0 + dev: true + resolution: + integrity: sha512-A2aa3QTkWoyqsZZFl56MLUsfmh7O0gN41IPvXAE/++8ojpbz12SszD7JEGYVdn4f9Kt4amIei07swF1h4AqmmQ== + /@popperjs/core/2.9.2: + dev: false + resolution: + integrity: sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q== + /ansi-styles/3.2.1: + dependencies: + color-convert: 1.9.3 + dev: true + engines: + node: '>=4' + resolution: + integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA== + /anymatch/3.1.1: + dependencies: + normalize-path: 3.0.0 + picomatch: 2.2.2 + dev: true + engines: + node: '>= 8' + resolution: + integrity: sha512-mM8522psRCqzV+6LhomX5wgp25YVibjh8Wj23I5RPkPppSVSjyKD2A2mBJmWGa+KN7f2D6LNh9jkBCeyLktzjg== + /babel-plugin-jsx-dom-expressions/0.26.0_@babel+core@7.13.14: + dependencies: + '@babel/helper-module-imports': 7.13.12 + '@babel/plugin-syntax-jsx': 7.12.13_@babel+core@7.13.14 + '@babel/types': 7.13.14 + dev: true + peerDependencies: + '@babel/core': '*' + resolution: + integrity: sha512-JCI4SIvEH9y2KCNd2oT8Yi3OQIDtl7PNx7DiVgsCEY2MttiAOk0HrYLhxjw2n21h/9iZgqJ0pwy/T7XRrUznSQ== + /babel-preset-solid/0.25.0_@babel+core@7.13.14: + dependencies: + babel-plugin-jsx-dom-expressions: 0.26.0_@babel+core@7.13.14 + dev: true + peerDependencies: + '@babel/core': '*' + resolution: + integrity: sha512-MKVpRrcqRlENdxbYdlOKC1deW1vLtakMre6JG0QKgYziPAfCheh4k6LapLld/oGYF0f2MNvcXjtStpWTYmQdyA== + /binary-extensions/2.2.0: + dev: true + engines: + node: '>=8' + resolution: + integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA== + /bootstrap/5.0.0-beta3_@popperjs+core@2.9.2: + dependencies: + '@popperjs/core': 2.9.2 + dev: false + peerDependencies: + '@popperjs/core': ^2.9.1 + resolution: + integrity: sha512-0urccjfIOzhrb9qJysN8XW/DRw6rg3zH7qLeKIp4Zyl8+Ens4JWB0NC0cB5AhnSFPd2tftRggjwCMxablo6Tpg== + /braces/3.0.2: + dependencies: + fill-range: 7.0.1 + dev: true + engines: + node: '>=8' + resolution: + integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A== + /browserslist/4.16.3: + dependencies: + caniuse-lite: 1.0.30001207 + colorette: 1.2.2 + electron-to-chromium: 1.3.707 + escalade: 3.1.1 + node-releases: 1.1.71 + dev: true + engines: + node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7 + hasBin: true + resolution: + integrity: sha512-vIyhWmIkULaq04Gt93txdh+j02yX/JzlyhLYbV3YQCn/zvES3JnY7TifHHvvr1w5hTDluNKMkV05cs4vy8Q7sw== + /caniuse-lite/1.0.30001207: + dev: true + resolution: + integrity: sha512-UPQZdmAsyp2qfCTiMU/zqGSWOYaY9F9LL61V8f+8MrubsaDGpaHD9HRV/EWZGULZn0Hxu48SKzI5DgFwTvHuYw== + /chalk/2.4.2: + dependencies: + ansi-styles: 3.2.1 + escape-string-regexp: 1.0.5 + supports-color: 5.5.0 + dev: true + engines: + node: '>=4' + resolution: + integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ== + /chokidar/3.5.1: + dependencies: + anymatch: 3.1.1 + braces: 3.0.2 + glob-parent: 5.1.2 + is-binary-path: 2.1.0 + is-glob: 4.0.1 + normalize-path: 3.0.0 + readdirp: 3.5.0 + dev: true + engines: + node: '>= 8.10.0' + optionalDependencies: + fsevents: 2.3.2 + resolution: + integrity: sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw== + /color-convert/1.9.3: + dependencies: + color-name: 1.1.3 + dev: true + resolution: + integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg== + /color-name/1.1.3: + dev: true + resolution: + integrity: sha1-p9BVi9icQveV3UIyj3QIMcpTvCU= + /colorette/1.2.2: + dev: true + resolution: + integrity: sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w== + /convert-source-map/1.7.0: + dependencies: + safe-buffer: 5.1.2 + dev: true + resolution: + integrity: sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA== + /debug/4.3.1: + dependencies: + ms: 2.1.2 + dev: true + engines: + node: '>=6.0' + peerDependencies: + supports-color: '*' + peerDependenciesMeta: + supports-color: + optional: true + resolution: + integrity: sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ== + /electron-to-chromium/1.3.707: + dev: true + resolution: + integrity: sha512-BqddgxNPrcWnbDdJw7SzXVzPmp+oiyjVrc7tkQVaznPGSS9SKZatw6qxoP857M+HbOyyqJQwYQtsuFIMSTNSZA== + /esbuild/0.9.7: + dev: true + hasBin: true + requiresBuild: true + resolution: + integrity: sha512-VtUf6aQ89VTmMLKrWHYG50uByMF4JQlVysb8dmg6cOgW8JnFCipmz7p+HNBl+RR3LLCuBxFGVauAe2wfnF9bLg== + /escalade/3.1.1: + dev: true + engines: + node: '>=6' + resolution: + integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw== + /escape-string-regexp/1.0.5: + dev: true + engines: + node: '>=0.8.0' + resolution: + integrity: sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ= + /fill-range/7.0.1: + dependencies: + to-regex-range: 5.0.1 + dev: true + engines: + node: '>=8' + resolution: + integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ== + /fsevents/2.3.2: + dev: true + engines: + node: ^8.16.0 || ^10.6.0 || >=11.0.0 + optional: true + os: + - darwin + resolution: + integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA== + /function-bind/1.1.1: + dev: true + resolution: + integrity: sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A== + /gensync/1.0.0-beta.2: + dev: true + engines: + node: '>=6.9.0' + resolution: + integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg== + /glob-parent/5.1.2: + dependencies: + is-glob: 4.0.1 + dev: true + engines: + node: '>= 6' + resolution: + integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow== + /globals/11.12.0: + dev: true + engines: + node: '>=4' + resolution: + integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA== + /has-flag/3.0.0: + dev: true + engines: + node: '>=4' + resolution: + integrity: sha1-tdRU3CGZriJWmfNGfloH87lVuv0= + /has/1.0.3: + dependencies: + function-bind: 1.1.1 + dev: true + engines: + node: '>= 0.4.0' + resolution: + integrity: sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw== + /is-binary-path/2.1.0: + dependencies: + binary-extensions: 2.2.0 + dev: true + engines: + node: '>=8' + resolution: + integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw== + /is-core-module/2.2.0: + dependencies: + has: 1.0.3 + dev: true + resolution: + integrity: sha512-XRAfAdyyY5F5cOXn7hYQDqh2Xmii+DEfIcQGxK/uNwMHhIkPWO0g8msXcbzLe+MpGoR951MlqM/2iIlU4vKDdQ== + /is-extglob/2.1.1: + dev: true + engines: + node: '>=0.10.0' + resolution: + integrity: sha1-qIwCU1eR8C7TfHahueqXc8gz+MI= + /is-glob/4.0.1: + dependencies: + is-extglob: 2.1.1 + dev: true + engines: + node: '>=0.10.0' + resolution: + integrity: sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg== + /is-number/7.0.0: + dev: true + engines: + node: '>=0.12.0' + resolution: + integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng== + /is-what/3.14.1: + dev: true + resolution: + integrity: sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA== + /js-tokens/4.0.0: + dev: true + resolution: + integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ== + /jsesc/2.5.2: + dev: true + engines: + node: '>=4' + hasBin: true + resolution: + integrity: sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA== + /json5/2.2.0: + dependencies: + minimist: 1.2.5 + dev: true + engines: + node: '>=6' + hasBin: true + resolution: + integrity: sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA== + /lodash/4.17.21: + dev: true + resolution: + integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== + /merge-anything/4.0.1: + dependencies: + is-what: 3.14.1 + ts-toolbelt: 9.6.0 + dev: true + resolution: + integrity: sha512-KsFjBYc3juDoHz9Vzd5fte1nqp06H8SQ+yU344Dd0ZunwSgtltnC0kgKds8cbocJGyViLcBQuHkitbDXAqW+LQ== + /minimist/1.2.5: + dev: true + resolution: + integrity: sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw== + /ms/2.1.2: + dev: true + resolution: + integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== + /nanoid/3.1.22: + dev: true + engines: + node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1 + hasBin: true + resolution: + integrity: sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ== + /node-releases/1.1.71: + dev: true + resolution: + integrity: sha512-zR6HoT6LrLCRBwukmrVbHv0EpEQjksO6GmFcZQQuCAy139BEsoVKPYnf3jongYW83fAa1torLGYwxxky/p28sg== + /normalize-path/3.0.0: + dev: true + engines: + node: '>=0.10.0' + resolution: + integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA== + /path-parse/1.0.6: + dev: true + resolution: + integrity: sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw== + /picomatch/2.2.2: + dev: true + engines: + node: '>=8.6' + resolution: + integrity: sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg== + /postcss/8.2.9: + dependencies: + colorette: 1.2.2 + nanoid: 3.1.22 + source-map: 0.6.1 + dev: true + engines: + node: ^10 || ^12 || >=14 + resolution: + integrity: sha512-b+TmuIL4jGtCHtoLi+G/PisuIl9avxs8IZMSmlABRwNz5RLUUACrC+ws81dcomz1nRezm5YPdXiMEzBEKgYn+Q== + /readdirp/3.5.0: + dependencies: + picomatch: 2.2.2 + dev: true + engines: + node: '>=8.10.0' + resolution: + integrity: sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ== + /resolve.exports/1.0.2: + dev: true + engines: + node: '>=10' + resolution: + integrity: sha512-1+PDdTR3xrGWB/NzXLkzS1+PQlJ+BOR2baBGJSVat4HasiY1mnkyAQws3FUTmBDB79oK54QFaDM8Ig9nUtJwvQ== + /resolve/1.20.0: + dependencies: + is-core-module: 2.2.0 + path-parse: 1.0.6 + dev: true + resolution: + integrity: sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A== + /rollup/2.44.0: + dev: true + engines: + node: '>=10.0.0' + hasBin: true + optionalDependencies: + fsevents: 2.3.2 + resolution: + integrity: sha512-rGSF4pLwvuaH/x4nAS+zP6UNn5YUDWf/TeEU5IoXSZKBbKRNTCI3qMnYXKZgrC0D2KzS2baiOZt1OlqhMu5rnQ== + /safe-buffer/5.1.2: + dev: true + resolution: + integrity: sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== + /sass/1.32.8: + dependencies: + chokidar: 3.5.1 + dev: true + engines: + node: '>=8.9.0' + hasBin: true + resolution: + integrity: sha512-Sl6mIeGpzjIUZqvKnKETfMf0iDAswD9TNlv13A7aAF3XZlRPMq4VvJWBC2N2DXbp94MQVdNSFG6LfF/iOXrPHQ== + /semver/6.3.0: + dev: true + hasBin: true + resolution: + integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== + /solid-js/0.25.1: + resolution: + integrity: sha512-HPfnGgEWIkYP9+0Aw8zPIx8QBWDyeSvNSLME6N4kIk+d3sMRW41n8qpHoM6vC6lqqHUh2enyQ7MC9gogDjAdWw== + /solid-refresh/0.1.1_solid-js@0.25.1: + dependencies: + solid-js: 0.25.1 + dev: true + peerDependencies: + solid-js: ^0.25.0 + resolution: + integrity: sha512-PF1Qguwqr3OHVSQ+GLopm5CIZybJVJr1IHRKYDJkfqfIahkOfJDHtSpDNAENWbCbAjdrhZmiNqSxlrDWGTAjng== + /source-map/0.5.7: + dev: true + engines: + node: '>=0.10.0' + resolution: + integrity: sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w= + /source-map/0.6.1: + dev: true + engines: + node: '>=0.10.0' + resolution: + integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== + /supports-color/5.5.0: + dependencies: + has-flag: 3.0.0 + dev: true + engines: + node: '>=4' + resolution: + integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow== + /to-fast-properties/2.0.0: + dev: true + engines: + node: '>=4' + resolution: + integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4= + /to-regex-range/5.0.1: + dependencies: + is-number: 7.0.0 + dev: true + engines: + node: '>=8.0' + resolution: + integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ== + /ts-toolbelt/9.6.0: + dev: true + resolution: + integrity: sha512-nsZd8ZeNUzukXPlJmTBwUAuABDe/9qtVDelJeT/qW0ow3ZS3BsQJtNkan1802aM9Uf68/Y8ljw86Hu0h5IUW3w== + /vite-plugin-solid/1.5.0: + dependencies: + '@babel/core': 7.13.14 + '@babel/preset-typescript': 7.13.0_@babel+core@7.13.14 + babel-preset-solid: 0.25.0_@babel+core@7.13.14 + merge-anything: 4.0.1 + resolve.exports: 1.0.2 + solid-js: 0.25.1 + solid-refresh: 0.1.1_solid-js@0.25.1 + vite: 2.1.5 + dev: true + resolution: + integrity: sha512-9tajYaWiXZQ6qKaPONUgrFwYAFtFcI9JcFkh+K2FBNT+vCE0Jw/MBKipKoE/YNIlnZpd4+hiHV78LU++uzZUpw== + /vite/2.1.5: + dependencies: + esbuild: 0.9.7 + postcss: 8.2.9 + resolve: 1.20.0 + rollup: 2.44.0 + dev: true + engines: + node: '>=12.0.0' + hasBin: true + optionalDependencies: + fsevents: 2.3.2 + resolution: + integrity: sha512-tYU5iaYeUgQYvK/CNNz3tiJ8vYqPWfCE9IQ7K0iuzYovWw7lzty7KRYGWwV3CQPh0NKxWjOczAqiJsCL0Xb+Og== +specifiers: + '@popperjs/core': ^2.9.2 + bootstrap: ^5.0.0-beta3 + sass: ^1.32.8 + solid-js: ^0.25.1 + vite: ^2.1.5 + vite-plugin-solid: ^1.5.0 diff --git a/ts-bootstrap/src/App.tsx b/ts-bootstrap/src/App.tsx new file mode 100644 index 0000000..480ba0a --- /dev/null +++ b/ts-bootstrap/src/App.tsx @@ -0,0 +1,4267 @@ +import { Component, onCleanup, onMount } from "solid-js"; +import * as bootstrap from "bootstrap"; + +const App: Component = () => { + /** + * This function was taken from the cheatsheet example of bootstrap. + * You will most likely remove it if using this template. + */ + function setActiveItem() { + let hash = window.location.hash; + + if (hash === "") { + return; + } + + let link = document.querySelector('.bd-aside a[href="' + hash + '"]'); + let active = document.querySelector(".bd-aside .active"); + // @ts-ignore + let parent = link.parentNode.parentNode.previousElementSibling; + + link.classList.add("active"); + + if (parent.classList.contains("collapsed")) { + parent.click(); + } + + if (!active) { + return; + } + + // @ts-ignore + let expanded = active.parentNode.parentNode.previousElementSibling; + + active.classList.remove("active"); + + if (expanded && parent !== expanded) { + expanded.click(); + } + } + + onMount(() => { + setActiveItem(); + window.addEventListener("hashchange", setActiveItem); + }); + + onCleanup(() => { + window.removeEventListener("hashchange", setActiveItem); + }); + + return ( + <> +
+
+

+ Bootstrap Cheatsheet +

+
+
+ +
+
+

+ Contents +

+ +
+
+

Typography

+ + Documentation + +
+ +
+
+

Display 1

+

Display 2

+

Display 3

+

Display 4

+

Display 5

+

Display 6

+
+ +
+

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+

Heading 5

+

Heading 6

+
+ +
+

+ This is a lead paragraph. It stands out from regular + paragraphs. +

+
+ +
+

+ You can use the mark tag to highlight text. +

+

+ + This line of text is meant to be treated as deleted text. + +

+

+ + This line of text is meant to be treated as no longer + accurate. + +

+

+ + This line of text is meant to be treated as an addition to + the document. + +

+

+ This line of text will render as underlined. +

+

+ + This line of text is meant to be treated as fine print. + +

+

+ This line rendered as bold text. +

+

+ This line rendered as italicized text. +

+
+ +
+
+

A well-known quote, contained in a blockquote element.

+
+ Someone famous in{" "} + Source Title +
+
+
+ +
+
    +
  • This is a list.
  • +
  • It appears completely unstyled.
  • +
  • Structurally, it's still a list.
  • +
  • + However, this style only applies to immediate child + elements. +
  • +
  • + Nested lists: +
      +
    • are unaffected by this style
    • +
    • will still show a bullet
    • +
    • and have appropriate left margin
    • +
    +
  • +
  • This may still come in handy in some situations.
  • +
+
+ +
+
    +
  • This is a list item.
  • +
  • And another one.
  • +
  • + But they're displayed inline. +
  • +
+
+
+
+
+
+

Images

+ + Documentation + +
+ +
+
+ + Placeholder + + + Responsive image + + +
+ +
+ + + A generic square placeholder image with a white border + around it, making it resemble a photograph taken with an old + instant camera + + + + 200x200 + + +
+
+
+
+
+

Tables

+ + Documentation + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#FirstLastHandle
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#FirstLastHandle
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ClassHeadingHeading
DefaultCellCell
PrimaryCellCell
SecondaryCellCell
SuccessCellCell
DangerCellCell
WarningCellCell
InfoCellCell
LightCellCell
DarkCellCell
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#FirstLastHandle
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
+
+
+
+
+
+

Figures

+ + Documentation + +
+ +
+
+
+ + Placeholder + + + 400x300 + + + +
+ A caption for the above image. +
+
+
+
+
+
+ +
+

Forms

+ +
+
+

Overview

+ + Documentation + +
+ +
+
+
+
+ + +
+ We'll never share your email with anyone else. +
+
+
+ + +
+
+ + +
+
+ Radios buttons +
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+
+
+
+

Disabled forms

+ + Documentation + +
+ +
+
+
+
+
+ + +
+
+ + +
+
+
+ + +
+
+
+ Disabled radios buttons +
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+
+
+
+
+

Sizing

+ + Documentation + +
+ +
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+
+
+

Input group

+ + Documentation + +
+ +
+
+
+ + @ + + +
+
+ + + @example.com + +
+ +
+ + https://example.com/users/ + + +
+
+ $ + + .00 +
+
+ With textarea + +
+
+
+
+
+
+

Floating labels

+ + Documentation + +
+ +
+
+
+
+ + +
+
+ + +
+
+
+
+
+
+
+

Validation

+ + Documentation + +
+ +
+
+
+
+ + +
Looks good!
+
+
+ + +
Looks good!
+
+
+ +
+ + @ + + +
+ Please choose a username. +
+
+
+
+ + +
+ Please provide a valid city. +
+
+
+ + +
+ Please select a valid state. +
+
+
+ + +
+ Please provide a valid zip. +
+
+
+
+ + +
+ You must agree before submitting. +
+
+
+
+ +
+
+
+
+
+
+ +
+

+ Components +

+ +
+
+

Accordion

+ + Documentation + +
+ +
+
+
+
+

+ +

+
+
+ + This is the first item's accordion body. + {" "} + It is hidden by default, until the collapse plugin adds + the appropriate classes that we use to style each + element. These classes control the overall appearance, + as well as the showing and hiding via CSS transitions. + You can modify any of this with custom CSS or overriding + our default variables. It's also worth noting that just + about any HTML can go within the{" "} + .accordion-body, though the transition does + limit overflow. +
+
+
+
+

+ +

+
+
+ + This is the second item's accordion body. + {" "} + It is hidden by default, until the collapse plugin adds + the appropriate classes that we use to style each + element. These classes control the overall appearance, + as well as the showing and hiding via CSS transitions. + You can modify any of this with custom CSS or overriding + our default variables. It's also worth noting that just + about any HTML can go within the{" "} + .accordion-body, though the transition does + limit overflow. +
+
+
+
+

+ +

+
+
+ + This is the third item's accordion body. + {" "} + It is hidden by default, until the collapse plugin adds + the appropriate classes that we use to style each + element. These classes control the overall appearance, + as well as the showing and hiding via CSS transitions. + You can modify any of this with custom CSS or overriding + our default variables. It's also worth noting that just + about any HTML can go within the{" "} + .accordion-body, though the transition does + limit overflow. +
+
+
+
+
+
+
+
+
+

Alerts

+ + Documentation + +
+ +
+
+
+ A simple primary alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple secondary alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple success alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple danger alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple warning alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple info alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple light alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ A simple dark alert with{" "} + e.preventDefault()} + class="alert-link" + > + an example link + + . Give it a click if you like. + +
+
+ +
+
+

Well done!

+

+ Aww yeah, you successfully read this important alert + message. This example text is going to run a bit longer so + that you can see how spacing within an alert works with this + kind of content. +

+
+

+ Whenever you need to, be sure to use margin utilities to + keep things nice and tidy. +

+
+
+
+
+
+ + +
+
+

+ Example heading New +

+

+ Example heading New +

+

+ Example heading New +

+

+ Example heading New +

+

+ Example heading{" "} + New +

+

+ Example heading{" "} + New +

+

+ Example heading{" "} + New +

+

+ Example heading New +

+
+ +
+ Primary + Secondary + Success + Danger + + Warning + + Info + Light + Dark +
+
+
+ +
+
+

Buttons

+ + Documentation + +
+ +
+
+ + + + + + + + + + +
+ +
+ + + + + + + + +
+ +
+ + + +
+
+
+
+
+

Button group

+ + Documentation + +
+ +
+
+
+
+ + + + +
+
+ + + +
+
+ +
+
+
+
+
+
+ + +
+
+
+
+
+ + Placeholder + + + Image cap + + + +
+
Card title
+

+ Some quick example text to build on the card title and + make up the bulk of the card's content. +

+ e.preventDefault()} + class="btn btn-primary" + > + Go somewhere + +
+
+
+
+
+
Featured
+
+
Card title
+

+ Some quick example text to build on the card title and + make up the bulk of the card's content. +

+ e.preventDefault()} + class="btn btn-primary" + > + Go somewhere + +
+ +
+
+
+
+
+
Card title
+

+ Some quick example text to build on the card title and + make up the bulk of the card's content. +

+
+
    +
  • An item
  • +
  • A second item
  • +
  • A third item
  • +
+ +
+
+
+
+
+
+ + Placeholder + + + Image + + +
+
+
+
Card title
+

+ This is a wider card with supporting text below as + a natural lead-in to additional content. This + content is a little bit longer. +

+

+ + Last updated 3 mins ago + +

+
+
+
+
+
+
+
+
+
+ + +
+
+

List group

+ + Documentation + +
+ +
+
+
    +
  • + A disabled item +
  • +
  • A second item
  • +
  • A third item
  • +
  • A fourth item
  • +
  • And a fifth one
  • +
+
+ +
+
    +
  • An item
  • +
  • A second item
  • +
  • A third item
  • +
  • A fourth item
  • +
  • And a fifth one
  • +
+
+ + +
+
+ + + +
+
+

Pagination

+ + Documentation + +
+ +
+ + + + + +
+
+
+
+

Popovers

+ + Documentation + +
+ +
+
+ +
+ +
+ + + + +
+
+
+
+
+

Progress

+ + Documentation + +
+ +
+
+
+
+ 0% +
+
+
+
+ 25% +
+
+
+
+ 50% +
+
+
+
+ 75% +
+
+
+
+ 100% +
+
+
+ +
+
+
+
+
+
+
+
+
+
+

Scrollspy

+ + Documentation + +
+ +
+
+ +
+

@fat

+

+ Placeholder content for the scrollspy example. You got the + finest architecture. Passport stamps, she's cosmopolitan. + Fine, fresh, fierce, we got it on lock. Never planned that + one day I'd be losing you. She eats your heart out. Your + kiss is cosmic, every move is magic. I mean the ones, I mean + like she's the one. Greetings loved ones let's take a + journey. Just own the night like the 4th of July! But you'd + rather get wasted. +

+

@mdo

+

+ Placeholder content for the scrollspy example. 'Cause she's + the muse and the artist. (This is how we do) So you wanna + play with magic. So just be sure before you give it all to + me. I'm walking, I'm walking on air (tonight). Skip the + talk, heard it all, time to walk the walk. +

+

one

+

+ Placeholder content for the scrollspy example. Takes you + miles high, so high, 'cause she’s got that one international + smile. There's a stranger in my bed, there's a pounding in + my head. Oh, no. In another life I would make you stay. + ‘Cause I, I’m capable of anything. Suiting up for my + crowning battle. Used to steal your parents' liquor and + climb to the roof. Tone, tan fit and ready, turn it up cause + its gettin' heavy. Her love is like a drug. I guess that I + forgot I had a choice. +

+

two

+

+ Placeholder content for the scrollspy example. It's time to + bring out the big balloons. I'm walking, I'm walking on air + (tonight). Yeah, we maxed our credit cards and got kicked + out of the bar. Yo, shout out to all you kids, buying bottle + service, with your rent money. I'm ma get your heart racing + in my skin-tight jeans. If you get the chance you better + keep her. Yo, shout out to all you kids, buying bottle + service, with your rent money. +

+

three

+

+ Placeholder content for the scrollspy example. If you wanna + dance, if you want it all, you know that I'm the girl that + you should call. Walk through the storm I would. So let me + get you in your birthday suit. The one that got away. Last + Friday night, yeah I think we broke the law, always say + we're gonna stop. 'Cause she's a little bit of Yoko, And + she's a little bit of 'Oh no'. I want the jaw droppin', eye + poppin', head turnin', body shockin'. Yeah, we maxed our + credit cards and got kicked out of the bar. +

+

And some more placeholder content, for good measure.

+
+
+
+
+
+
+

Spinners

+ + Documentation + +
+ +
+
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+ Loading... +
+
+
+
+
+
+

Toasts

+ + Documentation + +
+ +
+
+
{ + const toast = new bootstrap.Toast(toastNode, { + autohide: false, + }); + + toast.show(); + }} + aria-role="alert" + aria-live="assertive" + aria-atomic="true" + > +
+ + + Bootstrap + 11 mins ago + +
+
+ Hello, world! This is a toast message. +
+
+
+
+
+
+
+

Tooltips

+ + Documentation + +
+ +
+
+ new bootstrap.Tooltip(tooltip, { + selector: '[data-bs-toggle="tooltip"]', + }) + } + > + + + + + +
+
+
+
+
+ + + + + + + ); +}; + +export default App; diff --git a/ts-bootstrap/src/cheatsheet.scss b/ts-bootstrap/src/cheatsheet.scss new file mode 100644 index 0000000..6783a6f --- /dev/null +++ b/ts-bootstrap/src/cheatsheet.scss @@ -0,0 +1,191 @@ +/** + * This file was taken from the cheatsheet example of bootstrap. + * You will most likely remove it if using this template. + */ + +.bd-placeholder-img { + font-size: 1.125rem; + text-anchor: middle; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; +} + +@media (min-width: 768px) { + .bd-placeholder-img-lg { + font-size: 3.5rem; + } +} + +#root { + scroll-behavior: smooth; +} + +/** + * Bootstrap "Journal code" icon + * @link https://icons.getbootstrap.com/icons/journal-code/ + */ +.bd-heading a::before { + display: inline-block; + width: 1em; + height: 1em; + margin-right: 0.25rem; + content: ""; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%25230d6efd' viewBox='0 0 16 16'%3E%3Cpath d='M4 1h8a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2h1a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1H2a2 2 0 0 1 2-2z'/%3E%3Cpath d='M2 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2z'/%3E%3Cpath fill-rule='evenodd' d='M8.646 5.646a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1 0 .708l-2 2a.5.5 0 0 1-.708-.708L10.293 8 8.646 6.354a.5.5 0 0 1 0-.708zm-1.292 0a.5.5 0 0 0-.708 0l-2 2a.5.5 0 0 0 0 .708l2 2a.5.5 0 0 0 .708-.708L5.707 8l1.647-1.646a.5.5 0 0 0 0-.708z'/%3E%3C/svg%3E"); + background-size: 1em; +} + +/* stylelint-disable-next-line selector-max-universal */ +.bd-heading + div > * + * { + margin-top: 3rem; +} + +/* Table of contents */ +.bd-aside a { + padding: 0.1875rem 0.5rem; + margin-top: 0.125rem; + margin-left: 0.3125rem; + color: rgba(0, 0, 0, 0.65); + text-decoration: none; +} + +.bd-aside a:hover, +.bd-aside a:focus { + color: rgba(0, 0, 0, 0.85); + background-color: rgba(121, 82, 179, 0.1); +} + +.bd-aside .active { + font-weight: 600; + color: rgba(0, 0, 0, 0.85); +} + +.bd-aside .btn { + padding: 0.25rem 0.5rem; + font-weight: 600; + color: rgba(0, 0, 0, 0.65); + border: 0; +} + +.bd-aside .btn:hover, +.bd-aside .btn:focus { + color: rgba(0, 0, 0, 0.85); + background-color: rgba(121, 82, 179, 0.1); +} + +.bd-aside .btn:focus { + box-shadow: 0 0 0 1px rgba(121, 82, 179, 0.7); +} + +.bd-aside .btn::before { + width: 1.25em; + line-height: 0; + content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e"); + transition: transform 0.35s ease; + + /* rtl:raw: + transform: rotate(180deg) translateX(-2px); + */ + transform-origin: 0.5em 50%; +} + +.bd-aside .btn[aria-expanded="true"]::before { + transform: rotate(90deg) /* rtl:ignore */; +} + +/* Examples */ +.scrollspy-example { + position: relative; + height: 200px; + margin-top: 0.5rem; + overflow: auto; +} + +[id="modal"] .bd-example .btn, +[id="buttons"] .bd-example .btn, +[id="tooltips"] .bd-example .btn, +[id="popovers"] .bd-example .btn, +[id="dropdowns"] .bd-example .btn-group, +[id="dropdowns"] .bd-example .dropdown, +[id="dropdowns"] .bd-example .dropup, +[id="dropdowns"] .bd-example .dropend, +[id="dropdowns"] .bd-example .dropstart { + margin: 0 1rem 1rem 0; +} + +/* Layout */ +@media (min-width: 1200px) { + #root { + display: grid; + gap: 1rem; + grid-template-columns: 1fr 4fr 1fr; + grid-template-rows: auto; + } + + .bd-header { + position: fixed; + top: 0; + /* rtl:begin:ignore */ + right: 0; + left: 0; + /* rtl:end:ignore */ + z-index: 1030; + grid-column: 1 / span 3; + } + + .bd-aside, + .bd-cheatsheet { + padding-top: 4rem; + } + + /** + * 1. Too bad only Firefox supports subgrids ATM + */ + .bd-cheatsheet, + .bd-cheatsheet section, + .bd-cheatsheet article { + display: inherit; /* 1 */ + gap: inherit; /* 1 */ + grid-template-columns: 1fr 4fr; + grid-column: 1 / span 2; + grid-template-rows: auto; + } + + .bd-aside { + grid-area: 1 / 3; + scroll-margin-top: 4rem; + } + + .bd-cheatsheet section, + .bd-cheatsheet section > h2 { + top: 2rem; + scroll-margin-top: 2rem; + } + + .bd-cheatsheet section > h2::before { + position: absolute; + /* rtl:begin:ignore */ + top: 0; + right: 0; + bottom: -2rem; + left: 0; + /* rtl:end:ignore */ + z-index: -1; + content: ""; + background-image: linear-gradient( + to bottom, + rgba(255, 255, 255, 1) calc(100% - 3rem), + rgba(255, 255, 255, 0.01) + ); + } + + .bd-cheatsheet article, + .bd-cheatsheet .bd-heading { + top: 8rem; + scroll-margin-top: 8rem; + } + + .bd-cheatsheet .bd-heading { + z-index: 1; + } +} diff --git a/ts-bootstrap/src/index.tsx b/ts-bootstrap/src/index.tsx new file mode 100644 index 0000000..38f2052 --- /dev/null +++ b/ts-bootstrap/src/index.tsx @@ -0,0 +1,13 @@ +import "bootstrap/scss/bootstrap.scss"; + +import { render } from "solid-js/web"; + +/** + * This file was taken from the cheatsheet example of bootstrap. + * You will most likely remove it if using this template. + */ +import "./cheatsheet.scss"; + +import App from "./App"; + +render(() => , document.getElementById("root")); diff --git a/ts-bootstrap/tsconfig.json b/ts-bootstrap/tsconfig.json new file mode 100644 index 0000000..e27ffb7 --- /dev/null +++ b/ts-bootstrap/tsconfig.json @@ -0,0 +1,12 @@ +{ + "compilerOptions": { + "target": "ESNext", + "module": "ESNext", + "moduleResolution": "node", + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "jsx": "preserve", + "jsxImportSource": "solid-js", + "types": ["vite/client"] + } +} diff --git a/ts-bootstrap/vite.config.ts b/ts-bootstrap/vite.config.ts new file mode 100644 index 0000000..31ca950 --- /dev/null +++ b/ts-bootstrap/vite.config.ts @@ -0,0 +1,10 @@ +import { defineConfig } from "vite"; +import solidPlugin from "vite-plugin-solid"; + +export default defineConfig({ + plugins: [solidPlugin()], + build: { + target: "esnext", + polyfillDynamicImport: false, + }, +});