generated from ztimson/template
Cleaned up styles, better theming and new doc page
This commit is contained in:
2315
index.html
2315
index.html
File diff suppressed because it is too large
Load Diff
292
package-lock.json
generated
292
package-lock.json
generated
@@ -1,29 +1,30 @@
|
||||
{
|
||||
"name": "@ztimson/css-utils",
|
||||
"version": "1.3.4",
|
||||
"version": "1.3.5",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@ztimson/css-utils",
|
||||
"version": "1.3.4",
|
||||
"version": "1.3.5",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"sass": "^1.80.6"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.0.tgz",
|
||||
"integrity": "sha512-i0GV1yJnm2n3Yq1qw6QrUrd/LI9bE8WEBOTtOkpCXHHdyN3TAGgqAK/DAT05z4fq2x04cARXt2pDmjWjL92iTQ==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.6.0.tgz",
|
||||
"integrity": "sha512-7FNeNl8NCE7aINx7WXiKQrPYZWC/hvrTsmk6zmxbI7LTXE7hVek/n8AfVgpe2y82zl3w0HvCHN0bVKMBoJcC0w==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"detect-libc": "^1.0.3",
|
||||
"detect-libc": "^2.0.3",
|
||||
"is-glob": "^4.0.3",
|
||||
"micromatch": "^4.0.5",
|
||||
"node-addon-api": "^7.0.0"
|
||||
"node-addon-api": "^7.0.0",
|
||||
"picomatch": "^4.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
@@ -33,29 +34,29 @@
|
||||
"url": "https://opencollective.com/parcel"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@parcel/watcher-android-arm64": "2.5.0",
|
||||
"@parcel/watcher-darwin-arm64": "2.5.0",
|
||||
"@parcel/watcher-darwin-x64": "2.5.0",
|
||||
"@parcel/watcher-freebsd-x64": "2.5.0",
|
||||
"@parcel/watcher-linux-arm-glibc": "2.5.0",
|
||||
"@parcel/watcher-linux-arm-musl": "2.5.0",
|
||||
"@parcel/watcher-linux-arm64-glibc": "2.5.0",
|
||||
"@parcel/watcher-linux-arm64-musl": "2.5.0",
|
||||
"@parcel/watcher-linux-x64-glibc": "2.5.0",
|
||||
"@parcel/watcher-linux-x64-musl": "2.5.0",
|
||||
"@parcel/watcher-win32-arm64": "2.5.0",
|
||||
"@parcel/watcher-win32-ia32": "2.5.0",
|
||||
"@parcel/watcher-win32-x64": "2.5.0"
|
||||
"@parcel/watcher-android-arm64": "2.6.0",
|
||||
"@parcel/watcher-darwin-arm64": "2.6.0",
|
||||
"@parcel/watcher-darwin-x64": "2.6.0",
|
||||
"@parcel/watcher-freebsd-x64": "2.6.0",
|
||||
"@parcel/watcher-linux-arm-glibc": "2.6.0",
|
||||
"@parcel/watcher-linux-arm-musl": "2.6.0",
|
||||
"@parcel/watcher-linux-arm64-glibc": "2.6.0",
|
||||
"@parcel/watcher-linux-arm64-musl": "2.6.0",
|
||||
"@parcel/watcher-linux-x64-glibc": "2.6.0",
|
||||
"@parcel/watcher-linux-x64-musl": "2.6.0",
|
||||
"@parcel/watcher-win32-arm64": "2.6.0",
|
||||
"@parcel/watcher-win32-x64": "2.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-android-arm64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.0.tgz",
|
||||
"integrity": "sha512-qlX4eS28bUcQCdribHkg/herLe+0A9RyYC+mm2PXpncit8z5b3nSqGVzMNR3CmtAOgRutiZ02eIJJgP/b1iEFQ==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.6.0.tgz",
|
||||
"integrity": "sha512-trgpLSCKRC/huFjXX/Smh+0sWe4+YtKfktIToiMl59ghz7z+qkH6kMvNnUbLyRs9N11t8l4svSCs1+5B3rOAhA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"android"
|
||||
@@ -69,13 +70,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-arm64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.0.tgz",
|
||||
"integrity": "sha512-hyZ3TANnzGfLpRA2s/4U1kbw2ZI4qGxaRJbBH2DCSREFfubMswheh8TeiC1sGZ3z2jUf3s37P0BBlrD3sjVTUw==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.6.0.tgz",
|
||||
"integrity": "sha512-Y3QV0gl7Q1zbfueunkWIERICbEojQFCgpyG7YqOGNFLsckXyI1xu9mAIUpKY9QBYzBtSkN8dBPwd3yiAO9ovMw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
@@ -89,13 +91,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-x64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.0.tgz",
|
||||
"integrity": "sha512-9rhlwd78saKf18fT869/poydQK8YqlU26TMiNg7AIu7eBp9adqbJZqmdFOsbZ5cnLp5XvRo9wcFmNHgHdWaGYA==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.6.0.tgz",
|
||||
"integrity": "sha512-Ohv6OpzhUfKYD7Beb8kDvG0jbIxORCYY1JRdZnaBtnjjkJxgD7ZVL0nw2sCYd0yTMKTvz3nnTnOF3cDifK+kvw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
@@ -109,13 +112,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-freebsd-x64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.0.tgz",
|
||||
"integrity": "sha512-syvfhZzyM8kErg3VF0xpV8dixJ+RzbUaaGaeb7uDuz0D3FK97/mZ5AJQ3XNnDsXX7KkFNtyQyFrXZzQIcN49Tw==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.6.0.tgz",
|
||||
"integrity": "sha512-5HmXvDgs8VK+74jF9y9/2FE3/OnlcKmc56tjmSrEuZjpSZOGL+fvAu+HKJBdPs9uwoP2hE6TlSUpXZ/C5jUFmQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"freebsd"
|
||||
@@ -129,13 +133,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm-glibc": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.0.tgz",
|
||||
"integrity": "sha512-0VQY1K35DQET3dVYWpOaPFecqOT9dbuCfzjxoQyif1Wc574t3kOSkKevULddcR9znz1TcklCE7Ht6NIxjvTqLA==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.6.0.tgz",
|
||||
"integrity": "sha512-Ps/hui3A+vMbjdqlqAowK2ZL8+BO8dBjxeWXj6npTBs3jx4wWmbPpaLuqwrQrSqIVMCnpWo238bJ1U37GhQOYg==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -149,13 +157,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm-musl": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.0.tgz",
|
||||
"integrity": "sha512-6uHywSIzz8+vi2lAzFeltnYbdHsDm3iIB57d4g5oaB9vKwjb6N6dRIgZMujw4nm5r6v9/BQH0noq6DzHrqr2pA==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.6.0.tgz",
|
||||
"integrity": "sha512-9c6AUHgHoG+IY88MRIHupztQiQnrbqHYQjkM2btA+Bf/wQnQMuiD0Wfk1EVv3TlNT3x41uU71rn6E4xh/+zvkw==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -169,13 +181,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-glibc": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.0.tgz",
|
||||
"integrity": "sha512-BfNjXwZKxBy4WibDb/LDCriWSKLz+jJRL3cM/DllnHH5QUyoiUNEp3GmL80ZqxeumoADfCCP19+qiYiC8gUBjA==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.6.0.tgz",
|
||||
"integrity": "sha512-yHRqS2owEXe6Hic9z6Mh1ECsCd+ODVOGvZDyciqRd21+v+o+DnXMOrw50DSpIG2sb8GPEaPPmfeCAWKPJdq46g==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -189,13 +205,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-musl": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.0.tgz",
|
||||
"integrity": "sha512-S1qARKOphxfiBEkwLUbHjCY9BWPdWnW9j7f7Hb2jPplu8UZ3nes7zpPOW9bkLbHRvWM0WDTsjdOTUgW0xLBN1Q==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.6.0.tgz",
|
||||
"integrity": "sha512-WhB2e/V7rqdHHWZusBSPuy5Ei8S6lSz6FE5TKKQz5h3a0O+C+mhY7vxU9b/stqvMb8beLnPY82ZrFTLKs+SrKA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -209,13 +229,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-glibc": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.0.tgz",
|
||||
"integrity": "sha512-d9AOkusyXARkFD66S6zlGXyzx5RvY+chTP9Jp0ypSTC9d4lzyRs9ovGf/80VCxjKddcUvnsGwCHWuF2EoPgWjw==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.6.0.tgz",
|
||||
"integrity": "sha512-ulGE6x6Oz6iAwg75T8YQSoguBWasniIbX+QWpaYPcCnDOpdWX3k+4xbEYPZVLxOuoJI+svJJPD3sEj8G7lrQ3A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"glibc"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -229,13 +253,17 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-musl": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.0.tgz",
|
||||
"integrity": "sha512-iqOC+GoTDoFyk/VYSFHwjHhYrk8bljW6zOhPuhi5t9ulqiYq1togGJB5e3PwYVFFfeVgc6pbz3JdQyDoBszVaA==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.6.0.tgz",
|
||||
"integrity": "sha512-tkBYKt7YQrjIJWYDnto2YgO8MRkjlMTSNoRHzsXinBqbLdeOM3L32wPZJvIZxqaLMfSlS/4sUjH/6STVP/XDLw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"libc": [
|
||||
"musl"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
@@ -249,33 +277,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-arm64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.0.tgz",
|
||||
"integrity": "sha512-twtft1d+JRNkM5YbmexfcH/N4znDtjgysFaV9zvZmmJezQsKpkfLYJ+JFV3uygugK6AtIM2oADPkB2AdhBrNig==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.6.0.tgz",
|
||||
"integrity": "sha512-gIZAP23jaHjGWasY/TY6yL7NHFClf0Ga7FN+iINvk+KN94rhm94lYZhFsbYFNcA04/onvGD9kKmiJLJB2HbNwQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-ia32": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.0.tgz",
|
||||
"integrity": "sha512-+rgpsNRKwo8A53elqbbHXdOMtY/tAtTzManTWShB5Kk54N8Q9mzNWV7tV+IbGueCbcj826MfWGU3mprWtuf1TA==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
@@ -289,13 +298,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-x64": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.0.tgz",
|
||||
"integrity": "sha512-lPrxve92zEHdgeff3aiu4gDOIt4u7sJYha6wbdEZDCDUhtjTsOMiaJzG5lMY4GkWH8p0fMmO2Ppq5G5XXG+DQw==",
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.6.0.tgz",
|
||||
"integrity": "sha512-cA+/pXV2YkfxlIcXOQ5fSWqAzzPyD78/x5qbK/I0vUkrlYHA8TIz+MXjAbGouguKVSI4bOmkTSJ1/poVSsgt+A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
@@ -308,71 +318,46 @@
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/braces": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
|
||||
"integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"fill-range": "^7.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/chokidar": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.1.tgz",
|
||||
"integrity": "sha512-n8enUVCED/KVRQlab1hr3MVpcVMvxtZjmEa956u+4YijlmQED223XMSYj2tLuKvr4jcCTzNNMpQDUer72MMmzA==",
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-5.0.0.tgz",
|
||||
"integrity": "sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"readdirp": "^4.0.1"
|
||||
"readdirp": "^5.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 14.16.0"
|
||||
"node": ">= 20.19.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
},
|
||||
"node_modules/detect-libc": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
|
||||
"integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
|
||||
"integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"bin": {
|
||||
"detect-libc": "bin/detect-libc.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/fill-range": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
|
||||
"integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"to-regex-range": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "4.3.7",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.7.tgz",
|
||||
"integrity": "sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==",
|
||||
"dev": true
|
||||
"version": "5.1.9",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.9.tgz",
|
||||
"integrity": "sha512-m8nVez3rwrgmWxtLMt1ZYXB2Lv7OKYn/disyxAlSDYAlKSlFoPPfIAmAM/M5xqL4m4C/wAPw7S2/CNaUii1Hxg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/is-extglob": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||
"integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
@@ -383,6 +368,7 @@
|
||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
|
||||
"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"is-extglob": "^2.1.1"
|
||||
@@ -391,57 +377,36 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
|
||||
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"braces": "^3.0.3",
|
||||
"picomatch": "^2.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/node-addon-api": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
|
||||
"integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true
|
||||
},
|
||||
"node_modules/picomatch": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
|
||||
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
|
||||
"version": "4.0.5",
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.5.tgz",
|
||||
"integrity": "sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/jonschlinkert"
|
||||
}
|
||||
},
|
||||
"node_modules/readdirp": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.0.2.tgz",
|
||||
"integrity": "sha512-yDMz9g+VaZkqBYS/ozoBJwaBhTbZo3UNYQHNRw1D3UFQB8oHB4uS/tAODO+ZLjGWmUbKnIlOWO+aaIiAxrUWHA==",
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.0.0.tgz",
|
||||
"integrity": "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 14.16.0"
|
||||
"node": ">= 20.19.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
@@ -449,20 +414,21 @@
|
||||
}
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.80.6",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.80.6.tgz",
|
||||
"integrity": "sha512-ccZgdHNiBF1NHBsWvacvT5rju3y1d/Eu+8Ex6c21nHp2lZGLBEtuwc415QfiI1PJa1TpCo3iXwwSRjRpn2Ckjg==",
|
||||
"version": "1.102.0",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.102.0.tgz",
|
||||
"integrity": "sha512-NSOyTnaQF7rTAEOtI2fwb386vL+akyiQLBZu8Na7hXCb+umJy0GAqlcMIaqACZ6Z1VgTBS4K9PG6B3IdjHGJsw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"chokidar": "^4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"chokidar": "^5.0.0",
|
||||
"immutable": "^5.1.5",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"sass": "sass.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
"node": ">=20.19.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@parcel/watcher": "^2.4.1"
|
||||
@@ -473,22 +439,10 @@
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
|
||||
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/to-regex-range": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
||||
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"is-number": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@ztimson/css-utils",
|
||||
"version": "1.3.5",
|
||||
"version": "2.0.0",
|
||||
"description": "CSS Utility Classes",
|
||||
"readme": "README.md",
|
||||
"scripts": {
|
||||
|
||||
350
src/main.scss
350
src/main.scss
@@ -5,9 +5,11 @@
|
||||
// Colors
|
||||
:root {
|
||||
// Theme colors -- what ever you like
|
||||
--theme-backdrop: #dddddd;
|
||||
--theme-primary: #ff0000;
|
||||
--theme-accent: #0000ff;
|
||||
--theme-primary: #4979de;
|
||||
--theme-primary-contrast: black;
|
||||
--theme-accent: #2caec0;
|
||||
--theme-accent-contrast: black;
|
||||
|
||||
--theme-info: #6157cc;
|
||||
--theme-success: #65c147;
|
||||
--theme-warn: #d88750;
|
||||
@@ -16,28 +18,41 @@
|
||||
--theme-white: white;
|
||||
|
||||
// Misc
|
||||
--theme-border: black;
|
||||
--theme-animation: 0.2s linear; // Animation style
|
||||
--theme-content-width: 1100px; // Max width of clamped content
|
||||
--theme-animation: 0.2s linear;
|
||||
--theme-content-width: 1100px;
|
||||
--theme-font: Arial, sans-serif;
|
||||
|
||||
// Light theme
|
||||
&, .theme-light {
|
||||
--theme-clear: #ffffff; // Content background (Usually white or off-black)
|
||||
--theme-text: #000000; // Text color (Should contrast bg-primary)
|
||||
--theme-muted: #6c757d; // Muted text color (Should have less contrast against bg-primary)
|
||||
--theme-background: #fafafa;
|
||||
--theme-background-contrast: white;
|
||||
|
||||
--theme-surface: #ffffff;
|
||||
--theme-border: #E5E7EB;
|
||||
--theme-muted: #6c757d;
|
||||
--theme-text: #000000;
|
||||
|
||||
--theme-lighter: rgba(255, 255, 255, 0.05);
|
||||
--theme-darker: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
// Dark theme
|
||||
.theme-dark {
|
||||
--theme-clear: #2e2e2e; // Content background (Usually white or off-black)
|
||||
--theme-text: #ffffff; // Text color (Should contrast bg-primary)
|
||||
--theme-muted: #cccccc; // Muted text color (Should have less contrast against bg-primary)
|
||||
--theme-background: #1a1a1a;
|
||||
--theme-background-contrast: black;
|
||||
|
||||
--theme-surface: #2e2e2e;
|
||||
--theme-border: #374151;
|
||||
--theme-muted: #cccccc;
|
||||
--theme-text: #ffffff;
|
||||
|
||||
--theme-lighter: rgba(255, 255, 255, 0.1);
|
||||
--theme-darker: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
$breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px); // Device size
|
||||
$sizes: (0: 0, 1: 0.25rem, 2: 0.5rem, 3: 1rem, 4: 1.5rem, 5: 2.5rem); // Padding/Margin, etc...
|
||||
$breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px);
|
||||
$sizes: (0: 0, 1: 0.25rem, 2: 0.5rem, 3: 1rem, 4: 1.5rem, 5: 2.5rem);
|
||||
|
||||
// Don't edit past this point ===============================================================================
|
||||
|
||||
@@ -46,38 +61,21 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
|
||||
// "Fixes" ==================================================================================================
|
||||
|
||||
// Optional opinionated styling to clean up CSS defaults
|
||||
|
||||
.fix-anchor, .fix:not(.no-anchor-fix) {
|
||||
// Base resets applied like Bootstrap's reboot
|
||||
.fix-anchor {
|
||||
a, a:not([href]) {
|
||||
cursor: pointer;
|
||||
color: var(--theme-primary);
|
||||
&:not(:hover):not(:focus) { text-decoration: none; }
|
||||
text-decoration: none;
|
||||
&:hover, &:focus { text-decoration: underline; }
|
||||
}
|
||||
}
|
||||
|
||||
.no-fix, .no-anchor-fix {
|
||||
a, a:not([href]) {
|
||||
cursor: auto;
|
||||
color: inherit;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
.fix-button {
|
||||
button:not(:disabled) { cursor: pointer; }
|
||||
}
|
||||
|
||||
.fix-button, .fix:not(.no-button-fix) {
|
||||
button:not(:disabled) {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.no-fix, .no-button-fix {
|
||||
button:not(:disabled) {
|
||||
cursor: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.fix-dom, .fix:not(.no-dom-fix) {
|
||||
.fix-dom {
|
||||
&, html, body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
@@ -85,40 +83,19 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
padding: 0;
|
||||
overflow: auto;
|
||||
color: var(--theme-text);
|
||||
background-color: var(--theme-backdrop);
|
||||
background-color: var(--theme-background);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
}
|
||||
|
||||
.no-fix, .no-dom-fix {
|
||||
&, html, body {
|
||||
height: auto;
|
||||
width: auto;
|
||||
margin: revert;
|
||||
padding: revert;
|
||||
overflow: visible;
|
||||
color: revert;
|
||||
background-color: transparent;
|
||||
}
|
||||
* { box-sizing: content-box; }
|
||||
}
|
||||
|
||||
.fix-focus, .fix:not(.no-focus-fix) {
|
||||
.fix-focus {
|
||||
* {
|
||||
outline: inherit;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.no-fix, .no-focus-fix {
|
||||
* {
|
||||
outline: revert;
|
||||
-webkit-tap-highlight-color: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.fix-font, .fix:not(.no-font-fix) {
|
||||
.fix-font {
|
||||
color: var(--theme-text);
|
||||
font-family: var(--theme-font), sans-serif;
|
||||
|
||||
@@ -132,21 +109,44 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
h6 { font-weight: 500; font-size: 1rem; }
|
||||
}
|
||||
|
||||
.no-fix, .no-font-fix {
|
||||
color: revert;
|
||||
font-family: revert;
|
||||
p, input, select, textarea, button { font-size: revert; }
|
||||
h1, h2, h3, h4, h5, h6, p { margin: revert; }
|
||||
h1, h2, h3, h4, h5, h6 { font-weight: revert; font-size: revert; }
|
||||
.fix-scrollbar {
|
||||
* {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--theme-primary) var(--theme-background);
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-track {
|
||||
background: var(--theme-background);
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background-color: var(--theme-primary);
|
||||
border-radius: 4px;
|
||||
border: 2px solid var(--theme-background);
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--theme-accent);
|
||||
}
|
||||
}
|
||||
|
||||
.reset {
|
||||
all: revert !important;
|
||||
// Apply all fixes by default (like Bootstrap)
|
||||
.fix {
|
||||
@extend .fix-anchor;
|
||||
@extend .fix-button;
|
||||
@extend .fix-dom;
|
||||
@extend .fix-focus;
|
||||
@extend .fix-font;
|
||||
@extend .fix-scrollbar;
|
||||
}
|
||||
|
||||
// Misc =====================================================================================================
|
||||
|
||||
// Center
|
||||
.center {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
@@ -154,9 +154,10 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
// Clamp (Restrict page width for large screens)
|
||||
.clamp { width: min(var(--theme-content-width), calc(100% - map.get($sizes, 3))); }
|
||||
|
||||
.reset { all: revert !important; }
|
||||
|
||||
// Utilities ================================================================================================
|
||||
|
||||
// Anchor
|
||||
@@ -194,40 +195,73 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
.brbr-#{$s}, .brb-#{$s}, .bre-#{$s}, .br-#{$s} { border-bottom-right-radius: $size !important; }
|
||||
}
|
||||
|
||||
// Colors - Background
|
||||
.bg-backdrop { background-color: var(--theme-backdrop) !important; }
|
||||
.bg-black { background-color: var(--theme-black) !important; }
|
||||
.bg-white { background-color: var(--theme-white) !important; }
|
||||
// Border - Style
|
||||
.b-dash { border-style: dashed !important; }
|
||||
.b-dot { border-style: dotted !important; }
|
||||
.b-double { border-style: double !important; }
|
||||
.b-none { border-style: none !important; }
|
||||
.b-solid { border-style: solid !important; }
|
||||
|
||||
// Colors - Shared mixin for efficiency
|
||||
@mixin color-variant($name, $bg-var, $fg-var: null) {
|
||||
.b-#{$name} { border-color: var(--theme-#{$bg-var}) !important; }
|
||||
.bg-#{$name} {
|
||||
background-color: var(--theme-#{$bg-var}) !important;
|
||||
@if $fg-var {
|
||||
color: var(--theme-#{$fg-var});
|
||||
text-decoration-color: var(--theme-#{$fg-var});
|
||||
}
|
||||
}
|
||||
.fg-#{$name} {
|
||||
color: var(--theme-#{$bg-var}) !important;
|
||||
text-decoration-color: var(--theme-#{$bg-var}) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include color-variant('black', 'black');
|
||||
@include color-variant('white', 'white');
|
||||
@include color-variant('background', 'background');
|
||||
@include color-variant('background-contrast', 'background-contrast');
|
||||
@include color-variant('primary', 'primary', 'primary-contrast');
|
||||
@include color-variant('primary-contrast', 'primary-contrast');
|
||||
@include color-variant('accent', 'accent', 'accent-contrast');
|
||||
@include color-variant('accent-contrast', 'accent-contrast');
|
||||
@include color-variant('surface', 'surface');
|
||||
@include color-variant('border', 'border');
|
||||
@include color-variant('text', 'text');
|
||||
@include color-variant('muted', 'muted');
|
||||
@include color-variant('lighter', 'lighter');
|
||||
@include color-variant('darker', 'darker');
|
||||
@include color-variant('info', 'info');
|
||||
@include color-variant('success', 'success');
|
||||
@include color-variant('warn', 'warn');
|
||||
@include color-variant('danger', 'danger');
|
||||
|
||||
.bg-transparent { background-color: transparent !important; }
|
||||
.bg-container {
|
||||
background-color: var(--theme-clear) !important;
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
@each $color in ('primary', 'accent', 'text', 'info', 'success', 'warn', 'danger', 'muted') {
|
||||
.bg-#{$color} {
|
||||
|
||||
// Lighter/Darker pseudo variants
|
||||
@each $color in ('primary', 'accent', 'background', 'surface', 'info', 'success', 'warn', 'danger', 'muted') {
|
||||
.bg-#{$color}-lighter, .bg-#{$color}-darker {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.bg-#{$color}::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: var(--theme-#{$color});
|
||||
filter: saturate(.5) brightness(150%);
|
||||
border-radius: inherit;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
color: var(--theme-#{$color}-contrast);
|
||||
text-decoration-color: var(--theme-#{$color}-contrast);
|
||||
|
||||
// Colors - Foreground
|
||||
@each $color in ('black', 'clear', 'white', 'text', 'primary', 'accent', 'info', 'success', 'warn', 'danger', 'muted') {
|
||||
.fg-#{$color} {
|
||||
color: var(--theme-#{$color}) !important;
|
||||
text-decoration-color: var(--theme-#{$color}) !important;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-color: var(--theme-#{$color});
|
||||
border-radius: inherit;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
.bg-#{$color}-lighter::before { filter: saturate(.5) brightness(150%); }
|
||||
.bg-#{$color}-darker::before { filter: saturate(.5) brightness(50%); }
|
||||
}
|
||||
|
||||
// Cursors
|
||||
@@ -240,9 +274,9 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
.fs-bold { font-weight: 500 !important; }
|
||||
.fs-normal { font-weight: normal !important; }
|
||||
.fs-italic { font-style: italic !important; }
|
||||
.fs-none { font-style: normal !important; }
|
||||
.fs-norm { font-style: normal !important; }
|
||||
.fs-lighter { font-weight: lighter !important; }
|
||||
.fs-no-dec { text-decoration: none !important; }
|
||||
.fs-none { text-decoration: none !important; }
|
||||
.fs-strike { text-decoration: line-through !important; }
|
||||
.fs-underline { text-decoration: underline !important; }
|
||||
.fs-strike.fs-underline { text-decoration: line-through underline !important; }
|
||||
@@ -275,15 +309,18 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
.fs-capitalize { text-transform: capitalize !important; }
|
||||
|
||||
// Hover
|
||||
.curs-hover:hover, .hover:hover { filter: brightness(125%) !important; }
|
||||
.curs-hover:hover {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
.hover:hover { filter: brightness(125%) !important; }
|
||||
.curs-hover {
|
||||
&:hover {
|
||||
filter: brightness(125%) !important;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Opacity
|
||||
@each $div in $divisible {
|
||||
.o-#{$div} { opacity: #{$div}#{'%'} !important; }
|
||||
.o-#{$div} { opacity: #{$div * 0.01} !important; }
|
||||
}
|
||||
|
||||
// Overflow
|
||||
@@ -299,17 +336,38 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
}
|
||||
|
||||
@each $div in $divisible {
|
||||
.bottom-#{$div} { bottom: #{$div}#{'%'} !important; }
|
||||
.end-#{$div} { right: #{$div}#{'%'} !important; }
|
||||
.start-#{$div} { left: #{$div}#{'%'} !important; }
|
||||
.top-#{$div} { top: #{$div}#{'%'} !important; }
|
||||
.bottom-#{$div} { bottom: #{$div * 1%} !important; }
|
||||
.end-#{$div} { right: #{$div * 1%} !important; }
|
||||
.start-#{$div} { left: #{$div * 1%} !important; }
|
||||
.top-#{$div} { top: #{$div * 1%} !important; }
|
||||
}
|
||||
|
||||
// Shadows
|
||||
.shadow { box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 !important; }
|
||||
.shadow-drop { filter: drop-shadow(0px 1px 2.5px black) !important; }
|
||||
.shadow-white { filter: drop-shadow(0px 1px 2.5px white) !important; }
|
||||
.shadow-none { box-shadow: none !important; }
|
||||
.shadow-1 { box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-2 { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08) !important; }
|
||||
.shadow,.shadow-3 { box-shadow: 0 4px 6px rgba(0,0,0,0.10), 0 2px 4px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-4 { box-shadow: 0 10px 15px rgba(0,0,0,0.10), 0 4px 6px rgba(0,0,0,0.06) !important; }
|
||||
.shadow-5 { box-shadow: 0 20px 25px rgba(0,0,0,0.12), 0 10px 10px rgba(0,0,0,0.06) !important; }
|
||||
.shadow-top { box-shadow: 0 -4px 6px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-bottom { box-shadow: 0 4px 6px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-start { box-shadow: -4px 0 6px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-end { box-shadow: 4px 0 6px rgba(0,0,0,0.08) !important; }
|
||||
.shadow-inset-1 { box-shadow: inset 0 1px 2px rgba(0,0,0,0.10) !important; }
|
||||
.shadow-inset-2 { box-shadow: inset 0 2px 6px rgba(0,0,0,0.12) !important; }
|
||||
.shadow-drop-sm { filter: drop-shadow(0 1px 1px rgba(0,0,0,0.25)) !important; }
|
||||
.shadow-drop { filter: drop-shadow(0 2px 4px rgba(0,0,0,0.30)) !important; }
|
||||
.shadow-drop-lg { filter: drop-shadow(0 4px 8px rgba(0,0,0,0.35)) !important; }
|
||||
@each $color, $value in (
|
||||
'primary': #2d5dc5,
|
||||
'accent': #15439a,
|
||||
'info': #6157cc,
|
||||
'success': #65c147,
|
||||
'warn': #d88750,
|
||||
'danger': #bf4f4f
|
||||
) {
|
||||
.shadow-#{$color} { box-shadow: 0 4px 14px rgba($value, 0.35) !important; }
|
||||
}
|
||||
|
||||
// User Select
|
||||
@each $s in ('all', 'auto', 'none', 'text') {
|
||||
@@ -323,7 +381,7 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
|
||||
// Breakpoint rules
|
||||
@mixin utilities($bp) {
|
||||
@if $bp != null { $bp: '-#{$bp}'; }
|
||||
@if $bp != null { $bp: '-#{$bp}'; } @else { $bp: ''; }
|
||||
|
||||
// Alignment
|
||||
.align-x#{$bp} { text-align: center !important; }
|
||||
@@ -386,7 +444,7 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
display: inline-flex !important;
|
||||
flex-direction: row-reverse !important;
|
||||
}
|
||||
.flex#{$bp}-fill { flex: 1 1 auto; }
|
||||
.flex#{$bp}-fill { flex: 1 1 auto !important; }
|
||||
.flex#{$bp}-fill-even {
|
||||
flex-basis: 0 !important;
|
||||
flex-grow: 1 !important;
|
||||
@@ -414,15 +472,15 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
}
|
||||
|
||||
// Height
|
||||
.h-auto { height: auto !important; }
|
||||
.h#{$bp}-auto { height: auto !important; }
|
||||
@each $div in $divisible {
|
||||
.h#{$bp}-#{$div} { height: #{$div}#{'%'} !important; }
|
||||
.h#{$bp}-#{$div} { height: #{$div * 1%} !important; }
|
||||
}
|
||||
|
||||
// Width
|
||||
.w-auto { width: auto !important; }
|
||||
.w#{$bp}-auto { width: auto !important; }
|
||||
@each $div in $divisible {
|
||||
.w#{$bp}-#{$div} { width: #{$div}#{'%'} !important; }
|
||||
.w#{$bp}-#{$div} { width: #{$div * 1%} !important; }
|
||||
}
|
||||
|
||||
// Object Fit
|
||||
@@ -432,52 +490,60 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
.fit#{$bp}-scale { object-fit: scale-down !important; }
|
||||
.fit#{$bp}-none { object-fit: none !important; }
|
||||
|
||||
.m#{$bp}-auto { margin: auto !important; } // Margin
|
||||
.mx#{$bp}-auto { // Margin
|
||||
// Margin auto
|
||||
.m#{$bp}-auto { margin: auto !important; }
|
||||
.mx#{$bp}-auto {
|
||||
margin-left: auto !important;
|
||||
margin-right: auto !important;
|
||||
}
|
||||
.my#{$bp}-auto { // Margin
|
||||
.my#{$bp}-auto {
|
||||
margin-top: auto !important;
|
||||
margin-bottom: auto !important;
|
||||
}
|
||||
|
||||
// Visibility
|
||||
.visible#{$bp} { visibility: visible !important; }
|
||||
.hidden#{$bp} { visibility: hidden !important; }
|
||||
.visible#{$bp} { visibility: visible !important; }
|
||||
.hidden#{$bp} { visibility: hidden !important; }
|
||||
|
||||
@each $s, $size in $sizes {
|
||||
.gap#{$bp}-#{$s} { gap: $size !important; } // Gap
|
||||
.b#{$bp}-#{$s} { border: #{$s}px solid var(--theme-border) !important; } // Border
|
||||
.m#{$bp}-#{$s} { margin: $size !important; } // Margin
|
||||
.p#{$bp}-#{$s} { padding: $size !important; } // Padding
|
||||
.mx#{$bp}-#{$s} { // Margin
|
||||
.gap#{$bp}-#{$s} { gap: $size !important; }
|
||||
.b#{$bp}-#{$s} {
|
||||
border-width: #{$s}px !important;
|
||||
border-style: solid;
|
||||
border-color: var(--theme-border);
|
||||
}
|
||||
.m#{$bp}-#{$s} { margin: $size !important; }
|
||||
.p#{$bp}-#{$s} { padding: $size !important; }
|
||||
.mx#{$bp}-#{$s} {
|
||||
margin-left: $size !important;
|
||||
margin-right: $size !important;
|
||||
}
|
||||
.px#{$bp}-#{$s} { // Padding
|
||||
.px#{$bp}-#{$s} {
|
||||
padding-left: $size !important;
|
||||
padding-right: $size !important;
|
||||
}
|
||||
.my#{$bp}-#{$s} { // Margin
|
||||
.my#{$bp}-#{$s} {
|
||||
margin-top: $size !important;
|
||||
margin-bottom: $size !important;
|
||||
}
|
||||
.py#{$bp}-#{$s} { // Padding
|
||||
.py#{$bp}-#{$s} {
|
||||
padding-top: $size !important;
|
||||
padding-bottom: $size !important;
|
||||
}
|
||||
|
||||
.order#{$bp}-#{$s} { order: $s !important; } // Flex order
|
||||
.order#{$bp}-#{$s} { order: $s !important; }
|
||||
}
|
||||
|
||||
@each $d, $dir in $direction {
|
||||
.m#{$d}#{$bp}-auto { margin-#{$dir}: auto !important; } // Margin
|
||||
.m#{$d}#{$bp}-auto { margin-#{$dir}: auto !important; }
|
||||
|
||||
@each $s, $size in $sizes {
|
||||
.b#{$d}#{$bp}-#{$s} { border-#{$dir}: #{$s}px solid var(--theme-border) !important; } // Border
|
||||
.m#{$d}#{$bp}-#{$s} { margin-#{$dir}: $size !important; } // Margin
|
||||
.p#{$d}#{$bp}-#{$s} { padding-#{$dir}: $size !important; } // Padding
|
||||
.b#{$d}#{$bp}-#{$s} {
|
||||
border-#{$dir}-width: #{$s}px !important;
|
||||
border-#{$dir}-style: solid;
|
||||
border-#{$dir}-color: var(--theme-border);
|
||||
}
|
||||
.m#{$d}#{$bp}-#{$s} { margin-#{$dir}: $size !important; }
|
||||
.p#{$d}#{$bp}-#{$s} { padding-#{$dir}: $size !important; }
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -489,17 +555,3 @@ $divisible: (0, 10, 20, 25, 30, 33, 34, 40, 50, 60, 66, 70, 75, 80, 90, 100);
|
||||
@include utilities($breakpoint);
|
||||
}
|
||||
}
|
||||
|
||||
// Border - Colors
|
||||
@each $color in ('black', 'white', 'primary', 'accent', 'info', 'success', 'text', 'warn', 'danger', 'muted') {
|
||||
.b-#{$color} { border-color: var(--theme-#{$color}) !important; }
|
||||
}
|
||||
|
||||
// Border - Style
|
||||
.b-dash { border-style: dashed !important; }
|
||||
.b-dot-dash { border-style: dot-dash !important; }
|
||||
.b-dot-dot-dash { border-style: dot-dot-dash !important; }
|
||||
.b-dot { border-style: dotted !important; }
|
||||
.b-double { border-style: double !important; }
|
||||
.b-none { border-style: none !important; }
|
||||
.b-solid { border-style: solid !important; }
|
||||
|
||||
Reference in New Issue
Block a user