diff options
author | Manuel Hiebel <leuhmanu@mageia.org> | 2021-02-07 20:19:39 +0100 |
---|---|---|
committer | Manuel Hiebel <leuhmanu@mageia.org> | 2021-02-07 20:19:39 +0100 |
commit | 7d890f2e9b0a299df41bee2b3bbcc1250fd15b61 (patch) | |
tree | ef8e53cf9dc1925dcac5b87988581d49ebeb6104 | |
parent | deb8d37caba61bb37d21bbda758984bcc549c511 (diff) | |
download | nav-7d890f2e9b0a299df41bee2b3bbcc1250fd15b61.tar nav-7d890f2e9b0a299df41bee2b3bbcc1250fd15b61.tar.gz nav-7d890f2e9b0a299df41bee2b3bbcc1250fd15b61.tar.bz2 nav-7d890f2e9b0a299df41bee2b3bbcc1250fd15b61.tar.xz nav-7d890f2e9b0a299df41bee2b3bbcc1250fd15b61.zip |
Import help to generate css for nav
-rw-r--r-- | lib/buildcss/mga-bootstrap.scss | 106 | ||||
-rw-r--r-- | lib/buildcss/package.json | 180 | ||||
-rw-r--r-- | lib/buildcss/readme.txt | 29 |
3 files changed, 315 insertions, 0 deletions
diff --git a/lib/buildcss/mga-bootstrap.scss b/lib/buildcss/mga-bootstrap.scss new file mode 100644 index 0000000..daf3844 --- /dev/null +++ b/lib/buildcss/mga-bootstrap.scss @@ -0,0 +1,106 @@ +// Override Bootstrap's Sass default variables +// +// Nearly all variables in Bootstrap are written with the `!default` flag. +// This allows you to override the default values of those variables before +// you import Bootstrap's source Sass files. +// +// Overriding the default variable values is the best way to customize your +// CSS without writing _new_ styles. For example, change you can either change +// `$body-color` or write more CSS that override's Bootstrap's CSS like so: +// `body { color: red; }`. + +.mganav{ +// +// Bring in Bootstrap +// + +// Option 1 +// +// Import all of Bootstrap's CSS + +// @import "bootstrap"; + +// Option 2 +// +// Import just the styles you need. Note that some stylesheets are required no matter what. + +@import "functions"; // Required +@import "variables"; // Required +@import "mixins"; // Required + +// +// Override Bootstrap here +// + +// Toggle global options +//$enable-gradients: true; +//$enable-shadows: true; + +// Customize some defaults +//$body-color: $purple; +//$body-bg: #f5f5f5; +//$border-radius: .4rem; + + +/* from previous work bootstrap 4.0 +@import "functions"; +@import "variables"; +@import "mixins"; +@import "type"; +@import "transitions"; +@import "dropdown"; +@import "nav"; +@import "navbar"; +@import "breadcrumb"; +*/ + +// @import "root"; +// @import "reboot"; // Required +@import "type"; +// @import "images"; +// @import "code"; +//@import "grid"; +// @import "tables"; +// @import "forms"; +//@import "buttons"; +@import "transitions"; +@import "dropdown"; +// @import "button-group"; +// @import "input-group"; // Requires forms +// @import "custom-forms"; +@import "nav"; +@import "navbar"; // Requires nav +// @import "card"; +@import "breadcrumb"; +// @import "pagination"; +// @import "badge"; +// @import "jumbotron"; +// @import "alert"; +// @import "progress"; +// @import "media"; +// @import "list-group"; +// @import "close"; +// @import "toasts"; +// @import "modal"; // Requires transitions +// @import "tooltip"; +// @import "popover"; +// @import "carousel"; +// @import "spinners"; +// @import "utilities"; +// @import "print"; + + + +// +// Custom styles +// + +//body { +// padding: 3rem 1.5rem; +//} + +// Style Bootstrap icons +//.bi { +// fill: currentColor; +//} +} diff --git a/lib/buildcss/package.json b/lib/buildcss/package.json new file mode 100644 index 0000000..ea498b0 --- /dev/null +++ b/lib/buildcss/package.json @@ -0,0 +1,180 @@ +{ + "name": "bootstrap", + "description": "The most popular front-end framework for developing responsive, mobile first projects on the web.", + "version": "4.6.0", + "config": { + "version_short": "4.6" + }, + "keywords": [ + "css", + "sass", + "mobile-first", + "responsive", + "front-end", + "framework", + "web" + ], + "homepage": "https://getbootstrap.com/", + "author": "The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)", + "contributors": [ + "Twitter, Inc." + ], + "scripts": { + "start": "npm-run-all --parallel watch docs-serve", + "bundlewatch": "bundlewatch --config .bundlewatch.config.json", + "mga": "npm-run-all --parallel css js mga-*", + "mga-js": "terser js/dist/collapse.js --compress typeofs=false --mangle --output mga/bootstrap.min.js", + "mga-css": "cleancss -O1 --format breakWith=lf --output mga/bootstrap.min.css dist/css/mga-bootstrap.css", + "css": "npm-run-all css-compile css-prefix css-minify", + "css-compile": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/ -o dist/css/", + "css-lint": "npm-run-all --continue-on-error --parallel css-lint-*", + "css-lint-stylelint": "stylelint \"**/*.{css,scss}\" --cache --cache-location .cache/.stylelintcache --rd", + "css-lint-vars": "fusv scss/ site/assets/scss/", + "css-minify": "cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap.min.css dist/css/bootstrap.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-grid.min.css dist/css/bootstrap-grid.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-reboot.min.css dist/css/bootstrap-reboot.css", + "css-prefix": "npm-run-all --parallel css-prefix-*", + "css-prefix-main": "postcss --config build/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.min.css\"", + "css-prefix-examples": "postcss --config build/postcss.config.js --replace \"site/content/**/*.css\"", + "js": "npm-run-all js-compile js-minify", + "js-compile": "npm-run-all --parallel js-compile-*", + "js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js --sourcemap", + "js-compile-bundle": "rollup --environment BUNDLE:true --config build/rollup.config.js --sourcemap", + "js-compile-plugins": "node build/build-plugins.js", + "js-compile-plugins-coverage": "cross-env NODE_ENV=test node build/build-plugins.js", + "js-lint": "eslint --cache --cache-location .cache/.eslintcache --report-unused-disable-directives .", + "js-minify": "npm-run-all --parallel js-minify-*", + "js-minify-standalone": "terser --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.js.map,includeSources,url=bootstrap.min.js.map\" --output dist/js/bootstrap.min.js dist/js/bootstrap.js", + "js-minify-bundle": "terser --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.bundle.js.map,includeSources,url=bootstrap.bundle.min.js.map\" --output dist/js/bootstrap.bundle.min.js dist/js/bootstrap.bundle.js", + "js-test": "npm-run-all --parallel js-test-karma* --serial js-test-integration", + "js-test-karma": "karma start js/tests/karma.conf.js", + "js-test-karma-old": "cross-env USE_OLD_JQUERY=true npm run js-test-karma", + "js-test-karma-bundle": "cross-env BUNDLE=true npm run js-test-karma", + "js-test-karma-bundle-old": "cross-env BUNDLE=true USE_OLD_JQUERY=true npm run js-test-karma", + "js-test-integration": "rollup --config js/tests/integration/rollup.bundle.js", + "js-test-cloud": "cross-env BROWSERSTACK=true npm run js-test-karma", + "lint": "npm-run-all --parallel js-lint css-lint lockfile-lint", + "docs": "npm-run-all docs-build docs-lint", + "docs-build": "hugo --cleanDestinationDir", + "docs-compile": "npm run docs-build", + "docs-linkinator": "linkinator _gh_pages --recurse --silent --skip \"^(?!http://localhost)\"", + "docs-vnu": "node build/vnu-jar.js", + "docs-lint": "npm-run-all --parallel docs-vnu docs-linkinator", + "docs-serve": "hugo server --port 9001 --disableFastRender", + "docs-serve-only": "npx sirv-cli _gh_pages --port 9001", + "lockfile-lint": "lockfile-lint --allowed-hosts npm --allowed-schemes https: --empty-hostname false --type npm --path package-lock.json", + "update-deps": "ncu -u -x \"jquery,karma-browserstack-launcher,sinon,terser\" && npm update && echo Manually update site/assets/js/vendor", + "release": "npm-run-all dist release-sri docs-build release-zip*", + "release-sri": "node build/generate-sri.js", + "release-version": "node build/change-version.js", + "release-zip": "cross-env-shell \"rm -rf bootstrap-$npm_package_version-dist && cp -r dist/ bootstrap-$npm_package_version-dist && zip -r9 bootstrap-$npm_package_version-dist.zip bootstrap-$npm_package_version-dist && rm -rf bootstrap-$npm_package_version-dist\"", + "release-zip-examples": "node build/zip-examples.js", + "dist": "npm-run-all --parallel css js", + "test": "npm-run-all lint dist js-test docs-build docs-lint", + "netlify": "cross-env-shell HUGO_BASEURL=$DEPLOY_PRIME_URL npm-run-all dist release-sri docs-build", + "watch": "npm-run-all --parallel watch-*", + "watch-css-main": "nodemon --watch scss/ --ext scss --exec \"npm-run-all css-lint css-compile css-prefix\"", + "watch-css-docs": "nodemon --watch site/assets/scss/ --ext scss --exec \"npm run css-lint\"", + "watch-js-main": "nodemon --watch js/src/ --ext js --exec \"npm-run-all js-lint js-compile\"", + "watch-js-docs": "nodemon --watch site/assets/js/ --ext js --exec \"npm run js-lint\"" + }, + "style": "dist/css/bootstrap.css", + "sass": "scss/bootstrap.scss", + "main": "dist/js/bootstrap.js", + "repository": { + "type": "git", + "url": "git+https://github.com/twbs/bootstrap.git" + }, + "bugs": { + "url": "https://github.com/twbs/bootstrap/issues" + }, + "license": "MIT", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + }, + "dependencies": { + "webpack": "^5.21.1", + "webpack-cli": "^4.5.0" + }, + "peerDependencies": { + "jquery": "1.9.1 - 3", + "popper.js": "^1.16.1" + }, + "devDependencies": { + "@babel/cli": "^7.12.10", + "@babel/core": "^7.12.10", + "@babel/preset-env": "^7.12.11", + "@rollup/plugin-babel": "^5.2.2", + "@rollup/plugin-commonjs": "^17.0.0", + "@rollup/plugin-node-resolve": "^11.0.1", + "autoprefixer": "^10.2.1", + "babel-plugin-istanbul": "^6.0.0", + "bundlewatch": "^0.3.2", + "clean-css-cli": "^4.3.0", + "cross-env": "^7.0.3", + "eslint": "^7.17.0", + "eslint-config-xo": "^0.34.0", + "eslint-plugin-import": "^2.22.1", + "eslint-plugin-unicorn": "^25.0.1", + "find-unused-sass-variables": "^3.1.0", + "glob": "^7.1.6", + "hammer-simulator": "0.0.1", + "hugo-bin": "^0.68.0", + "ip": "^1.1.5", + "jquery": "^3.5.1", + "karma": "^5.2.3", + "karma-browserstack-launcher": "1.4.0", + "karma-chrome-launcher": "^3.1.0", + "karma-coverage-istanbul-reporter": "^3.0.3", + "karma-detect-browsers": "^2.3.3", + "karma-firefox-launcher": "^2.1.0", + "karma-qunit": "^4.1.1", + "karma-sinon": "^1.0.5", + "linkinator": "^2.11.2", + "lockfile-lint": "^4.3.7", + "node-sass": "^5.0.0", + "nodemon": "^2.0.7", + "npm-run-all": "^4.1.5", + "popper.js": "^1.16.1", + "postcss": "^8.2.4", + "postcss-cli": "^8.3.1", + "qunit": "^2.14.0", + "rollup": "^2.36.1", + "shelljs": "^0.8.4", + "sinon": "^7.5.0", + "stylelint": "^13.8.0", + "stylelint-config-twbs-bootstrap": "^2.1.0", + "terser": "5.1.0", + "vnu-jar": "20.6.30", + "webpack": "^5.21.1", + "webpack-cli": "^4.5.0" + }, + "files": [ + "dist/{css,js}/*.{css,js,map}", + "js/{src,dist}/**/*.{js,map}", + "scss/**/*.scss" + ], + "hugo-bin": { + "buildTags": "extended" + }, + "jspm": { + "registry": "npm", + "main": "js/bootstrap", + "directories": { + "lib": "dist" + }, + "shim": { + "js/bootstrap": { + "deps": [ + "jquery", + "popper.js" + ], + "exports": "$" + } + }, + "dependencies": {}, + "peerDependencies": { + "jquery": "1.9.1 - 3", + "popper.js": "^1.16.1" + } + } +} diff --git a/lib/buildcss/readme.txt b/lib/buildcss/readme.txt new file mode 100644 index 0000000..dd3466a --- /dev/null +++ b/lib/buildcss/readme.txt @@ -0,0 +1,29 @@ +For nav we don't need the complete CSS/JS and to avoid breaking webapps (bugs/blog/forums/etc) we add it in a class. +For the CSS, we include only require bootstrap class to the nav, and we add them within the ".mganav" class, see mga-bootstrap.scss +For the JS we only need the collapse, this help to minify it. + +This is to help to generate these two files. + +install npm: +urpmi npm + +Download source on https://github.com/twbs/bootstrap/archive/v4.6.0.zip + +cd bootstrap-4.6.0/ +mkdir mga + +install local dependencies: +npm install + +add mga-bootstrap.scss in scss/ + +Add on package.json: + "mga": "npm-run-all --parallel css js mga-*", + "mga-js": "terser js/dist/collapse.js --compress typeofs=false --mangle --output mga/bootstrap.min.js", + "mga-css": "cleancss -O1 --format breakWith=lf --output mga/bootstrap.min.css dist/css/mga-bootstrap.css", + +run everything: +npm run mga + +the file are on mga/ + |