diff --git a/core/package-lock.json b/core/package-lock.json index cb9cbf4f5e..9a95644915 100644 --- a/core/package-lock.json +++ b/core/package-lock.json @@ -44,11 +44,12 @@ "fs-extra": "^9.0.1", "jest": "^29.7.0", "jest-cli": "^29.7.0", + "outsystems-design-tokens": "^1.0.1", "prettier": "^2.8.8", "rollup": "^2.26.4", "sass": "^1.33.0", "serve": "^14.0.1", - "style-dictionary": "^3.9.2", + "style-dictionary": "^4.1.3", "stylelint": "^13.13.1", "stylelint-order": "^4.1.0" } @@ -615,6 +616,97 @@ "dev": true, "license": "MIT" }, + "node_modules/@bundled-es-modules/deepmerge": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/@bundled-es-modules/deepmerge/-/deepmerge-4.3.1.tgz", + "integrity": "sha512-Rk453EklPUPC3NRWc3VUNI/SSUjdBaFoaQvFRmNBNtMHVtOFD5AntiWg5kEE1hqcPqedYFDzxE3ZcMYPcA195w==", + "dev": true, + "license": "ISC", + "dependencies": { + "deepmerge": "^4.3.1" + } + }, + "node_modules/@bundled-es-modules/glob": { + "version": "10.4.2", + "resolved": "https://registry.npmjs.org/@bundled-es-modules/glob/-/glob-10.4.2.tgz", + "integrity": "sha512-740y5ofkzydsFao5EXJrGilcIL6EFEw/cmPf2uhTw9J6G1YOhiIFjNFCHdpgEiiH5VlU3G0SARSjlFlimRRSMA==", + "dev": true, + "hasInstallScript": true, + "license": "ISC", + "dependencies": { + "buffer": "^6.0.3", + "events": "^3.3.0", + "glob": "^10.4.2", + "patch-package": "^8.0.0", + "path": "^0.12.7", + "stream": "^0.0.3", + "string_decoder": "^1.3.0", + "url": "^0.11.3" + } + }, + "node_modules/@bundled-es-modules/glob/node_modules/brace-expansion": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", + "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "dev": true, + "license": "MIT", + "dependencies": { + "balanced-match": "^1.0.0" + } + }, + "node_modules/@bundled-es-modules/glob/node_modules/glob": { + "version": "10.4.5", + "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz", + "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==", + "dev": true, + "license": "ISC", + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^3.1.2", + "minimatch": "^9.0.4", + "minipass": "^7.1.2", + "package-json-from-dist": "^1.0.0", + "path-scurry": "^1.11.1" + }, + "bin": { + "glob": "dist/esm/bin.mjs" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/@bundled-es-modules/glob/node_modules/minimatch": { + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", + "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", + "dev": true, + "license": "ISC", + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/@bundled-es-modules/memfs": { + "version": "4.9.4", + "resolved": "https://registry.npmjs.org/@bundled-es-modules/memfs/-/memfs-4.9.4.tgz", + "integrity": "sha512-1XyYPUaIHwEOdF19wYVLBtHJRr42Do+3ctht17cZOHwHf67vkmRNPlYDGY2kJps4RgE5+c7nEZmEzxxvb1NZWA==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "assert": "^2.0.0", + "buffer": "^6.0.3", + "events": "^3.3.0", + "memfs": "^4.9.3", + "path": "^0.12.7", + "stream": "^0.0.3", + "util": "^0.12.5" + } + }, "node_modules/@capacitor/core": { "version": "6.1.2", "dev": true, @@ -1641,6 +1733,63 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, + "node_modules/@jsonjoy.com/base64": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-1.1.2.tgz", + "integrity": "sha512-q6XAnWQDIMA3+FTiOYajoYqySkO+JSat0ytXGSuRdq9uXE7o92gzuQwQM14xaCRlBLGq3v5miDGC4vkVTn54xA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=10.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/streamich" + }, + "peerDependencies": { + "tslib": "2" + } + }, + "node_modules/@jsonjoy.com/json-pack": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.1.0.tgz", + "integrity": "sha512-zlQONA+msXPPwHWZMKFVS78ewFczIll5lXiVPwFPCZUsrOKdxc2AvxU1HoNBmMRhqDZUR9HkC3UOm+6pME6Xsg==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@jsonjoy.com/base64": "^1.1.1", + "@jsonjoy.com/util": "^1.1.2", + "hyperdyperid": "^1.2.0", + "thingies": "^1.20.0" + }, + "engines": { + "node": ">=10.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/streamich" + }, + "peerDependencies": { + "tslib": "2" + } + }, + "node_modules/@jsonjoy.com/util": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@jsonjoy.com/util/-/util-1.5.0.tgz", + "integrity": "sha512-ojoNsrIuPI9g6o8UxhraZQSyF2ByJanAY4cTFbc8Mf2AXEF4aQRGY1dJxyJpuyav8r9FGflEt/Ff3u5Nt6YMPA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=10.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/streamich" + }, + "peerDependencies": { + "tslib": "2" + } + }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.3", "dev": true, @@ -2405,11 +2554,30 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@yarnpkg/lockfile": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz", + "integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==", + "dev": true, + "license": "BSD-2-Clause" + }, "node_modules/@zeit/schemas": { "version": "2.21.0", "dev": true, "license": "MIT" }, + "node_modules/@zip.js/zip.js": { + "version": "2.7.52", + "resolved": "https://registry.npmjs.org/@zip.js/zip.js/-/zip.js-2.7.52.tgz", + "integrity": "sha512-+5g7FQswvrCHwYKNMd/KFxZSObctLSsQOgqBSi0LzwHo3li9Eh1w5cF5ndjQw9Zbr3ajVnd2+XyiX85gAetx1Q==", + "dev": true, + "license": "BSD-3-Clause", + "engines": { + "bun": ">=0.7.0", + "deno": ">=1.0.0", + "node": ">=16.5.0" + } + }, "node_modules/accepts": { "version": "1.3.8", "dev": true, @@ -2599,6 +2767,20 @@ "node": ">=0.10.0" } }, + "node_modules/assert": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/assert/-/assert-2.1.0.tgz", + "integrity": "sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==", + "dev": true, + "license": "MIT", + "dependencies": { + "call-bind": "^1.0.2", + "is-nan": "^1.3.2", + "object-is": "^1.1.5", + "object.assign": "^4.1.4", + "util": "^0.12.5" + } + }, "node_modules/at-least-node": { "version": "1.0.0", "dev": true, @@ -2628,6 +2810,22 @@ "url": "https://tidelift.com/funding/github/npm/autoprefixer" } }, + "node_modules/available-typed-arrays": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz", + "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "possible-typed-array-names": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/axe-core": { "version": "4.10.0", "dev": true, @@ -2804,6 +3002,27 @@ "dev": true, "license": "MIT" }, + "node_modules/base64-js": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz", + "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT" + }, "node_modules/binary-extensions": { "version": "2.1.0", "dev": true, @@ -2952,6 +3171,31 @@ "node-int64": "^0.4.0" } }, + "node_modules/buffer": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz", + "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "base64-js": "^1.3.1", + "ieee754": "^1.2.1" + } + }, "node_modules/buffer-from": { "version": "1.1.2", "dev": true, @@ -2977,12 +3221,20 @@ } }, "node_modules/call-bind": { - "version": "1.0.2", + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz", + "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==", "dev": true, "license": "MIT", "dependencies": { - "function-bind": "^1.1.1", - "get-intrinsic": "^1.0.2" + "es-define-property": "^1.0.0", + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "get-intrinsic": "^1.2.4", + "set-function-length": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -2996,17 +3248,6 @@ "node": ">=6" } }, - "node_modules/camel-case": { - "version": "4.1.2", - "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz", - "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==", - "dev": true, - "license": "MIT", - "dependencies": { - "pascal-case": "^3.1.2", - "tslib": "^2.0.3" - } - }, "node_modules/camelcase": { "version": "5.3.1", "dev": true, @@ -3046,18 +3287,6 @@ ], "license": "CC-BY-4.0" }, - "node_modules/capital-case": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", - "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, - "license": "MIT", - "dependencies": { - "no-case": "^3.0.4", - "tslib": "^2.0.3", - "upper-case-first": "^2.0.2" - } - }, "node_modules/chalk": { "version": "5.3.0", "dev": true, @@ -3129,25 +3358,11 @@ "license": "MIT" }, "node_modules/change-case": { - "version": "4.1.2", - "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", - "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", + "version": "5.4.4", + "resolved": "https://registry.npmjs.org/change-case/-/change-case-5.4.4.tgz", + "integrity": "sha512-HRQyTk2/YPEkt9TnUPbOpr64Uw3KOicFWPVBb+xiHvd6eBx/qPr9xqfBFDT8P2vWsvvz4jbEkfDe71W3VyNu2w==", "dev": true, - "license": "MIT", - "dependencies": { - "camel-case": "^4.1.2", - "capital-case": "^1.0.4", - "constant-case": "^3.0.4", - "dot-case": "^3.0.4", - "header-case": "^2.0.4", - "no-case": "^3.0.4", - "param-case": "^3.0.4", - "pascal-case": "^3.1.2", - "path-case": "^3.0.4", - "sentence-case": "^3.0.4", - "snake-case": "^3.0.4", - "tslib": "^2.0.3" - } + "license": "MIT" }, "node_modules/char-regex": { "version": "1.0.2", @@ -3487,6 +3702,19 @@ "node": ">= 10" } }, + "node_modules/component-emitter": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-2.0.0.tgz", + "integrity": "sha512-4m5s3Me2xxlVKG9PkZpQqHQR7bgpnN7joDMJ4yvVkVXngjoITG76IaZmzmywSeRTeTpc6N6r3H3+KyUurV8OYw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/compressible": { "version": "2.0.18", "dev": true, @@ -3520,18 +3748,6 @@ "dev": true, "license": "MIT" }, - "node_modules/constant-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", - "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "no-case": "^3.0.4", - "tslib": "^2.0.3", - "upper-case": "^2.0.2" - } - }, "node_modules/content-disposition": { "version": "0.5.2", "dev": true, @@ -3710,22 +3926,49 @@ "license": "MIT" }, "node_modules/deepmerge": { - "version": "4.2.2", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", + "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" } }, - "node_modules/define-properties": { - "version": "1.1.3", + "node_modules/define-data-property": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz", + "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==", "dev": true, "license": "MIT", "dependencies": { - "object-keys": "^1.0.12" + "es-define-property": "^1.0.0", + "es-errors": "^1.3.0", + "gopd": "^1.0.1" }, "engines": { "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/define-properties": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz", + "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==", + "dev": true, + "license": "MIT", + "dependencies": { + "define-data-property": "^1.0.1", + "has-property-descriptors": "^1.0.0", + "object-keys": "^1.1.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" } }, "node_modules/detect-newline": { @@ -3810,17 +4053,6 @@ "domelementtype": "1" } }, - "node_modules/dot-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", - "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, - "license": "MIT", - "dependencies": { - "no-case": "^3.0.4", - "tslib": "^2.0.3" - } - }, "node_modules/eastasianwidth": { "version": "0.2.0", "dev": true, @@ -3904,6 +4136,29 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/es-define-property": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz", + "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "get-intrinsic": "^1.2.4" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-errors": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", + "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/es-to-primitive": { "version": "1.2.1", "dev": true, @@ -4500,6 +4755,16 @@ "node": ">=0.10.0" } }, + "node_modules/events": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz", + "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.8.x" + } + }, "node_modules/execa": { "version": "8.0.1", "dev": true, @@ -4677,6 +4942,16 @@ "node": ">=8" } }, + "node_modules/find-yarn-workspace-root": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz", + "integrity": "sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "micromatch": "^4.0.2" + } + }, "node_modules/flat-cache": { "version": "3.0.4", "dev": true, @@ -4694,6 +4969,16 @@ "dev": true, "license": "ISC" }, + "node_modules/for-each": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", + "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-callable": "^1.1.3" + } + }, "node_modules/foreground-child": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.0.tgz", @@ -4756,9 +5041,14 @@ } }, "node_modules/function-bind": { - "version": "1.1.1", + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", + "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", "dev": true, - "license": "MIT" + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } }, "node_modules/functional-red-black-tree": { "version": "1.0.1", @@ -4782,13 +5072,20 @@ } }, "node_modules/get-intrinsic": { - "version": "1.1.1", + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz", + "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==", "dev": true, "license": "MIT", "dependencies": { - "function-bind": "^1.1.1", - "has": "^1.0.3", - "has-symbols": "^1.0.1" + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "has-proto": "^1.0.1", + "has-symbols": "^1.0.3", + "hasown": "^2.0.0" + }, + "engines": { + "node": ">= 0.4" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -4950,6 +5247,19 @@ "node": ">=0.6.0" } }, + "node_modules/gopd": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", + "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==", + "dev": true, + "license": "MIT", + "dependencies": { + "get-intrinsic": "^1.1.3" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/graceful-fs": { "version": "4.2.9", "dev": true, @@ -4995,6 +5305,32 @@ "node": ">=4" } }, + "node_modules/has-property-descriptors": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz", + "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==", + "dev": true, + "license": "MIT", + "dependencies": { + "es-define-property": "^1.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-proto": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz", + "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/has-symbols": { "version": "1.0.3", "dev": true, @@ -5007,11 +5343,13 @@ } }, "node_modules/has-tostringtag": { - "version": "1.0.0", + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz", + "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==", "dev": true, "license": "MIT", "dependencies": { - "has-symbols": "^1.0.2" + "has-symbols": "^1.0.3" }, "engines": { "node": ">= 0.4" @@ -5020,15 +5358,17 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/header-case": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", - "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", + "node_modules/hasown": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", + "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", "dev": true, "license": "MIT", "dependencies": { - "capital-case": "^1.0.4", - "tslib": "^2.0.3" + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" } }, "node_modules/hosted-git-info": { @@ -5070,6 +5410,37 @@ "node": ">=16.17.0" } }, + "node_modules/hyperdyperid": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/hyperdyperid/-/hyperdyperid-1.2.0.tgz", + "integrity": "sha512-Y93lCzHYgGWdrJ66yIktxiaGULYc6oGiABxhcO5AufBeOyoIdZF7bIfLaOrbM0iGIOXQQgxxRrFEnb+Y6w1n4A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10.18" + } + }, + "node_modules/ieee754": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz", + "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "BSD-3-Clause" + }, "node_modules/ignore": { "version": "5.2.4", "dev": true, @@ -5215,6 +5586,23 @@ "url": "https://github.com/sponsors/wooorm" } }, + "node_modules/is-arguments": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz", + "integrity": "sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==", + "dev": true, + "license": "MIT", + "dependencies": { + "call-bind": "^1.0.2", + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-arrayish": { "version": "0.2.1", "dev": true, @@ -5362,6 +5750,22 @@ "node": ">=6" } }, + "node_modules/is-generator-function": { + "version": "1.0.10", + "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz", + "integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==", + "dev": true, + "license": "MIT", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-glob": { "version": "4.0.3", "dev": true, @@ -5387,6 +5791,23 @@ "dev": true, "license": "MIT" }, + "node_modules/is-nan": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/is-nan/-/is-nan-1.3.2.tgz", + "integrity": "sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==", + "dev": true, + "license": "MIT", + "dependencies": { + "call-bind": "^1.0.0", + "define-properties": "^1.1.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-negative-zero": { "version": "2.0.2", "dev": true, @@ -5509,6 +5930,22 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-typed-array": { + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz", + "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==", + "dev": true, + "license": "MIT", + "dependencies": { + "which-typed-array": "^1.1.14" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-typedarray": { "version": "1.0.0", "dev": true, @@ -5547,6 +5984,13 @@ "node": ">=8" } }, + "node_modules/isarray": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz", + "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==", + "dev": true, + "license": "MIT" + }, "node_modules/isexe": { "version": "2.0.0", "dev": true, @@ -7022,6 +7466,25 @@ "dev": true, "license": "MIT" }, + "node_modules/json-stable-stringify": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.1.1.tgz", + "integrity": "sha512-SU/971Kt5qVQfJpyDveVhQ/vya+5hvrjClFOcr8c0Fq5aODJjMwutrOfCU+eCnVD5gpx1Q3fEqkyom77zH1iIg==", + "dev": true, + "license": "MIT", + "dependencies": { + "call-bind": "^1.0.5", + "isarray": "^2.0.5", + "jsonify": "^0.0.1", + "object-keys": "^1.1.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/json-stable-stringify-without-jsonify": { "version": "1.0.1", "dev": true, @@ -7040,13 +7503,6 @@ "node": ">=6" } }, - "node_modules/jsonc-parser": { - "version": "3.3.1", - "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.3.1.tgz", - "integrity": "sha512-HUgH65KyejrUFPvHFPbqOY0rsFip3Bo5wb4ngvdi1EpCYWUQDC5V+Y7mZws+DLkr4M//zQJoanu1SP+87Dv1oQ==", - "dev": true, - "license": "MIT" - }, "node_modules/jsonfile": { "version": "6.1.0", "dev": true, @@ -7066,6 +7522,16 @@ "node": ">= 10.0.0" } }, + "node_modules/jsonify": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.1.tgz", + "integrity": "sha512-2/Ki0GcmuqSrgFyelQq9M05y7PS0mEwuIzrf3f1fPqkVDVRvZrPZtVSMHxdgo8Aq0sxAOb/cr2aqqA3LeWHVPg==", + "dev": true, + "license": "Public Domain", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/kind-of": { "version": "6.0.3", "dev": true, @@ -7074,6 +7540,16 @@ "node": ">=0.10.0" } }, + "node_modules/klaw-sync": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz", + "integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "graceful-fs": "^4.1.11" + } + }, "node_modules/kleur": { "version": "3.0.3", "dev": true, @@ -7195,16 +7671,6 @@ "url": "https://github.com/sponsors/wooorm" } }, - "node_modules/lower-case": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", - "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, - "license": "MIT", - "dependencies": { - "tslib": "^2.0.3" - } - }, "node_modules/lru-cache": { "version": "6.0.0", "dev": true, @@ -7314,6 +7780,26 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/memfs": { + "version": "4.13.0", + "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.13.0.tgz", + "integrity": "sha512-dIs5KGy24fbdDhIAg0RxXpFqQp3RwL6wgSMRF9OSuphL/Uc9a4u2/SDJKPLj/zUgtOGKuHrRMrj563+IErj4Cg==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@jsonjoy.com/json-pack": "^1.0.3", + "@jsonjoy.com/util": "^1.3.0", + "tree-dump": "^1.0.1", + "tslib": "^2.0.0" + }, + "engines": { + "node": ">= 4.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/streamich" + } + }, "node_modules/meow": { "version": "9.0.0", "dev": true, @@ -7499,9 +7985,14 @@ } }, "node_modules/minimist": { - "version": "1.2.6", + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz", + "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==", "dev": true, - "license": "MIT" + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } }, "node_modules/minimist-options": { "version": "4.1.0", @@ -7544,17 +8035,6 @@ "node": ">= 0.6" } }, - "node_modules/no-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", - "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, - "license": "MIT", - "dependencies": { - "lower-case": "^2.0.2", - "tslib": "^2.0.3" - } - }, "node_modules/node-int64": { "version": "0.4.0", "dev": true, @@ -7628,9 +8108,31 @@ "license": "MIT" }, "node_modules/object-inspect": { - "version": "1.12.0", + "version": "1.13.2", + "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz", + "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==", "dev": true, "license": "MIT", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/object-is": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz", + "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" + }, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -7644,13 +8146,15 @@ } }, "node_modules/object.assign": { - "version": "4.1.2", + "version": "4.1.5", + "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz", + "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==", "dev": true, "license": "MIT", "dependencies": { - "call-bind": "^1.0.0", - "define-properties": "^1.1.3", - "has-symbols": "^1.0.1", + "call-bind": "^1.0.5", + "define-properties": "^1.2.1", + "has-symbols": "^1.0.3", "object-keys": "^1.1.1" }, "engines": { @@ -7706,6 +8210,141 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/open": { + "version": "7.4.2", + "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz", + "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-docker": "^2.0.0", + "is-wsl": "^2.1.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/os-tmpdir": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", + "integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/outsystems-design-tokens": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/outsystems-design-tokens/-/outsystems-design-tokens-1.0.1.tgz", + "integrity": "sha512-TLtZlk/dXLKSav8dKpOo3pO8K/gs2L4REDt4OEMDlm2JDqnBB604bGf1IIZxZerDFrOoPXdeeRr0mjKhVz7iwg==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "glob": "^11.0.0", + "minimist": "^1.2.8", + "style-dictionary": "^4.1.3" + }, + "bin": { + "build.tokens": "scripts/index.js" + } + }, + "node_modules/outsystems-design-tokens/node_modules/brace-expansion": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", + "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "dev": true, + "license": "MIT", + "dependencies": { + "balanced-match": "^1.0.0" + } + }, + "node_modules/outsystems-design-tokens/node_modules/glob": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/glob/-/glob-11.0.0.tgz", + "integrity": "sha512-9UiX/Bl6J2yaBbxKoEBRm4Cipxgok8kQYcOPEhScPwebu2I0HoQOuYdIO6S3hLuWoZgpDpwQZMzTFxgpkyT76g==", + "dev": true, + "license": "ISC", + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^4.0.1", + "minimatch": "^10.0.0", + "minipass": "^7.1.2", + "package-json-from-dist": "^1.0.0", + "path-scurry": "^2.0.0" + }, + "bin": { + "glob": "dist/esm/bin.mjs" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/outsystems-design-tokens/node_modules/jackspeak": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-4.0.2.tgz", + "integrity": "sha512-bZsjR/iRjl1Nk1UkjGpAzLNfQtzuijhn2g+pbZb98HQ1Gk8vM9hfbxeMBP+M2/UUdwj0RqGG3mlvk2MsAqwvEw==", + "dev": true, + "license": "BlueOak-1.0.0", + "dependencies": { + "@isaacs/cliui": "^8.0.2" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/outsystems-design-tokens/node_modules/lru-cache": { + "version": "11.0.1", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.0.1.tgz", + "integrity": "sha512-CgeuL5uom6j/ZVrg7G/+1IXqRY8JXX4Hghfy5YE0EhoYQWvndP1kufu58cmZLNIDKnRhZrXfdS9urVWx98AipQ==", + "dev": true, + "license": "ISC", + "engines": { + "node": "20 || >=22" + } + }, + "node_modules/outsystems-design-tokens/node_modules/minimatch": { + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.0.1.tgz", + "integrity": "sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==", + "dev": true, + "license": "ISC", + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/outsystems-design-tokens/node_modules/path-scurry": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-2.0.0.tgz", + "integrity": "sha512-ypGJsmGtdXUOeM5u93TyeIEfEhM6s+ljAhrk5vAvSx8uyY/02OvrZnA0YNGUrPXfpJMgI1ODd3nwz8Npx4O4cg==", + "dev": true, + "license": "BlueOak-1.0.0", + "dependencies": { + "lru-cache": "^11.0.0", + "minipass": "^7.1.2" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/p-limit": { "version": "2.3.0", "dev": true, @@ -7746,17 +8385,6 @@ "dev": true, "license": "BlueOak-1.0.0" }, - "node_modules/param-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", - "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, - "license": "MIT", - "dependencies": { - "dot-case": "^3.0.4", - "tslib": "^2.0.3" - } - }, "node_modules/parent-module": { "version": "1.0.1", "dev": true, @@ -7802,26 +8430,149 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/pascal-case": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz", - "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==", + "node_modules/patch-package": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/patch-package/-/patch-package-8.0.0.tgz", + "integrity": "sha512-da8BVIhzjtgScwDJ2TtKsfT5JFWz1hYoBl9rUQ1f38MC2HwnEIkK8VN3dKMKcP7P7bvvgzNDbfNHtx3MsQb5vA==", "dev": true, "license": "MIT", "dependencies": { - "no-case": "^3.0.4", - "tslib": "^2.0.3" + "@yarnpkg/lockfile": "^1.1.0", + "chalk": "^4.1.2", + "ci-info": "^3.7.0", + "cross-spawn": "^7.0.3", + "find-yarn-workspace-root": "^2.0.0", + "fs-extra": "^9.0.0", + "json-stable-stringify": "^1.0.2", + "klaw-sync": "^6.0.0", + "minimist": "^1.2.6", + "open": "^7.4.2", + "rimraf": "^2.6.3", + "semver": "^7.5.3", + "slash": "^2.0.0", + "tmp": "^0.0.33", + "yaml": "^2.2.2" + }, + "bin": { + "patch-package": "index.js" + }, + "engines": { + "node": ">=14", + "npm": ">5" } }, - "node_modules/path-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", - "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", + "node_modules/patch-package/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", "dev": true, "license": "MIT", "dependencies": { - "dot-case": "^3.0.4", - "tslib": "^2.0.3" + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/patch-package/node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/patch-package/node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/patch-package/node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true, + "license": "MIT" + }, + "node_modules/patch-package/node_modules/rimraf": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz", + "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==", + "deprecated": "Rimraf versions prior to v4 are no longer supported", + "dev": true, + "license": "ISC", + "dependencies": { + "glob": "^7.1.3" + }, + "bin": { + "rimraf": "bin.js" + } + }, + "node_modules/patch-package/node_modules/semver": { + "version": "7.6.3", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz", + "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==", + "dev": true, + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/patch-package/node_modules/slash": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz", + "integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/patch-package/node_modules/yaml": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.5.1.tgz", + "integrity": "sha512-bLQOjaX/ADgQ20isPJRvF0iRUHIxVhYvr53Of7wGcWlO2jvtUlH5m87DsmulFVxRpNLOnI4tB6p/oh8D7kpn9Q==", + "dev": true, + "license": "ISC", + "bin": { + "yaml": "bin.mjs" + }, + "engines": { + "node": ">= 14" + } + }, + "node_modules/path": { + "version": "0.12.7", + "resolved": "https://registry.npmjs.org/path/-/path-0.12.7.tgz", + "integrity": "sha512-aXXC6s+1w7otVF9UletFkFcDsJeO7lSZBPUQhtb5O0xJe8LtYhj/GxldoL09bBj9+ZmE2hNoHqQSFMN5fikh4Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "process": "^0.11.1", + "util": "^0.10.3" } }, "node_modules/path-exists": { @@ -7895,6 +8646,30 @@ "node": ">=8" } }, + "node_modules/path-unified": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/path-unified/-/path-unified-0.1.0.tgz", + "integrity": "sha512-/Oaz9ZJforrkmFrwkR/AcvjVsCAwGSJHO0X6O6ISj8YeFbATjIEBXLDcZfnK3MO4uvCBrJTdVIxdOc79PMqSdg==", + "dev": true, + "license": "MIT" + }, + "node_modules/path/node_modules/inherits": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", + "integrity": "sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==", + "dev": true, + "license": "ISC" + }, + "node_modules/path/node_modules/util": { + "version": "0.10.4", + "resolved": "https://registry.npmjs.org/util/-/util-0.10.4.tgz", + "integrity": "sha512-0Pm9hTQ3se5ll1XihRic3FDIku70C+iHUdT/W926rSgHV5QgXsYbKZN8MSC3tJtSkhuROzvsQjAaFENRXr+19A==", + "dev": true, + "license": "MIT", + "dependencies": { + "inherits": "2.0.3" + } + }, "node_modules/picocolors": { "version": "1.0.0", "dev": true, @@ -7958,6 +8733,16 @@ "node": ">=18" } }, + "node_modules/possible-typed-array-names": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz", + "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/postcss": { "version": "7.0.35", "dev": true, @@ -8151,6 +8936,16 @@ "url": "https://github.com/chalk/ansi-styles?sponsor=1" } }, + "node_modules/process": { + "version": "0.11.10", + "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", + "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.6.0" + } + }, "node_modules/progress": { "version": "2.0.3", "dev": true, @@ -8194,6 +8989,22 @@ ], "license": "MIT" }, + "node_modules/qs": { + "version": "6.13.0", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz", + "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "side-channel": "^1.0.6" + }, + "engines": { + "node": ">=0.6" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/quick-lru": { "version": "4.0.1", "dev": true, @@ -8542,18 +9353,6 @@ "semver": "bin/semver" } }, - "node_modules/sentence-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", - "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, - "license": "MIT", - "dependencies": { - "no-case": "^3.0.4", - "tslib": "^2.0.3", - "upper-case-first": "^2.0.2" - } - }, "node_modules/serve": { "version": "14.0.1", "dev": true, @@ -8643,6 +9442,24 @@ "dev": true, "license": "MIT" }, + "node_modules/set-function-length": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", + "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==", + "dev": true, + "license": "MIT", + "dependencies": { + "define-data-property": "^1.1.4", + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "get-intrinsic": "^1.2.4", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/shebang-command": { "version": "2.0.0", "dev": true, @@ -8663,13 +9480,19 @@ } }, "node_modules/side-channel": { - "version": "1.0.4", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz", + "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==", "dev": true, "license": "MIT", "dependencies": { - "call-bind": "^1.0.0", - "get-intrinsic": "^1.0.2", - "object-inspect": "^1.9.0" + "call-bind": "^1.0.7", + "es-errors": "^1.3.0", + "get-intrinsic": "^1.2.4", + "object-inspect": "^1.13.1" + }, + "engines": { + "node": ">= 0.4" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -8693,17 +9516,6 @@ "node": ">=8" } }, - "node_modules/snake-case": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", - "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, - "license": "MIT", - "dependencies": { - "dot-case": "^3.0.4", - "tslib": "^2.0.3" - } - }, "node_modules/source-map": { "version": "0.6.1", "dev": true, @@ -8781,6 +9593,16 @@ "node": ">=8" } }, + "node_modules/stream": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/stream/-/stream-0.0.3.tgz", + "integrity": "sha512-aMsbn7VKrl4A2T7QAQQbzgN7NVc70vgF5INQrBXqn4dCXN1zy3L9HGgLO5s7PExmdrzTJ8uR/27aviW8or8/+A==", + "dev": true, + "license": "MIT", + "dependencies": { + "component-emitter": "^2.0.0" + } + }, "node_modules/string_decoder": { "version": "1.3.0", "dev": true, @@ -8949,92 +9771,33 @@ } }, "node_modules/style-dictionary": { - "version": "3.9.2", - "resolved": "https://registry.npmjs.org/style-dictionary/-/style-dictionary-3.9.2.tgz", - "integrity": "sha512-M2pcQ6hyRtqHOh+NyT6T05R3pD/gwNpuhREBKvxC1En0vyywx+9Wy9nXWT1SZ9ePzv1vAo65ItnpA16tT9ZUCg==", + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/style-dictionary/-/style-dictionary-4.1.3.tgz", + "integrity": "sha512-KJTkMaFbwSdSsDm6m5M6ki7oQo9vMKV37Vyj0cFpkYw6ucqQKORRQNZT0KXUubxNTtbjv2tmy9wvDSayxS0Zzg==", "dev": true, + "hasInstallScript": true, "license": "Apache-2.0", "dependencies": { - "chalk": "^4.0.0", - "change-case": "^4.1.2", + "@bundled-es-modules/deepmerge": "^4.3.1", + "@bundled-es-modules/glob": "^10.4.2", + "@bundled-es-modules/memfs": "^4.9.4", + "@zip.js/zip.js": "^2.7.44", + "chalk": "^5.3.0", + "change-case": "^5.3.0", "commander": "^8.3.0", - "fs-extra": "^10.0.0", - "glob": "^10.3.10", + "is-plain-obj": "^4.1.0", "json5": "^2.2.2", - "jsonc-parser": "^3.0.0", - "lodash": "^4.17.15", - "tinycolor2": "^1.4.1" + "patch-package": "^8.0.0", + "path-unified": "^0.1.0", + "tinycolor2": "^1.6.0" }, "bin": { - "style-dictionary": "bin/style-dictionary" + "style-dictionary": "bin/style-dictionary.js" }, "engines": { - "node": ">=12.0.0" + "node": ">=18.0.0" } }, - "node_modules/style-dictionary/node_modules/ansi-styles": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", - "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, - "license": "MIT", - "dependencies": { - "color-convert": "^2.0.1" - }, - "engines": { - "node": ">=8" - }, - "funding": { - "url": "https://github.com/chalk/ansi-styles?sponsor=1" - } - }, - "node_modules/style-dictionary/node_modules/brace-expansion": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "dev": true, - "license": "MIT", - "dependencies": { - "balanced-match": "^1.0.0" - } - }, - "node_modules/style-dictionary/node_modules/chalk": { - "version": "4.1.2", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", - "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", - "dev": true, - "license": "MIT", - "dependencies": { - "ansi-styles": "^4.1.0", - "supports-color": "^7.1.0" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/chalk/chalk?sponsor=1" - } - }, - "node_modules/style-dictionary/node_modules/color-convert": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", - "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "color-name": "~1.1.4" - }, - "engines": { - "node": ">=7.0.0" - } - }, - "node_modules/style-dictionary/node_modules/color-name": { - "version": "1.1.4", - "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true, - "license": "MIT" - }, "node_modules/style-dictionary/node_modules/commander": { "version": "8.3.0", "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", @@ -9045,66 +9808,17 @@ "node": ">= 12" } }, - "node_modules/style-dictionary/node_modules/fs-extra": { - "version": "10.1.0", - "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz", - "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==", + "node_modules/style-dictionary/node_modules/is-plain-obj": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-4.1.0.tgz", + "integrity": "sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==", "dev": true, "license": "MIT", - "dependencies": { - "graceful-fs": "^4.2.0", - "jsonfile": "^6.0.1", - "universalify": "^2.0.0" - }, "engines": { "node": ">=12" - } - }, - "node_modules/style-dictionary/node_modules/glob": { - "version": "10.4.5", - "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz", - "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==", - "dev": true, - "license": "ISC", - "dependencies": { - "foreground-child": "^3.1.0", - "jackspeak": "^3.1.2", - "minimatch": "^9.0.4", - "minipass": "^7.1.2", - "package-json-from-dist": "^1.0.0", - "path-scurry": "^1.11.1" - }, - "bin": { - "glob": "dist/esm/bin.mjs" }, "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/style-dictionary/node_modules/minimatch": { - "version": "9.0.5", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", - "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", - "dev": true, - "license": "ISC", - "dependencies": { - "brace-expansion": "^2.0.1" - }, - "engines": { - "node": ">=16 || 14 >=14.17" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/style-dictionary/node_modules/universalify": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz", - "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">= 10.0.0" + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/style-search": { @@ -9433,6 +10147,19 @@ "dev": true, "license": "MIT" }, + "node_modules/thingies": { + "version": "1.21.0", + "resolved": "https://registry.npmjs.org/thingies/-/thingies-1.21.0.tgz", + "integrity": "sha512-hsqsJsFMsV+aD4s3CWKk85ep/3I9XzYV/IXaSouJMYIoDlgyi11cBhsqYe9/geRfB0YIikBQg6raRaM+nIMP9g==", + "dev": true, + "license": "Unlicense", + "engines": { + "node": ">=10.18" + }, + "peerDependencies": { + "tslib": "^2" + } + }, "node_modules/tinycolor2": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz", @@ -9440,6 +10167,19 @@ "dev": true, "license": "MIT" }, + "node_modules/tmp": { + "version": "0.0.33", + "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz", + "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==", + "dev": true, + "license": "MIT", + "dependencies": { + "os-tmpdir": "~1.0.2" + }, + "engines": { + "node": ">=0.6.0" + } + }, "node_modules/tmpl": { "version": "1.0.5", "dev": true, @@ -9464,6 +10204,23 @@ "node": ">=8.0" } }, + "node_modules/tree-dump": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/tree-dump/-/tree-dump-1.0.2.tgz", + "integrity": "sha512-dpev9ABuLWdEubk+cIaI9cHwRNNDjkBBLXTwI4UCUFdQ5xXKqNXoK4FEciw/vxf+NQ7Cb7sGUyeUtORvHIdRXQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=10.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/streamich" + }, + "peerDependencies": { + "tslib": "2" + } + }, "node_modules/trim-newlines": { "version": "3.0.1", "dev": true, @@ -9681,26 +10438,6 @@ "registry-url": "3.1.0" } }, - "node_modules/upper-case": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", - "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, - "license": "MIT", - "dependencies": { - "tslib": "^2.0.3" - } - }, - "node_modules/upper-case-first": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", - "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, - "license": "MIT", - "dependencies": { - "tslib": "^2.0.3" - } - }, "node_modules/uri-js": { "version": "4.4.0", "dev": true, @@ -9709,6 +10446,41 @@ "punycode": "^2.1.0" } }, + "node_modules/url": { + "version": "0.11.4", + "resolved": "https://registry.npmjs.org/url/-/url-0.11.4.tgz", + "integrity": "sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==", + "dev": true, + "license": "MIT", + "dependencies": { + "punycode": "^1.4.1", + "qs": "^6.12.3" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/url/node_modules/punycode": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", + "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/util": { + "version": "0.12.5", + "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz", + "integrity": "sha512-kZf/K6hEIrWHI6XqOFUiiMa+79wE/D8Q+NCNAWclkyg3b4d2k7s0QGepNjiABc+aR3N1PAyHL7p6UcLY6LmrnA==", + "dev": true, + "license": "MIT", + "dependencies": { + "inherits": "^2.0.3", + "is-arguments": "^1.0.4", + "is-generator-function": "^1.0.7", + "is-typed-array": "^1.1.3", + "which-typed-array": "^1.1.2" + } + }, "node_modules/util-deprecate": { "version": "1.0.2", "dev": true, @@ -9819,6 +10591,26 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/which-typed-array": { + "version": "1.1.15", + "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz", + "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==", + "dev": true, + "license": "MIT", + "dependencies": { + "available-typed-arrays": "^1.0.7", + "call-bind": "^1.0.7", + "for-each": "^0.3.3", + "gopd": "^1.0.1", + "has-tostringtag": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/widest-line": { "version": "4.0.1", "dev": true, diff --git a/core/package.json b/core/package.json index 486d8662e0..c77896117d 100644 --- a/core/package.json +++ b/core/package.json @@ -66,20 +66,21 @@ "fs-extra": "^9.0.1", "jest": "^29.7.0", "jest-cli": "^29.7.0", + "outsystems-design-tokens": "^1.0.1", "prettier": "^2.8.8", "rollup": "^2.26.4", "sass": "^1.33.0", "serve": "^14.0.1", - "style-dictionary": "^3.9.2", + "style-dictionary": "^4.1.3", "stylelint": "^13.13.1", "stylelint-order": "^4.1.0" }, "scripts": { - "build": "npm run clean && npm run build.tokens && npm run build.css && stencil build --es5 --docs-json dist/docs.json", + "build": "npm run clean && npm run build.css && stencil build --es5 --docs-json dist/docs.json", "build.css": "npm run css.sass && npm run css.minify", "build.debug": "npm run clean && stencil build --debug", "build.docs.json": "stencil build --docs-json dist/docs.json", - "build.tokens": "node ./scripts/tokens/index.js && npm run lint.fix && npm run prettier.tokens", + "build.tokens": "npx build.tokens --config scripts/tokens/index.js && npm run prettier.tokens", "clean": "node scripts/clean.js", "css.minify": "cleancss -O2 -o ./css/ionic.bundle.css ./css/ionic.bundle.css", "css.sass": "sass --embed-sources --style compressed src/css:./css", diff --git a/core/scripts/testing/styles.css b/core/scripts/testing/styles.css index 58f6f6e363..c614502482 100644 --- a/core/scripts/testing/styles.css +++ b/core/scripts/testing/styles.css @@ -49,8 +49,15 @@ html.ios.ios { font-family: -apple-system, BlinkMacSystemFont, "iosTestingFont", sans-serif; } -:root.ionic { +/* Override above styles for testing scopes */ +:root.ionic, +:root.ionic.ios, +:root.ionic.md, +html.ionic, +html.ionic.ios, +html.ionic.md { --ionic-global-background-color: var(--background); + --ion-font-family: initial; } /** diff --git a/core/scripts/tokens/index.js b/core/scripts/tokens/index.js index 0183378375..9bea2e780d 100644 --- a/core/scripts/tokens/index.js +++ b/core/scripts/tokens/index.js @@ -4,372 +4,183 @@ // - It also works very well out of the box with any kind of Design Tokens formats, like Figma Tokens, as well as APIs to adjust to more custom ones. // - It is probably the most well-known and widely used Design Tokens tool. It has also been regularly maintained for a long time. // - It can easily scale to different necessities we might have in the future. +(async () => { + const { + generateShadowValue, + generateFontSizeValue, + generateFontFamilyValue, + generateTypographyOutput, + generateValue, + generateColorUtilityClasses, + generateSpaceUtilityClasses, + removeConsecutiveRepeatedWords, + setPrefixValue, + generateRadiusUtilityClasses, + generateBorderSizeUtilityClasses, + generateFontUtilityClasses, + generateShadowUtilityClasses, + generateUtilityClasses + } = require('./utils.js'); -const fs = require('fs'); -const path = require('path'); -const StyleDictionary = require('style-dictionary'); + const StyleDictionary = (await import('style-dictionary')).default; + + // Set the prefix for variables and classes + setPrefixValue('ion'); -const targetPath = './src/foundations/'; + // Register a custom file header + StyleDictionary.registerFileHeader({ + name: 'custom-header', + fileHeader: async (defaultMessages = []) => { + return [...defaultMessages, 'Do not edit directly, this file was auto-generated.']; + }, + }); -const { - variablesPrefix, - getRgbaValue, - hexToRgb, - generateShadowValue, - generateFontSizeValue, - generateFontFamilyValue, - generateTypographyValue, - generateRgbValue, - generateColorUtilityClasses, - generateFontUtilityClass, - generateSpaceUtilityClasses, - generateTypographyUtilityClass, -} = require('./utilities'); + // SCSS variables format + StyleDictionary.registerFormat({ + name: 'scssVariablesFormat', + format: async function({ dictionary, file}) { -const { fileHeader } = StyleDictionary.formatHelpers; + console.log('Generating SCSS variables...'); -// CSS vanilla :root format -StyleDictionary.registerFormat({ - name: 'rootFormat', - formatter({ dictionary, file }) { - /* - * This will loop through all tokens and based on the type it will - * call a utility function that will return the expected format for the CSS Variable - */ - const prefixedVariables = dictionary.allProperties - .filter((prop) => prop['$type'] !== 'typography') - .map((prop) => { - if (prop.attributes.category.startsWith('Elevation')) { - const cssShadow = prop.value.map(generateShadowValue).join(', '); - return `--${variablesPrefix}-${prop.name}: ${cssShadow};`; - } else if (prop.attributes.category.match('font-family')) { - return generateFontFamilyValue(prop); - } else if (prop.attributes.category.match('font-size')) { - return generateFontSizeValue(prop); - } else { - const rgb = hexToRgb(prop.value); - prop.value = getRgbaValue(prop.value); - return ` --${variablesPrefix}-${prop.name}: ${prop.value};${ - rgb ? `\n --${variablesPrefix}-${prop.name}-rgb: ${rgb.r}, ${rgb.g}, ${rgb.b};` : `` - }`; - } - }); + // Separate typography tokens from the rest + const typographyProperties = dictionary.allTokens.filter((prop) => prop.$type === 'typography'); + const otherProperties = dictionary.allTokens.filter((prop) => prop.$type !== 'typography'); - return [ - fileHeader({ file }), - '@use "../themes/functions.sizes" as font;\n', - ':root {\n' + prefixedVariables.join('\n') + '\n}\n', - ].join('\n'); - }, -}); + // Make sure the reused scss variables are defined first, to avoid compilation errors + const sortedProperties = [...otherProperties, ...typographyProperties]; -// SCSS variables format -StyleDictionary.registerFormat({ - name: 'scssVariablesFormat', - formatter({ dictionary, file }) { - const typographyProperties = dictionary.allProperties.filter((prop) => prop['$type'] === 'typography'); - const otherProperties = dictionary.allProperties.filter((prop) => prop['$type'] !== 'typography'); + const prefixedVariables = sortedProperties.map((prop) => { + // Remove consecutive repeated words from the token name, like border-border-color + const propName = removeConsecutiveRepeatedWords(prop.name); - // Make sure the reused scss variables are defined first, to avoid compilation errors - const sortedProperties = [...otherProperties, ...typographyProperties]; + switch (prop.$type) { + case 'boxShadow': + return generateShadowValue(prop, propName); + case 'fontFamilies': + return generateFontFamilyValue(prop, propName, 'scss'); + case 'fontSizes': + return generateFontSizeValue(prop, propName, 'scss'); + case 'typography': + return generateTypographyOutput(prop, propName, true); + default: + return generateValue(prop, propName); + } + }); - const prefixedVariables = sortedProperties.map((prop) => { - if (prop.attributes.category.startsWith('Elevation')) { - const cssShadow = prop.value.map(generateShadowValue).join(', '); - return `$${variablesPrefix}-${prop.name}: var(--${variablesPrefix}-${prop.name}, ${cssShadow});`; - } else if (prop.attributes.category.match('font-family')) { - return generateFontFamilyValue(prop, 'scss'); - } else if (prop.attributes.category.match('font-size')) { - return generateFontSizeValue(prop, 'scss'); - } else if (prop['$type'] === 'typography') { - return generateTypographyValue(prop, dictionary); - } else { - return generateRgbValue(prop); - } - }); + const fileHeader = await file.options.fileHeader(); + + return [ + `/*\n${fileHeader.join('\n')}\n*/`, + '@use "../themes/functions.sizes" as font;\n', + prefixedVariables.join('\n') + '\n', + ].join('\n'); + }, + }); - return [ - fileHeader({ file }), - '@use "../themes/functions.sizes" as font;\n', - prefixedVariables.join('\n') + '\n', - ].join('\n'); - }, -}); + // Create utility-classes + StyleDictionary.registerFormat({ + name: 'cssUtilityClassesFormat', + format: async function({ dictionary, file}) { -// Create utility-classes -StyleDictionary.registerFormat({ - name: 'cssUtilityClassesFormat', - formatter({ dictionary, file }) { - const utilityClasses = dictionary.allProperties.map((prop) => { - let tokenType = prop.attributes.category; - const className = `${prop.name}`; - let utilityClass = ''; + console.log('Generating Utility-Classes...'); + + // Arrays to store specific utility classes + const typographyUtilityClasses = []; + const otherUtilityClasses = []; - if (tokenType.startsWith('Elevation')) { - return `.${variablesPrefix}-${className} {\n box-shadow: $ionic-${prop.name};\n}`; - } else if (prop['$type'] === 'typography') { - return generateTypographyUtilityClass(prop, dictionary); - /* - * Not creating for the tokens below, as they make no sense to exist as utility-classes. - * Font-family should be defined on global scope, not component. - * Scale its an abstract token group, to be used by other tokens, like the space ones. - */ - } else if (prop.attributes.category.match('font-family') || tokenType === 'scale') { - return; - } + // Generate utility classes for each token + dictionary.allTokens.map((prop) => { - const tokenTypeLower = tokenType.toLowerCase(); + const tokenCategory = prop.attributes.category; - switch (tokenTypeLower) { - case 'color': - case 'state': - case 'guidelines': - case 'disabled': - case 'hover': - case 'pressed': - utilityClass = generateColorUtilityClasses(prop, className); - break; - case 'border-size': - utilityClass = `.${variablesPrefix}-${className} {\n border-width: $ionic-${prop.name};\n}`; - break; - case 'font': - utilityClass = generateFontUtilityClass(prop, className); - break; - case 'space': - utilityClass = generateSpaceUtilityClasses(prop, className); - break; - default: - utilityClass = `.${variablesPrefix}-${className} {\n ${tokenType}: $ionic-${prop.name};\n}`; - } + if (prop.$type === 'fontFamilies' || tokenCategory === 'scale' || tokenCategory === 'backdrop') { + // Not creating for the tokens below, as they make no sense to exist as utility-classes. + return; + } - return utilityClass; - }); + // Remove consecutive repeated words from the token name, like border-border-color + const propName = removeConsecutiveRepeatedWords(prop.name); + + if (prop.$type === 'typography') { + // Typography tokens are handled differently, as each might have a different tokenType + return typographyUtilityClasses.push(generateTypographyOutput(prop, propName, false)); + + } else if(tokenCategory.startsWith('round') || tokenCategory.startsWith('rectangular') || tokenCategory.startsWith('soft')) { + // Generate utility classes for border-radius shape tokens, as they have their own token json file, based on primitive tokens + return otherUtilityClasses.push(generateRadiusUtilityClasses(propName)); - return [ - fileHeader({ file }), - '@import "./ionic.vars";\n@import "../themes/mixins";\n', - utilityClasses.join('\n'), - ].join('\n'); - }, -}); + } -// Register the custom format to generate HTML -// Load the HTML template -const template = fs.readFileSync(path.join(__dirname, 'preview.template.html'), 'utf8'); + let utilityClass = ''; -StyleDictionary.registerFormat({ - name: 'html/tokens', - formatter: function ({ dictionary }) { - // Function to extract numerical value from token name - const extractValue = (tokenName) => { - const match = tokenName.match(/-([0-9]+)/); - return match ? parseInt(match[1], 10) : Number.MAX_SAFE_INTEGER; - }; + switch (tokenCategory) { + case 'color': + case 'primitives': + case 'semantics': + case 'text': + case 'bg': + case 'icon': + case 'state': + utilityClass = generateColorUtilityClasses(prop, propName); + break; + case 'border-size': + utilityClass = generateBorderSizeUtilityClasses(propName); + break; + case 'font': + utilityClass = generateFontUtilityClasses(prop, propName); + break; + case 'space': + utilityClass = generateSpaceUtilityClasses(prop, propName); + break; + case 'shadow': + case 'elevation': + utilityClass = generateShadowUtilityClasses(propName); + break; + default: + utilityClass = generateUtilityClasses(tokenCategory, propName); + } - let colorTokens = ` - - - - - - - - - - `; - let fontSizeTokens = ''; - let boxShadowTokens = ''; - let borderSizeTokens = ''; - let borderRadiusTokens = ''; - let borderStyleTokens = ''; - let fontWeightTokens = ''; - let letterSpacingTokens = ''; - let spaceTokens = ''; + return otherUtilityClasses.push(utilityClass); + }); - // Collect border-radius and space tokens for separate sorting - let borderRadiusTokenList = []; - let spaceTokenList = []; + // Concatenate typography utility classes at the beginning + const finalOutput = typographyUtilityClasses.concat(otherUtilityClasses).join('\n'); - dictionary.allProperties.forEach((token) => { - if (token.attributes.category === 'color') { - colorTokens += ` - - - - - - `; - } else if (token.attributes.category === 'font-size') { - fontSizeTokens += ` -
- ${token.name} (${token.value}) -
- `; - } else if (token.attributes.category.startsWith('Elevation')) { - const cssShadow = token.value.map(generateShadowValue).join(', '); - boxShadowTokens += ` -
- ${token.name} -
- `; - } else if (token.attributes.category === 'border-size' || token.attributes.category === 'border-width') { - borderSizeTokens += ` -
- ${token.name} (${token.value}) -
- `; - } else if (token.attributes.category === 'border-radius') { - borderRadiusTokenList.push(token); // Collect border-radius tokens - } else if (token.attributes.category === 'border-style') { - borderStyleTokens += ` -
- ${token.name} (${token.value}) -
- `; - } else if (token.attributes.category === 'font-weight') { - fontWeightTokens += ` -
- ${token.name} (${token.value}) -
- `; - } else if (token.attributes.category === 'letter-spacing') { - // Convert % to px - const letterSpacingValue = token.value.replace('%', '') + 'px'; - letterSpacingTokens += ` -
- ${token.name} (${letterSpacingValue}) -
- `; - } else if (token.attributes.category === 'space') { - spaceTokenList.push(token); // Collect space tokens - } - }); + const fileHeader = await file.options.fileHeader(); + + return [ + `/*\n${fileHeader.join('\n')}\n*/`, + '@import "./ionic.vars";\n@import "../themes/mixins";\n', + finalOutput, + ].join('\n'); + }, + }); - // Sort border-radius and space tokens - borderRadiusTokenList.sort((a, b) => extractValue(a.name) - extractValue(b.name)); - spaceTokenList.sort((a, b) => extractValue(a.name) - extractValue(b.name)); +})(); - // Generate HTML for sorted border-radius tokens - borderRadiusTokenList.forEach((token) => { - borderRadiusTokens += ` -
- ${token.name} (${token.value}) -
- `; - }); - - // Generate HTML for sorted space tokens - spaceTokenList.forEach((token) => { - spaceTokens += ` -
-
- ${token.name} (${token.value}) -
-
- `; - }); - - colorTokens += '
ColorHexToken Name
${token.value}${token.name}
'; - - return template - .replace('{{colorTokens}}', colorTokens) - .replace('{{fontSizeTokens}}', fontSizeTokens) - .replace('{{boxShadowTokens}}', boxShadowTokens) - .replace('{{borderSizeTokens}}', borderSizeTokens) - .replace('{{borderRadiusTokens}}', borderRadiusTokens) - .replace('{{borderStyleTokens}}', borderStyleTokens) - .replace('{{fontWeightTokens}}', fontWeightTokens) - .replace('{{letterSpacingTokens}}', letterSpacingTokens) - .replace('{{spaceTokens}}', spaceTokens); - }, -}); - -// Custom transform to ensure unique token names -StyleDictionary.registerTransform({ - name: 'name/cti/kebab-unique', - type: 'name', - transformer: function (prop, options) { - return [options.prefix].concat(prop.path).join('-').toLowerCase(); - }, -}); - -// Register the custom transform group for html file generation -StyleDictionary.registerTransformGroup({ - name: 'custom', - transforms: ['attribute/cti', 'name/cti/kebab-unique', 'size/rem', 'color/css'], -}); - -// Make Style Dictionary comply with the $ format on properties from W3C Guidelines -const w3cTokenJsonParser = { - pattern: /\.json|\.tokens\.json|\.tokens$/, - parse({ contents }) { - // replace $value with value so that style dictionary recognizes it - var preparedContent = (contents || '{}') - .replace(/"\$?value":/g, '"value":') - // convert $description to comment - .replace(/"\$?description":/g, '"comment":'); - // - - return JSON.parse(preparedContent); - }, -}; - -StyleDictionary.registerParser(w3cTokenJsonParser); - -// Generate Tokens -StyleDictionary.extend({ - source: ['./src/foundations/tokens/*.json', './src/foundations/tokens/theme/*.json'], +// APPLY THE CONFIGURATION +module.exports = { + source: ["node_modules/outsystems-design-tokens/tokens/**/*.json"], platforms: { - css: { - buildPath: targetPath, - transformGroup: 'css', - files: [ - { - destination: 'ionic.root.scss', - format: 'rootFormat', - options: { - outputReferences: true, - fileHeader: `myFileHeader`, - }, - }, - ], - }, scss: { - buildPath: targetPath, - transformGroup: 'scss', - files: [ - { - destination: 'ionic.vars.scss', - format: 'scssVariablesFormat', - options: { - outputReferences: true, - fileHeader: `myFileHeader`, + transformGroup: "scss", + buildPath: './src/foundations/', + files: [ + { + destination: "ionic.vars.scss", + format: "scssVariablesFormat", + options: { + fileHeader: `custom-header`, + }, }, - }, - { - destination: 'ionic.utility.scss', - format: 'cssUtilityClassesFormat', - options: { - outputReferences: true, - fileHeader: `myFileHeader`, - }, - }, - ], - }, - html: { - transformGroup: 'custom', - buildPath: targetPath, - files: [ - { - destination: 'tokens.preview.html', - format: 'html/tokens', - }, - ], - }, - }, - fileHeader: { - myFileHeader: () => { - return [`This is an auto-generated file, please do not change it directly.`, `Ionic Design System`]; - }, - }, -}).buildAllPlatforms(); + { + destination: "ionic.utility.scss", + format: "cssUtilityClassesFormat", + options: { + fileHeader: `custom-header` + } + } + ] + } + } +}; diff --git a/core/scripts/tokens/preview.styles.css b/core/scripts/tokens/preview.styles.css deleted file mode 100644 index 56349b7fb7..0000000000 --- a/core/scripts/tokens/preview.styles.css +++ /dev/null @@ -1,63 +0,0 @@ -table { - width: 100%; - border-collapse: collapse; - margin-bottom: 20px; -} - -th, -td { - padding: 10px; - border: 1px solid #ccc; - text-align: left; -} - -th { - background-color: #f4f4f4; -} - -thead th { - position: sticky; - top: 0; - background-color: #f4f4f4; - z-index: 1; -} - -.color-swatch { - width: 50px; - height: 50px; -} - -.font-size-token, -.weight-token, -.letter-spacing-token { - margin: 10px 0; -} - -.border-token, -.shadow-token { - margin: 10px; - padding: 10px; -} - -.border-token { - border: 1px solid #000; -} - -.spacing-wrapper { - background-color: lightblue; -} - -.spacing-wrapper > div { - background-color: #fff; -} - -.token-wrapper:has(.spacing-wrapper) { - display: flex; - flex-direction: column; - gap: 20px; -} - -hr { - background-color: #ccc; - margin: 20px 0; -} diff --git a/core/scripts/tokens/preview.template.html b/core/scripts/tokens/preview.template.html deleted file mode 100644 index 462b49fa39..0000000000 --- a/core/scripts/tokens/preview.template.html +++ /dev/null @@ -1,52 +0,0 @@ - - - - - - Design Tokens - - - - - - - - - - Design Tokens - Preview - - - -

Color Tokens

-
{{colorTokens}}
-
-

Font Size Tokens

-
{{fontSizeTokens}}
-
-

Font Weight Tokens

-
{{fontWeightTokens}}
-
-

Letter Spacing Tokens

-
{{letterSpacingTokens}}
-
-

Box Shadow Tokens

-
{{boxShadowTokens}}
-
-

Border Size Tokens

-
{{borderSizeTokens}}
-
-

Border Radius Tokens

-
{{borderRadiusTokens}}
-
-

Border Style Tokens

-
{{borderStyleTokens}}
-
-

Space Tokens

-
{{spaceTokens}}
- - - - diff --git a/core/scripts/tokens/utilities.js b/core/scripts/tokens/utilities.js deleted file mode 100644 index b554f71ac3..0000000000 --- a/core/scripts/tokens/utilities.js +++ /dev/null @@ -1,191 +0,0 @@ -const variablesPrefix = 'ionic'; // Variable that holds the prefix used on all css and scss variables generated - -// Generates a valid rgba() color -function getRgbaValue(propValue) { - // Check if its rgba color - const isRgba = hexToRgba(propValue); - // If it is, then compose rgba() color, otherwise use the normal color - if (isRgba !== null) { - return (propValue = `rgba(${isRgba.r}, ${isRgba.g}, ${isRgba.b},${isRgba.a})`); - } else { - return propValue; - } -} - -// Translates an hex color value to rgb -function hexToRgb(hex) { - const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); - return result - ? { - r: parseInt(result[1], 16), - g: parseInt(result[2], 16), - b: parseInt(result[3], 16), - } - : null; -} - -// Translates an hex color value to rgba -function hexToRgba(hex) { - const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); - return result - ? { - r: parseInt(result[1], 16), - g: parseInt(result[2], 16), - b: parseInt(result[3], 16), - a: Math.round((parseInt(result[4], 16) * 100) / 255) / 100, - } - : null; -} - -// Generates a valid box-shadow value from a shadow Design Token structure -function generateShadowValue(shadow) { - const color = getRgbaValue(shadow.color); - - return `${shadow.offsetX} ${shadow.offsetY} ${shadow.blur} ${shadow.spread} ${color}`; -} - -// Generates a valid font-size value from a font-size Design Token structure, while transforming the pixels to rem -function generateFontSizeValue(prop, variableType = 'css') { - return variableType === 'scss' - ? `$${variablesPrefix}-${prop.name}: var(--${variablesPrefix}-${prop.name}, font.px-to-rem(${parseInt( - prop.value - )}));` - : `--${variablesPrefix}-${prop.name}: #{font.px-to-rem(${parseInt(prop.value)})};`; -} - -// Generates a valid font-family value from a font-family Design Token structure -function generateFontFamilyValue(prop, variableType = 'css') { - // Remove the last word from the token, as it contains the name of the font, which we don't want to be included on the generated variables - const propName = prop.name.split('-').slice(0, -1).join('-'); - return variableType === 'scss' - ? `$${variablesPrefix}-${propName}: var(--${variablesPrefix}-${propName}, "${prop.value}", sans-serif);` - : `--${variablesPrefix}-${propName}: "${prop.value}", sans-serif;`; -} - -// Generates a typography based scss map from a typography Design Token structure -function generateTypographyValue(prop, dictionary) { - const typography = prop.value; - const fontSizeMap = getTypeMap(dictionary, 'font-size'); - const fontWeightMap = getTypeMap(dictionary, 'font-weight'); - const lineHeightMap = getTypeMap(dictionary, 'line-height'); - const letterSpacingMap = getTypeMap(dictionary, 'letter-spacing'); - const fontStyle = prop.attributes.item?.toLowerCase() === 'italic' ? 'italic' : 'normal'; - - // This exact format is needed so that it compiles the tokens with the expected lint rules - return ` - $${variablesPrefix}-${prop.name}: ( - font-size: $ionic-font-size-${fontSizeMap[typography.fontSize]}, - font-style: ${fontStyle}, - font-weight: $ionic-font-weight-${fontWeightMap[typography.fontWeight]}, - letter-spacing: $ionic-letter-spacing-${letterSpacingMap[typography.letterSpacing] || 0}, - line-height: $ionic-line-height-${lineHeightMap[typography.lineHeight]}, - text-transform: ${typography.textTransform}, - text-decoration: ${typography.textDecoration} - ); - `; -} - -// To abstract the need to loop across all tokens from a given type -function getTypeMap(dictionary, type) { - return Object.fromEntries( - Object.entries(dictionary.properties[type]).map(([key, token]) => [token.value, token.attributes.type]) - ); -} - -// Generates a final value, based if the Design Token is of type color or not -function generateValue(prop) { - const rgb = hexToRgb(prop.value); - - let rgbDeclaration = ''; - - if (rgb) { - // If the token is color, also add a rgb variable using the same color - rgbDeclaration = `\n$${variablesPrefix}-${prop.name}-rgb: var(--${variablesPrefix}-${prop.name}-rgb, ${rgb.r}, ${rgb.g}, ${rgb.b});`; - } - - prop.value = getRgbaValue(prop.value); - - return `$${variablesPrefix}-${prop.name}: var(--${variablesPrefix}-${prop.name}, ${prop.value});${rgbDeclaration}`; -} - -// Generates a typography based css utility-class from a typography Design Token structure -function generateTypographyUtilityClass(prop, dictionary) { - const typography = prop.value; - const fontSizeMap = getTypeMap(dictionary, 'font-size'); - const fontWeightMap = getTypeMap(dictionary, 'font-weight'); - const lineHeightMap = getTypeMap(dictionary, 'line-height'); - const letterSpacingMap = getTypeMap(dictionary, 'letter-spacing'); - const fontStyle = prop.attributes.item?.toLowerCase() === 'italic' ? 'italic' : 'normal'; - - // This exact format is needed so that it compiles the tokens with the expected lint rules - return ` - .${variablesPrefix}-${prop.name} { - font-size: $ionic-font-size-${fontSizeMap[typography.fontSize]}; - font-style: ${fontStyle}; - font-weight: $ionic-font-weight-${fontWeightMap[typography.fontWeight]}; - letter-spacing: $ionic-letter-spacing-${letterSpacingMap[typography.letterSpacing] || 0}; - line-height: $ionic-line-height-${lineHeightMap[typography.lineHeight]}; - text-transform: ${typography.textTransform}; - text-decoration: ${typography.textDecoration}; - }; - `; -} - -// Generates a color based css utility-class from a color Design Token structure -function generateColorUtilityClasses(prop, className) { - return `.${variablesPrefix}-${className} {\n color: $ionic-${prop.name};\n} - .${variablesPrefix}-background-${className} {\n background-color: $ionic-${prop.name};\n}`; -} - -// Generates a font based css utility-class from a font Design Token structure -function generateFontUtilityClass(prop, className) { - let fontAttribute; - switch (prop.attributes.type) { - case 'size': - fontAttribute = 'font-size'; - break; - case 'weight': - fontAttribute = 'font-weight'; - break; - case 'line-height': - fontAttribute = 'line-height'; - break; - case 'letter-spacing': - fontAttribute = 'letter-spacing'; - break; - } - return `.${variablesPrefix}-${className} {\n ${fontAttribute}: $ionic-${prop.name};\n}`; -} - -// Generates a margin or padding based css utility-class from a space Design Token structure -function generateSpaceUtilityClasses(prop, className) { - // This exact format is needed so that it compiles the tokens with the expected lint rules - const marginPaddingTemplate = (type) => ` -.${variablesPrefix}-${type}-${className} { - --${type}-start: #{$ionic-${prop.name}}; - --${type}-end: #{$ionic-${prop.name}}; - --${type}-top: #{$ionic-${prop.name}}; - --${type}-bottom: #{$ionic-${prop.name}}; - - @include ${type}($ionic-${prop.name}); -};`; - - return `${marginPaddingTemplate('margin')}\n${marginPaddingTemplate('padding')}`; -} - -// Export all methods to be used on the tokens.js script -module.exports = { - variablesPrefix, - getRgbaValue, - hexToRgb, - hexToRgba, - generateShadowValue, - generateFontSizeValue, - generateFontFamilyValue, - generateTypographyValue, - generateRgbValue: generateValue, - generateColorUtilityClasses, - generateFontUtilityClass, - generateSpaceUtilityClasses, - generateTypographyUtilityClass, -}; diff --git a/core/scripts/tokens/utils.js b/core/scripts/tokens/utils.js new file mode 100644 index 0000000000..56ba2ef737 --- /dev/null +++ b/core/scripts/tokens/utils.js @@ -0,0 +1,212 @@ +let variablesPrefix; // Variable that holds the prefix used on all css and scss variables generated + +// Set the variable prefix value +function setPrefixValue(prefix) { + variablesPrefix = prefix; + return variablesPrefix; +} + +// Generates a valid rgba() color +function getRgbaValue(propValue) { + // Check if its rgba color + const isRgba = hexToRgba(propValue); + // If it is, then compose rgba() color, otherwise use the normal color + if (isRgba !== null) { + return (propValue = `rgba(${isRgba.r}, ${isRgba.g}, ${isRgba.b},${isRgba.a})`); + } else { + return propValue; + } +} + +// Translates an hex color value to rgb +function hexToRgb(hex) { + const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); + return result + ? { + r: parseInt(result[1], 16), + g: parseInt(result[2], 16), + b: parseInt(result[3], 16), + } + : null; +} + +// Translates an hex color value to rgba +function hexToRgba(hex) { + const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); + return result + ? { + r: parseInt(result[1], 16), + g: parseInt(result[2], 16), + b: parseInt(result[3], 16), + a: Math.round((parseInt(result[4], 16) * 100) / 255) / 100, + } + : null; +} + +// Utility function to remove consecutive repeated words +function removeConsecutiveRepeatedWords(str) { + return str.replace(/(\b\w+\b)(-\1)+/g, '$1'); +} + +// Generates a valid box-shadow value from a shadow Design Token structure +function generateShadowValue(prop, propName) { + const cssShadow = prop.$value.map(shadow => { + // Assuming shadow is an object with properties like offsetX, offsetY, blurRadius, spreadRadius, color + const color = getRgbaValue(shadow.color); + return `${shadow.x}px ${shadow.y}px ${shadow.blur}px ${shadow.spread}px ${color}`; +}).join(', '); + + return `$${variablesPrefix}-${propName}: var(--${variablesPrefix}-${propName}, ${cssShadow});`; +} + +// Generates a valid font-size value from a font-size Design Token structure, while transforming the pixels to rem +function generateFontSizeValue(prop, propName, variableType = 'css') { + return variableType === 'scss' + ? `$${variablesPrefix}-${propName}: var(--${variablesPrefix}-${propName}, font.px-to-rem(${parseInt( + prop.$value + )}));` + : `--${propName}: #{font.px-to-rem(${parseInt(prop.$value)})};`; +} + +// Generates a valid font-family value from a font-family Design Token structure +function generateFontFamilyValue(prop, propName, variableType = 'css') { + // Remove the last word from the token, as it contains the name of the font, which we don't want to be included on the generated variables + const _propName = propName.split('-').slice(0, -1).join('-'); + + return variableType === 'scss' + ? `$${variablesPrefix}-${_propName}: var(--${variablesPrefix}-${_propName}, "${prop.$value}", sans-serif);` + : `--${variablesPrefix}-${_propName}: "${prop.$value}", sans-serif;`; +} + +// Generates a final value, based if the Design Token is of type color or not +function generateValue(prop, propName) { + const rgb = hexToRgb(prop.$value); + + let rgbDeclaration = ''; + + if (rgb) { + // If the token is color, also add a rgb variable using the same color + rgbDeclaration = `\n$${variablesPrefix}-${propName}-rgb: var(--${variablesPrefix}-${propName}-rgb, ${rgb.r}, ${rgb.g}, ${rgb.b});`; + prop.value = getRgbaValue(prop.$value); + } + + return `$${variablesPrefix}-${propName}: var(--${variablesPrefix}-${propName}, ${prop.$value});${rgbDeclaration}`; +} + +// Generates a typography based css utility-class or scss variable from a typography token structure +function generateTypographyOutput(prop, propName, isVariable) { + const typography = prop.original.$value; + + // Extract the part after the last dot and trim any extraneous characters + const extractLastPart = (str) => str.split('.').pop().replace(/[^\w-]/g, ''); + + const _initialWrapper = isVariable ? ': (' : ` {`; + const _endWrapper = isVariable ? ')' : `}`; + const _prefix = isVariable ? '$' : `.`; + const _endChar = isVariable ? ',' : ';'; + + // This exact format is needed so that it compiles the tokens with the expected lint rules + return ` + ${_prefix}${variablesPrefix}-${propName}${_initialWrapper} + font-size: $${variablesPrefix}-font-size-${extractLastPart(typography.fontSize)}${_endChar} + font-style: ${prop.attributes.item?.toLowerCase() === 'italic' ? 'italic' : 'normal'}${_endChar} + font-weight: $${variablesPrefix}-font-weight-${extractLastPart(typography.fontWeight)}${_endChar} + letter-spacing: $${variablesPrefix}-font-letter-spacing-${extractLastPart(typography.letterSpacing) || 0}${_endChar} + line-height: $${variablesPrefix}-font-line-height-${extractLastPart(typography.lineHeight)}${_endChar} + text-transform: ${typography.textCase}${_endChar} + text-decoration: ${typography.textDecoration}${_endChar} + ${_endWrapper}; + `; +} + +// Generates a color based css utility-class from a color Design Token structure +function generateColorUtilityClasses(prop, className) { + return `.${variablesPrefix}-${className} {\n color: $${variablesPrefix}-${prop.name};\n} + .${variablesPrefix}-background-${className} {\n background-color: $${variablesPrefix}-${prop.name};\n}`; +} + +// Generates a margin or padding based css utility-class from a space Design Token structure +function generateSpaceUtilityClasses(prop, className) { + // This exact format is needed so that it compiles the tokens with the expected lint rules + // It will generate classes for margin and padding, for equal sizing on all side and each direction + const marginPaddingTemplate = (type) => ` +.${variablesPrefix}-${type}-${className} { + --${type}-top: #{$${variablesPrefix}-${prop.name}}; + --${type}-end: #{$${variablesPrefix}-${prop.name}}; + --${type}-bottom: #{$${variablesPrefix}-${prop.name}}; + --${type}-start: #{$${variablesPrefix}-${prop.name}}; + + @include ${type}($${variablesPrefix}-${prop.name}); +}; + +.${variablesPrefix}-${type}-top-${className} { + --${type}-top: #{$${variablesPrefix}-${prop.name}}; + + @include ${type}($${variablesPrefix}-${prop.name}, null, null, null); +}; + +.${variablesPrefix}-${type}-end-${className} { + --${type}-end: #{$${variablesPrefix}-${prop.name}}; + + @include ${type}(null, $${variablesPrefix}-${prop.name}, null, null); +}; + +.${variablesPrefix}-${type}-bottom-${className} { + --${type}-bottom: #{$${variablesPrefix}-${prop.name}}; + + @include ${type}(null, null, $${variablesPrefix}-${prop.name}, null); +}; + +.${variablesPrefix}-${type}-start-${className} { + --${type}-start: #{$${variablesPrefix}-${prop.name}}; + + @include ${type}(null, null, null, $${variablesPrefix}-${prop.name}); +}; +`; + + return `${marginPaddingTemplate('margin')}\n${marginPaddingTemplate('padding')}`; +} + +// Generates a valid box-shadow value from a shadow Design Token structure +function generateRadiusUtilityClasses(propName) { + return `.${variablesPrefix}-${propName} {\n border-radius: $${variablesPrefix}-${propName};\n}`; +} + +// Generates a font based css utility-class from a font Design Token structure +function generateBorderSizeUtilityClasses(propName) { + return `.${variablesPrefix}-${propName} {\n border-width: $${variablesPrefix}-${propName};\n}`; +} + +// Generates a font based css utility-class from a font Design Token structure +function generateFontUtilityClasses(prop, propName) { + return `.${variablesPrefix}-${propName} {\n ${prop.attributes.type}: $${variablesPrefix}-${propName};\n}`; +} + +// Generates a valid box-shadow value from a shadow Design Token structure +function generateShadowUtilityClasses(propName) { + return `.${variablesPrefix}-${propName} {\n box-shadow: $${variablesPrefix}-${propName};\n}`; +} + +// Generates a utility class for a given token category and name +function generateUtilityClasses(tokenCategory, propName){ + return `.${variablesPrefix}-${propName} {\n ${tokenCategory}: $${variablesPrefix}-${propName};\n}`; +} + +module.exports = { + getRgbaValue, + hexToRgb, + generateShadowValue, + generateFontSizeValue, + generateFontFamilyValue, + generateTypographyOutput, + generateValue, + setPrefixValue, + generateRadiusUtilityClasses, + generateColorUtilityClasses, + generateSpaceUtilityClasses, + removeConsecutiveRepeatedWords, + generateBorderSizeUtilityClasses, + generateFontUtilityClasses, + generateShadowUtilityClasses, + generateUtilityClasses +}; diff --git a/core/src/components/accordion-group/accordion-group.ionic.scss b/core/src/components/accordion-group/accordion-group.ionic.scss index 5ed4ffa3d1..ce5953b04f 100644 --- a/core/src/components/accordion-group/accordion-group.ionic.scss +++ b/core/src/components/accordion-group/accordion-group.ionic.scss @@ -7,7 +7,7 @@ :host { min-width: 272px; - background-color: globals.$ionic-color-base-white; + background-color: globals.$ion-primitives-base-white; } // Inset Accordion Group @@ -15,6 +15,6 @@ // Shape and padding only apply if the group is inset :host(.accordion-group-expand-inset) { - @include globals.border-radius(globals.$ionic-border-radius-400); - @include globals.padding(globals.$ionic-space-100); + @include globals.border-radius(globals.$ion-border-radius-400); + @include globals.padding(globals.$ion-space-100); } diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png index 41409e2bbc..6697091a85 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png index a52824cf6b..ad25a00bd8 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png index 189cfbe15e..24ed755837 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Chrome-linux.png index 026d302139..49356c32cf 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Firefox-linux.png index 614633eebc..934723c314 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Safari-linux.png index 6bc1d82a5e..29dccb4b3c 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-compact-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png index cc8ecbed71..917a167658 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png index 18ae93594f..7e33189b77 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png index f38be2405d..34ad59dcd9 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-expanded-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png index ac7fd3466a..9b2f0f7977 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png index 8e6baf4df3..6a4214e1d3 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Safari-linux.png index 9d5833427c..5610b882dd 100644 Binary files a/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion-group/test/expand/accordion.e2e.ts-snapshots/accordion-group-expand-inset-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png index 3ef7394f2f..67ef3108ad 100644 Binary files a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png index 256888f5fe..4f9498d95e 100644 Binary files a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png index 7330e54ccd..a41dd35232 100644 Binary files a/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion-group/test/states/accordion.e2e.ts-snapshots/accordion-group-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/accordion.ionic.scss b/core/src/components/accordion/accordion.ionic.scss index 3423831e44..ee5d49b44e 100644 --- a/core/src/components/accordion/accordion.ionic.scss +++ b/core/src/components/accordion/accordion.ionic.scss @@ -12,16 +12,16 @@ // to properly inset the border relative to the entire // accordion, rather than just the header. :host::after { - @include globals.margin(null, globals.$ionic-space-400, null, globals.$ionic-space-400); + @include globals.margin(null, globals.$ion-space-400, null, globals.$ion-space-400); @include globals.position(null, 0, 0, 0); display: block; position: absolute; - height: globals.$ionic-border-size-025; + height: globals.$ion-border-size-025; - background-color: globals.$ionic-color-neutral-300; + background-color: globals.$ion-primitives-neutral-300; content: ""; @@ -42,32 +42,32 @@ // The border is removed from the item in the header because // we are adding a border to the ::after element of the accordion. ::slotted(ion-item[slot="header"]) { - --border-radius: #{globals.$ionic-border-radius-0}; - --color: #{globals.$ionic-color-neutral-1200}; + --border-radius: #{globals.$ion-border-radius-0}; + --color: #{globals.$ion-primitives-neutral-1200}; --border-width: 0; --inner-border-width: 0; - --min-height: #{globals.$ionic-scale-700}; - --padding-top: #{globals.$ionic-space-300}; - --padding-end: #{globals.$ionic-space-400}; - --padding-bottom: #{globals.$ionic-space-300}; - --padding-start: #{globals.$ionic-space-400}; + --min-height: #{globals.$ion-scale-700}; + --padding-top: #{globals.$ion-space-300}; + --padding-end: #{globals.$ion-space-400}; + --padding-bottom: #{globals.$ion-space-300}; + --padding-start: #{globals.$ion-space-400}; - @include globals.typography(globals.$ionic-heading-h6-medium); + @include globals.typography(globals.$ion-heading-h6-medium); } // Shape only applies when inside an inset accordion group :host(.in-accordion-group-expand-inset) ::slotted(ion-item[slot="header"]) { - --border-radius: #{globals.$ionic-border-radius-400}; + --border-radius: #{globals.$ion-border-radius-400}; } // Accordion Content // -------------------------------------------------- #content { - @include globals.padding(null, globals.$ionic-space-400, globals.$ionic-space-300, globals.$ionic-space-400); - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.padding(null, globals.$ion-space-400, globals.$ion-space-300, globals.$ion-space-400); + @include globals.typography(globals.$ion-body-md-regular); - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; } // Disabled Accordion diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Chrome-linux.png index 41409e2bbc..6697091a85 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Firefox-linux.png index a52824cf6b..ad25a00bd8 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Safari-linux.png index 189cfbe15e..24ed755837 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Chrome-linux.png index 2fc9c92c46..9a149987a3 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Firefox-linux.png index 24cadf2a67..d507771c4d 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Safari-linux.png index 9d8eca3c34..51ec184ca3 100644 Binary files a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-text-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Chrome-linux.png index 9979664237..93f21d2e6e 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Firefox-linux.png index 06110121ac..31e9129bb9 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Safari-linux.png index 9581a4659f..146b156bc7 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Chrome-linux.png index 0ee4a92096..3501257572 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Firefox-linux.png index 3886a7fb52..5052cc8006 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Safari-linux.png index b85f2fc321..5e3cf1a2bb 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Chrome-linux.png index e0587f8662..80ae4048c0 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Firefox-linux.png index fb910a9f50..29f6da7fc7 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Safari-linux.png index 8799053047..1ed2f47822 100644 Binary files a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png index 78f98f9644..878dfa5c45 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png index 6fea33f5d4..c209dbe62f 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Safari-linux.png index 8e2661520a..520c333560 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-activated-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png index 71c7700d21..e8538fe347 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png index f13421fd7c..b6dda60031 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png index 72a968c465..4718e98798 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png index 9062591742..8b625c1bf1 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png index c60124c80f..2647072583 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Safari-linux.png index 91c841d813..5a88f36841 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-focused-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png index f6b961a63f..4c970b192e 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png index 256e78a9bb..cdf60f61dc 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Safari-linux.png index 9a1ed8e7ee..e7d49c8e20 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-activated-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png index a00b621fbf..ed41520cbb 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png index b99924c13e..f82a9189ed 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png index dac83064b3..c989cdaadb 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png index 8e087e54bb..93777caa31 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png index 880e16966d..064a1e067b 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Safari-linux.png index 1a95278c57..bff131e118 100644 Binary files a/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/accordion/test/states/accordion.e2e.ts-snapshots/accordion-states-inset-focused-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png index 9d16b5c3b3..36f2372c38 100644 Binary files a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/avatar/avatar.ionic.scss b/core/src/components/avatar/avatar.ionic.scss index de3c3e2f8a..c15fcc03ca 100644 --- a/core/src/components/avatar/avatar.ionic.scss +++ b/core/src/components/avatar/avatar.ionic.scss @@ -5,26 +5,26 @@ // -------------------------------------------------- :host { - --padding-top: #{globals.$ionic-space-0}; - --padding-bottom: #{globals.$ionic-space-0}; + --padding-top: #{globals.$ion-space-0}; + --padding-bottom: #{globals.$ion-space-0}; display: flex; align-items: center; justify-content: center; - background: globals.$ionic-color-neutral-100; - color: globals.$ionic-color-neutral-800; + background: globals.$ion-primitives-neutral-100; + color: globals.$ion-primitives-neutral-800; - font-weight: globals.$ionic-font-weight-medium; + font-weight: globals.$ion-font-weight-medium; - line-height: globals.$ionic-line-height-700; + line-height: globals.$ion-font-line-height-700; } :host(:not(.avatar-image)) { @include padding(var(--padding-top), var(--padding-end), var(--padding-bottom), var(--padding-start)); - border: globals.$ionic-border-size-025 globals.$ionic-border-style-solid globals.$ionic-color-neutral-800; + border: globals.$ion-border-size-025 globals.$ion-border-style-solid globals.$ion-primitives-neutral-800; } // Avatar Sizes @@ -32,74 +32,74 @@ /* 2-Extra Small */ :host(.avatar-xxsmall) { - --padding-end: #{globals.$ionic-space-050}; - --padding-start: #{globals.$ionic-space-050}; + --padding-end: #{globals.$ion-space-050}; + --padding-start: #{globals.$ion-space-050}; - width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + width: globals.$ion-scale-400; + height: globals.$ion-scale-400; - font-size: globals.$ionic-font-size-300; + font-size: globals.$ion-font-size-300; - line-height: globals.$ionic-line-height-500; + line-height: globals.$ion-font-line-height-500; } /* Extra Small */ :host(.avatar-xsmall) { - --padding-end: #{globals.$ionic-space-050}; - --padding-start: #{globals.$ionic-space-050}; + --padding-end: #{globals.$ion-space-050}; + --padding-start: #{globals.$ion-space-050}; - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; - font-size: globals.$ionic-font-size-300; + font-size: globals.$ion-font-size-300; - line-height: globals.$ionic-line-height-500; + line-height: globals.$ion-font-line-height-500; } /* Small */ :host(.avatar-small) { - --padding-end: #{globals.$ionic-space-150}; - --padding-start: #{globals.$ionic-space-150}; + --padding-end: #{globals.$ion-space-150}; + --padding-start: #{globals.$ion-space-150}; - width: globals.$ionic-scale-800; - height: globals.$ionic-scale-800; + width: globals.$ion-scale-800; + height: globals.$ion-scale-800; - font-size: globals.$ionic-font-size-400; + font-size: globals.$ion-font-size-400; - line-height: globals.$ionic-line-height-600; + line-height: globals.$ion-font-line-height-600; } /* Medium */ :host(.avatar-medium) { - --padding-end: #{globals.$ionic-space-200}; - --padding-start: #{globals.$ionic-space-200}; + --padding-end: #{globals.$ion-space-200}; + --padding-start: #{globals.$ion-space-200}; - width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; - font-size: globals.$ionic-font-size-450; + font-size: globals.$ion-font-size-450; } /* Large */ :host(.avatar-large) { - --padding-end: #{globals.$ionic-space-250}; - --padding-start: #{globals.$ionic-space-250}; + --padding-end: #{globals.$ion-space-250}; + --padding-start: #{globals.$ion-space-250}; - width: globals.$ionic-scale-1200; - height: globals.$ionic-scale-1200; + width: globals.$ion-scale-1200; + height: globals.$ion-scale-1200; - font-size: globals.$ionic-font-size-500; + font-size: globals.$ion-font-size-500; } /* Extra Large */ :host(.avatar-xlarge) { - --padding-end: #{globals.$ionic-space-300}; - --padding-start: #{globals.$ionic-space-300}; + --padding-end: #{globals.$ion-space-300}; + --padding-start: #{globals.$ion-space-300}; - width: globals.$ionic-scale-1400; - height: globals.$ionic-scale-1400; + width: globals.$ion-scale-1400; + height: globals.$ion-scale-1400; - font-size: globals.$ionic-font-size-550; + font-size: globals.$ion-font-size-550; } // Avatar Shapes @@ -108,19 +108,19 @@ :host(.avatar-xxsmall.avatar-soft), :host(.avatar-xsmall.avatar-soft), :host(.avatar-small.avatar-soft) { - --border-radius: #{globals.$ionic-border-radius-100}; + --border-radius: #{globals.$ion-border-radius-100}; } :host(.avatar-soft) { - --border-radius: #{globals.$ionic-border-radius-200}; + --border-radius: #{globals.$ion-border-radius-200}; } :host(.avatar-round) { - --border-radius: #{globals.$ionic-border-radius-full}; + --border-radius: #{globals.$ion-border-radius-full}; } :host(.avatar-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Avatar Icon @@ -131,26 +131,26 @@ } :host(.avatar-xsmall) ::slotted(ion-icon) { - width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + width: globals.$ion-scale-400; + height: globals.$ion-scale-400; } :host(.avatar-small) ::slotted(ion-icon) { - width: globals.$ionic-scale-500; - height: globals.$ionic-scale-500; + width: globals.$ion-scale-500; + height: globals.$ion-scale-500; } :host(.avatar-medium) ::slotted(ion-icon) { - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; } :host(.avatar-large) ::slotted(ion-icon) { - width: globals.$ionic-scale-800; - height: globals.$ionic-scale-800; + width: globals.$ion-scale-800; + height: globals.$ion-scale-800; } :host(.avatar-xlarge) ::slotted(ion-icon) { - width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; } diff --git a/core/src/components/backdrop/backdrop.ionic.scss b/core/src/components/backdrop/backdrop.ionic.scss index 30eb82109d..0ac8ee2992 100644 --- a/core/src/components/backdrop/backdrop.ionic.scss +++ b/core/src/components/backdrop/backdrop.ionic.scss @@ -2,6 +2,6 @@ @import "./backdrop"; :host { - background-color: rgba(globals.$ionic-color-base-black-rgb, 0.7); + background-color: rgba(globals.$ion-primitives-base-black-rgb, 0.7); backdrop-filter: blur(2px); } diff --git a/core/src/components/badge/badge.ionic.scss b/core/src/components/badge/badge.ionic.scss index a3c452dadb..904441094b 100644 --- a/core/src/components/badge/badge.ionic.scss +++ b/core/src/components/badge/badge.ionic.scss @@ -7,17 +7,17 @@ :host { --background: #{globals.ion-color(primary, base)}; --color: #{globals.ion-color(primary, contrast)}; - --padding-start: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-200}; - --padding-top: #{globals.$ionic-space-0}; - --padding-bottom: #{globals.$ionic-space-0}; + --padding-start: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-200}; + --padding-top: #{globals.$ion-space-0}; + --padding-bottom: #{globals.$ion-space-0}; display: inline-flex; align-items: center; justify-content: center; - font-weight: globals.$ionic-font-weight-medium; + font-weight: globals.$ion-font-weight-medium; } // Badge Shapes @@ -25,23 +25,23 @@ /* Soft Badge */ :host(.badge-soft) { - @include globals.border-radius(globals.$ionic-border-radius-200); + @include globals.border-radius(globals.$ion-border-radius-200); } :host(.badge-xxsmall.badge-soft), :host(.badge-xsmall.badge-soft), :host(.badge-small.badge-soft) { - @include globals.border-radius(globals.$ionic-border-radius-100); + @include globals.border-radius(globals.$ion-border-radius-100); } /* Round Badge */ :host(.badge-round) { - @include globals.border-radius(globals.$ionic-border-radius-full); + @include globals.border-radius(globals.$ion-border-radius-full); } /* Rectangular Badge */ :host(.badge-rectangular) { - @include globals.border-radius(globals.$ionic-border-radius-0); + @include globals.border-radius(globals.$ion-border-radius-0); } // Badge Sizes @@ -49,69 +49,69 @@ /* 2-Extra Small Badge */ :host(.badge-xxsmall) { - --padding-start: #{globals.$ionic-space-050}; - --padding-end: #{globals.$ionic-space-050}; + --padding-start: #{globals.$ion-space-050}; + --padding-end: #{globals.$ion-space-050}; - min-width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + min-width: globals.$ion-scale-400; + height: globals.$ion-scale-400; - font-size: globals.$ionic-font-size-300; + font-size: globals.$ion-font-size-300; - line-height: globals.$ionic-line-height-400; + line-height: globals.$ion-font-line-height-400; } /* Extra Small Badge */ :host(.badge-xsmall) { - --padding-start: #{globals.$ionic-space-100}; - --padding-end: #{globals.$ionic-space-100}; + --padding-start: #{globals.$ion-space-100}; + --padding-end: #{globals.$ion-space-100}; - min-width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + min-width: globals.$ion-scale-600; + height: globals.$ion-scale-600; - font-size: globals.$ionic-font-size-350; + font-size: globals.$ion-font-size-350; - line-height: globals.$ionic-line-height-600; + line-height: globals.$ion-font-line-height-600; } /* Small Badge */ :host(.badge-small) { - --padding-start: #{globals.$ionic-space-100}; - --padding-end: #{globals.$ionic-space-100}; + --padding-start: #{globals.$ion-space-100}; + --padding-end: #{globals.$ion-space-100}; - min-width: globals.$ionic-scale-800; - height: globals.$ionic-scale-800; + min-width: globals.$ion-scale-800; + height: globals.$ion-scale-800; - font-size: globals.$ionic-font-size-400; + font-size: globals.$ion-font-size-400; - line-height: globals.$ionic-line-height-600; + line-height: globals.$ion-font-line-height-600; } /* Medium Badge */ :host(.badge-medium) { - min-width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + min-width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; - font-size: globals.$ionic-font-size-450; + font-size: globals.$ion-font-size-450; - line-height: globals.$ionic-line-height-700; + line-height: globals.$ion-font-line-height-700; } /* Large Badge */ :host(.badge-large) { - min-width: globals.$ionic-scale-1200; - height: globals.$ionic-scale-1200; + min-width: globals.$ion-scale-1200; + height: globals.$ion-scale-1200; - font-size: globals.$ionic-font-size-500; + font-size: globals.$ion-font-size-500; - line-height: globals.$ionic-line-height-700; + line-height: globals.$ion-font-line-height-700; } /* Extra Large Badge */ :host(.badge-xlarge) { - min-width: globals.$ionic-scale-1400; - height: globals.$ionic-scale-1400; + min-width: globals.$ion-scale-1400; + height: globals.$ion-scale-1400; - font-size: globals.$ionic-font-size-550; + font-size: globals.$ion-font-size-550; - line-height: globals.$ionic-line-height-700; + line-height: globals.$ion-font-line-height-700; } diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png index f022292acc..0a5caf3fc0 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png index 7483a71958..eb03c100e6 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Safari-linux.png index ab6019792d..663b5ad656 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Chrome-linux.png index e28ef0c371..af8750e79d 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Firefox-linux.png index bfa5725a0d..c12dccde4f 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Safari-linux.png index b473aaa4e1..a473d0801a 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png index 67a4916d75..18edef2df8 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png index 7b1301b1e6..ff16e27663 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png index d2bbe8bff4..c76664e6a4 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png index 2243d5e499..46de689962 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png index 171a7d7c4b..7b30f1f4a1 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png index 270932b223..3f55e99163 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png index b6619e7860..dd93fb2811 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png index 9f231db7be..e13878386b 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png index eeb0c6c5a2..4ee4cafef3 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png index 65fe3f2cac..ae07ba21a1 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png index ae3289864a..9b6af8aef2 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png index fbbb56d450..5a494243a8 100644 Binary files a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/button.ionic.scss b/core/src/components/button/button.ionic.scss index a12357bea3..efc4277d84 100644 --- a/core/src/components/button/button.ionic.scss +++ b/core/src/components/button/button.ionic.scss @@ -5,18 +5,18 @@ // ------------------------------------------------------------------------------- :host { --padding-bottom: var(--padding-top); - --padding-end: #{globals.$ionic-space-500}; + --padding-end: #{globals.$ion-space-500}; --padding-start: var(--padding-end); - --padding-top: #{globals.$ionic-space-0}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; + --padding-top: #{globals.$ion-space-0}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; position: relative; - min-height: globals.$ionic-scale-1000; + min-height: globals.$ion-scale-1000; - font-family: globals.$ionic-font-family; - font-size: globals.$ionic-font-size-350; + font-family: globals.$ion-font-family; + font-size: globals.$ion-font-size-350; // Target area &::after { @@ -24,7 +24,7 @@ position: absolute; height: 100%; - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; transform: translateY(-50%); @@ -56,9 +56,9 @@ // -------------------------------------------------- :host(.button-outline) { - --border-width: #{globals.$ionic-border-size-025}; - --border-style: #{globals.$ionic-border-style-solid}; - --background-activated: #{globals.$ionic-color-neutral-200}; + --border-width: #{globals.$ion-border-size-025}; + --border-style: #{globals.$ion-border-style-solid}; + --background-activated: #{globals.$ion-primitives-neutral-200}; --background-focused: transparent; --background-hover: #{globals.ion-color(primary, base)}; --background-hover-opacity: 0.04; @@ -70,7 +70,7 @@ // -------------------------------------------------- :host(.button-clear) { - --background-activated: #{globals.$ionic-color-neutral-200}; + --background-activated: #{globals.$ion-primitives-neutral-200}; --background-focused: transparent; --background-hover: #{globals.ion-color(primary, base)}; --background-hover-opacity: 0.04; @@ -87,7 +87,7 @@ :host(.button-outline.ion-color) ion-ripple-effect, :host(.button-clear.ion-color) ion-ripple-effect { - color: globals.$ionic-color-neutral-200; + color: globals.$ion-primitives-neutral-200; } // Button Sizes @@ -97,52 +97,52 @@ :host(.button-xsmall), :host(.button-small) { ::slotted(ion-icon[slot="start"]) { - @include globals.margin-horizontal(null, globals.$ionic-space-100); + @include globals.margin-horizontal(null, globals.$ion-space-100); } ::slotted(ion-icon[slot="end"]) { - @include globals.margin-horizontal(globals.$ionic-space-100, null); + @include globals.margin-horizontal(globals.$ion-space-100, null); } } /* Extra Small Button */ :host(.button-xsmall) { - --padding-top: #{globals.$ionic-space-100}; - --padding-end: #{globals.$ionic-space-300}; + --padding-top: #{globals.$ion-space-100}; + --padding-end: #{globals.$ion-space-300}; - min-height: globals.$ionic-space-600; + min-height: globals.$ion-space-600; - font-size: globals.$ionic-font-size-300; + font-size: globals.$ion-font-size-300; } /* Small Button */ :host(.button-small) { - --padding-top: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-400}; + --padding-top: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-400}; - min-height: #{globals.$ionic-scale-800}; + min-height: #{globals.$ion-scale-800}; - font-size: #{globals.$ionic-font-size-300}; + font-size: #{globals.$ion-font-size-300}; } /* Large Button */ :host(.button-large) { - --padding-top: #{globals.$ionic-space-400}; - --padding-end: #{globals.$ionic-space-600}; + --padding-top: #{globals.$ion-space-400}; + --padding-end: #{globals.$ion-space-600}; - min-height: #{globals.$ionic-scale-1200}; + min-height: #{globals.$ion-scale-1200}; - font-size: #{globals.$ionic-font-size-400}; + font-size: #{globals.$ion-font-size-400}; } /* Extra Large Button */ :host(.button-xlarge) { - --padding-top: #{globals.$ionic-space-400}; - --padding-end: #{globals.$ionic-space-800}; + --padding-top: #{globals.$ion-space-400}; + --padding-end: #{globals.$ion-space-800}; - min-height: #{globals.$ionic-scale-1400}; + min-height: #{globals.$ion-scale-1400}; - font-size: #{globals.$ionic-font-size-500}; + font-size: #{globals.$ion-font-size-500}; } // Button with Icons @@ -152,7 +152,7 @@ ::slotted(ion-icon[slot="start"]), ::slotted(ion-icon[slot="end"]), ::slotted(ion-icon[slot="icon-only"]) { - font-size: globals.$ionic-font-size-400; + font-size: globals.$ion-font-size-400; } :host(.button-xsmall), @@ -179,26 +179,26 @@ // -------------------------------------------------- :host(.button-soft) { - --border-radius: #{globals.$ionic-border-radius-200}; + --border-radius: #{globals.$ion-border-radius-200}; } :host(.button-soft.button-xsmall), :host(.button-soft.button-small) { - --border-radius: #{globals.$ionic-border-radius-100}; + --border-radius: #{globals.$ion-border-radius-100}; } // Round Button // -------------------------------------------------- :host(.button-round) { - --border-radius: #{globals.$ionic-border-radius-full}; + --border-radius: #{globals.$ion-border-radius-full}; } // Rectangular Button // -------------------------------------------------- :host(.button-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Button: Focus @@ -206,8 +206,8 @@ // Only show the focus ring when the button is focused :host(.ion-focused) .button-native { - outline: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); - outline-offset: globals.$ionic-border-size-050; + outline: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); + outline-offset: globals.$ion-border-size-050; } /** @@ -243,29 +243,29 @@ // -------------------------------------------------- ::slotted(ion-icon) { - font-size: globals.$ionic-font-size-500; + font-size: globals.$ion-font-size-500; } :host(.button-small) ::slotted(ion-icon[slot="start"]) { - @include globals.margin-horizontal(null, globals.$ionic-space-200); + @include globals.margin-horizontal(null, globals.$ion-space-200); } ::slotted(ion-icon[slot="start"]) { - @include globals.margin-horizontal(null, globals.$ionic-space-250); + @include globals.margin-horizontal(null, globals.$ion-space-250); } :host(.button-large) ::slotted(ion-icon[slot="start"]) { - @include globals.margin-horizontal(null, globals.$ionic-space-300); + @include globals.margin-horizontal(null, globals.$ion-space-300); } :host(.button-small) ::slotted(ion-icon[slot="end"]) { - @include globals.margin-horizontal(globals.$ionic-space-200, null); + @include globals.margin-horizontal(globals.$ion-space-200, null); } ::slotted(ion-icon[slot="end"]) { - @include globals.margin-horizontal(globals.$ionic-space-250, null); + @include globals.margin-horizontal(globals.$ion-space-250, null); } :host(.button-large) ::slotted(ion-icon[slot="end"]) { - @include globals.margin-horizontal(globals.$ionic-space-300, null); + @include globals.margin-horizontal(globals.$ion-space-300, null); } diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Chrome-linux.png index d9edc48b49..ac85130e04 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Firefox-linux.png index 1e6b25dc5c..1b16598a18 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Safari-linux.png index 2af145af88..bb8b5c58a4 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Chrome-linux.png index 807c6cbe49..ee95c0f721 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Firefox-linux.png index bebb15c193..f76ca28384 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Safari-linux.png index ef4298d532..8de4b5d623 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-ios-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png index c16474a4b2..a7bd85d049 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png index 6cb4df336c..ad2bb4538c 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Safari-linux.png index 6265c86f21..46fe8ce7f1 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png index 4dbcf097c8..4ae2aae851 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png index 75966cb8a3..ee44ddc9bb 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Safari-linux.png index 266e200e20..048a9ad2a3 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-diff-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Chrome-linux.png index 2317f769c2..c5b07b326d 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Firefox-linux.png index a71ce54ac0..90cb6cd5e4 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Safari-linux.png index f2bccbaf9a..000158380d 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Chrome-linux.png index a1dbe8fd3f..b82986f122 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Firefox-linux.png index a773775e2d..96f9cf7ce3 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Safari-linux.png index 48b9f882cb..109ca2322e 100644 Binary files a/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/button/test/basic/button.e2e.ts-snapshots/button-ripple-effect-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Chrome-linux.png index bea24b43a4..fda887e2fb 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Firefox-linux.png index 3df3b46acb..eea0311fd4 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Safari-linux.png index f2c9d2ba22..ef975d42ba 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-ios-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png index 043914c28a..2c953fe4f5 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png index 69987d3a65..0e9ae9f8a0 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png index 4be8e57a84..4fb6298a25 100644 Binary files a/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/clear/button.e2e.ts-snapshots/button-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Chrome-linux.png index ab5826d572..3e3e0f26d5 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Firefox-linux.png index 3acdb436e9..ec4a6b8d00 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Safari-linux.png index 1d0fe9535f..b1de3c116e 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Chrome-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Chrome-linux.png index 291d422eba..927dbcfb72 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Firefox-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Firefox-linux.png index 0aab776b85..c6732a1ee8 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Safari-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Safari-linux.png index 820f1bdf6c..53f4ef1cb9 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Safari-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-ios-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png index b721ab6ccd..e37dff43fa 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index 1c4d70657c..f0b1275283 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Safari-linux.png index 150d7d3fae..7c2e01c3ba 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Chrome-linux.png index 749383c8f2..6e37abbb10 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Firefox-linux.png index 9dd295d495..664f4b11bc 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Safari-linux.png index ecc9da9d63..c2e27d499a 100644 Binary files a/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/button/test/outline/button.e2e.ts-snapshots/button-outline-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png index 1d351b2a44..380fded7d6 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png index 69e4b4a5d7..38ddb428ba 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png index 862b175745..0acbad3d34 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index e61cd6c32e..5e467a03a2 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index f6ad7cfa22..c3f0cf5a8a 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png index 211d23fdb8..ebedae7abe 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index 0202dc6f32..04a40e7350 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-rectangular-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png index 44b3250118..6d585bf38e 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png index 75874d1c88..c682d08875 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png index 437389aaa0..a3b6a6b015 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 3ec757fcd1..454a43c7fd 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index c808665a7d..a50dcc6ec9 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png index 0ad997b205..e27f219bbe 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index 69c3168815..e17db4da13 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-round-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png index 6fba58826e..ce1c52185b 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png index cf9b4d3723..a78ef0136b 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png index 542a5d3fa4..9206e16c4c 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-clear-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4bf06eee12..cecf4c35cb 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index 168a495b12..79ab53dc30 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4f5e360838..324d99d43a 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index c9f627a3de..bab84edae9 100644 Binary files a/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/shape/button.e2e.ts-snapshots/button-shape-soft-fill-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png index e3fe412cb3..7003f61fac 100644 Binary files a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png index d4e034ed86..66e2b49539 100644 Binary files a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-large-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-large-ionic-md-ltr-light-Mobile-Chrome-linux.png index 814643a5b9..8a56b6538b 100644 Binary files a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-large-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-large-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-small-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-small-ionic-md-ltr-light-Mobile-Chrome-linux.png index 2118fabd31..6deb4a29af 100644 Binary files a/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-small-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/button/test/size/button.e2e.ts-snapshots/button-size-x-small-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/button/test/states/button.e2e.ts-snapshots/button-activated-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/button/test/states/button.e2e.ts-snapshots/button-activated-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index 325509eb28..c9eab053f0 100644 Binary files a/core/src/components/button/test/states/button.e2e.ts-snapshots/button-activated-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/button/test/states/button.e2e.ts-snapshots/button-activated-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/buttons/buttons.ionic.scss b/core/src/components/buttons/buttons.ionic.scss index 57aec7bfb8..03fba85832 100644 --- a/core/src/components/buttons/buttons.ionic.scss +++ b/core/src/components/buttons/buttons.ionic.scss @@ -13,7 +13,7 @@ // -------------------------------------------------- ::slotted(*) .button-clear { - --color: globals.$ionic-color-neutral-1200; + --color: globals.$ion-primitives-neutral-1200; --background: transparent; --background-activated: transparent; --background-focused: transparent; @@ -24,10 +24,10 @@ // -------------------------------------------------- ::slotted(*) .button-has-icon-only { - width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; } ::slotted(*) ion-icon[slot="icon-only"] { - font-size: globals.$ionic-font-size-600; + font-size: globals.$ion-font-size-600; } diff --git a/core/src/components/card-content/card-content.ionic.scss b/core/src/components/card-content/card-content.ionic.scss index 1fca72c613..8f7689927c 100644 --- a/core/src/components/card-content/card-content.ionic.scss +++ b/core/src/components/card-content/card-content.ionic.scss @@ -5,20 +5,20 @@ // -------------------------------------------------- .card-content-ionic { - @include globals.padding(globals.$ionic-space-400); + @include globals.padding(globals.$ion-space-400); display: flex; flex-direction: column; - font-size: globals.$ionic-font-size-350; + font-size: globals.$ion-font-size-350; - line-height: globals.$ionic-line-height-600; + line-height: globals.$ion-font-line-height-600; - gap: globals.$ionic-space-200; + gap: globals.$ion-space-200; img { - @include globals.margin(globals.$ionic-space-200, 0, globals.$ionic-space-200, 0); + @include globals.margin(globals.$ion-space-200, 0, globals.$ion-space-200, 0); } } diff --git a/core/src/components/card-header/card-header.ionic.scss b/core/src/components/card-header/card-header.ionic.scss index 447451a7d5..3591fd4af5 100644 --- a/core/src/components/card-header/card-header.ionic.scss +++ b/core/src/components/card-header/card-header.ionic.scss @@ -5,6 +5,6 @@ // -------------------------------------------------- :host { - @include globals.padding(globals.$ionic-space-400); - gap: globals.$ionic-space-050; + @include globals.padding(globals.$ion-space-400); + gap: globals.$ion-space-050; } diff --git a/core/src/components/card-subtitle/card-subtitle.ionic.scss b/core/src/components/card-subtitle/card-subtitle.ionic.scss index e44ae61373..97bf172318 100644 --- a/core/src/components/card-subtitle/card-subtitle.ionic.scss +++ b/core/src/components/card-subtitle/card-subtitle.ionic.scss @@ -5,7 +5,7 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-800}; + --color: #{globals.$ion-primitives-neutral-800}; - @include globals.typography(globals.$ionic-body-lg-regular); + @include globals.typography(globals.$ion-body-lg-regular); } diff --git a/core/src/components/card-title/card-title.ionic.scss b/core/src/components/card-title/card-title.ionic.scss index de850ae190..bbfb1145e2 100644 --- a/core/src/components/card-title/card-title.ionic.scss +++ b/core/src/components/card-title/card-title.ionic.scss @@ -5,7 +5,7 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-1200}; + --color: #{globals.$ion-primitives-neutral-1200}; - @include globals.typography(globals.$ionic-heading-h5-medium); + @include globals.typography(globals.$ion-heading-h5-medium); } diff --git a/core/src/components/card/card.ionic.scss b/core/src/components/card/card.ionic.scss index 9ea9c5f26d..e874a7d5e6 100755 --- a/core/src/components/card/card.ionic.scss +++ b/core/src/components/card/card.ionic.scss @@ -5,9 +5,9 @@ // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-base-white}; - --border-radius: #{globals.$ionic-border-radius-400}; - --color: #{globals.$ionic-color-neutral-1200}; + --background: #{globals.$ion-primitives-base-white}; + --border-radius: #{globals.$ion-border-radius-400}; + --color: #{globals.$ion-primitives-neutral-1200}; } ::slotted(img) { @@ -18,9 +18,9 @@ // --------------------------------------------- :host(.card-soft) { - --border-radius: #{globals.$ionic-border-radius-200}; + --border-radius: #{globals.$ion-border-radius-200}; } :host(.card-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } diff --git a/core/src/components/checkbox/checkbox.ionic.scss b/core/src/components/checkbox/checkbox.ionic.scss index 2c2bd2c79d..77e9496035 100644 --- a/core/src/components/checkbox/checkbox.ionic.scss +++ b/core/src/components/checkbox/checkbox.ionic.scss @@ -5,22 +5,22 @@ :host { // Border - --border-width: #{globals.$ionic-border-size-025}; - --border-style: #{globals.$ionic-border-style-solid}; - --border-color: #{globals.$ionic-color-neutral-800}; - --checkmark-width: #{globals.$ionic-scale-400}; + --border-width: #{globals.$ion-border-size-025}; + --border-style: #{globals.$ion-border-style-solid}; + --border-color: #{globals.$ion-primitives-neutral-800}; + --checkmark-width: #{globals.$ion-scale-400}; --checkmark-height: var(--checkmark-width); // Focus - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; - --focus-ring-offset: #{globals.$ionic-space-050}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; + --focus-ring-offset: #{globals.$ion-space-050}; // Size - --size: #{globals.$ionic-scale-600}; - --checkbox-background-checked: #{globals.$ionic-color-primary-base}; - --border-color-checked: #{globals.$ionic-color-primary-base}; - --checkmark-color: #{globals.$ionic-color-base-white}; + --size: #{globals.$ion-scale-600}; + --checkbox-background-checked: #{globals.$ion-semantics-primary-base}; + --border-color-checked: #{globals.$ion-semantics-primary-base}; + --checkmark-color: #{globals.$ion-primitives-base-white}; --transition: none; display: inline-block; @@ -40,7 +40,7 @@ position: absolute; height: 100%; - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; transform: translateY(-50%); @@ -92,7 +92,7 @@ } .label-text-wrapper { - color: globals.$ionic-color-neutral-1200; + color: globals.$ion-primitives-neutral-1200; text-overflow: ellipsis; @@ -102,15 +102,15 @@ } :host(.in-item) .label-text-wrapper { - @include globals.margin(globals.$ionic-space-250, null, globals.$ionic-space-250, null); + @include globals.margin(globals.$ion-space-250, null, globals.$ion-space-250, null); } :host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper { - @include globals.margin(globals.$ionic-space-250, null, globals.$ionic-space-400, null); + @include globals.margin(globals.$ion-space-250, null, globals.$ion-space-400, null); } :host(.in-item.checkbox-label-placement-stacked) .native-wrapper { - @include globals.margin(null, null, globals.$ionic-space-250, null); + @include globals.margin(null, null, globals.$ion-space-250, null); } /** @@ -223,7 +223,7 @@ input { * the checkbox should be on the end * when the label sits at the start. */ - @include globals.margin(null, globals.$ionic-space-400, null, 0); + @include globals.margin(null, globals.$ion-space-400, null, 0); } // Label Placement - End @@ -243,7 +243,7 @@ input { * when the label sits at the end. */ :host(.checkbox-label-placement-end) .label-text-wrapper { - @include globals.margin(null, 0, null, globals.$ionic-space-400); + @include globals.margin(null, 0, null, globals.$ion-space-400); } // Label Placement - Fixed @@ -255,7 +255,7 @@ input { * the checkbox should be on the end * when the label sits at the start. */ - @include globals.margin(null, globals.$ionic-space-400, null, 0); + @include globals.margin(null, globals.$ion-space-400, null, 0); } /** @@ -288,7 +288,7 @@ input { * the checkbox should be on the bottom * when the label sits at the top. */ - @include globals.margin(null, 0, globals.$ionic-space-400, 0); + @include globals.margin(null, 0, globals.$ion-space-400, 0); /** * Label text should not extend @@ -309,7 +309,7 @@ input { // Ionic Design Checkbox Sizes // -------------------------------------------------- :host(.checkbox-size-small) { - --size: #{globals.$ionic-scale-400}; + --size: #{globals.$ion-scale-400}; } // Checked / Indeterminate Checkbox @@ -330,10 +330,10 @@ input { // Ionic Design Checkbox Invalid // -------------------------------------------------- :host(.ion-invalid) { - --focus-ring-color: #{globals.$ionic-state-focus-2}; + --focus-ring-color: #{globals.$ion-border-focus-error}; .native-wrapper { - border-color: globals.$ionic-color-danger-800; + border-color: globals.$ion-semantics-danger-800; } } @@ -356,30 +356,23 @@ input { height: inherit; } -// disabled, unchecked checkbox -:host(.checkbox-disabled) .native-wrapper { - border-color: globals.$ionic-color-neutral-800; - - background-color: globals.$ionic-state-disabled; -} - // disabled, checked checkbox :host(.checkbox-disabled.checkbox-checked) .native-wrapper { - border-width: globals.$ionic-border-size-0; + border-width: globals.$ion-border-size-0; - background-color: globals.$ionic-color-primary-base; + background-color: globals.$ion-semantics-primary-base; } // Checkbox Hover // -------------------------------------------------------- @media (any-hover: hover) { :host(:hover) .native-wrapper { - background-color: globals.$ionic-color-neutral-100; + background-color: globals.$ion-primitives-neutral-100; } :host(:hover.checkbox-checked) .native-wrapper, :host(:hover.checkbox-indeterminate) .native-wrapper { - background-color: globals.$ionic-color-primary-800; + background-color: globals.$ion-semantics-primary-800; } } @@ -387,35 +380,35 @@ input { // -------------------------------------------------- // Only show the focus ring when the checkbox is focused and not disabled :host(.ion-focused:not(.checkbox-disabled)) .native-wrapper { - outline: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); + outline: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); outline-offset: var(--focus-ring-offset); } // Checkbox: Active // -------------------------------------------------------- :host(.ion-activated) .native-wrapper { - background-color: globals.$ionic-color-neutral-200; + background-color: globals.$ion-primitives-neutral-200; } :host(.ion-activated.checkbox-checked) .native-wrapper, :host(.ion-activated.checkbox-indeterminate) .native-wrapper { - background-color: globals.$ionic-color-primary-900; + background-color: globals.$ion-semantics-primary-900; } // Ionic Design Checkbox Shapes // -------------------------------------------------- :host(.checkbox-shape-soft) { - --border-radius: #{globals.$ionic-border-radius-100}; + --border-radius: #{globals.$ion-border-radius-100}; } :host(.checkbox-size-small.checkbox-shape-soft) { - --border-radius: #{globals.$ionic-border-radius-050}; + --border-radius: #{globals.$ion-border-radius-025}; } :host(.checkbox-shape-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } .checkbox-wrapper { - min-height: #{globals.$ionic-scale-1200}; + min-height: #{globals.$ion-scale-1200}; } diff --git a/core/src/components/chip/chip.ionic.scss b/core/src/components/chip/chip.ionic.scss index b8ed01474f..13b86a907b 100644 --- a/core/src/components/chip/chip.ionic.scss +++ b/core/src/components/chip/chip.ionic.scss @@ -4,13 +4,13 @@ // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-neutral-100}; - --color: #{globals.$ionic-color-neutral-900}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; + --background: #{globals.$ion-primitives-neutral-100}; + --color: #{globals.$ion-primitives-neutral-900}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; @include globals.font-smoothing; - @include globals.padding(globals.$ionic-space-150, globals.$ionic-space-200); + @include globals.padding(globals.$ion-space-150, globals.$ion-space-200); @include globals.border-radius(var(--border-radius)); display: inline-flex; @@ -20,15 +20,15 @@ align-items: center; justify-content: center; - gap: globals.$ionic-space-100; + gap: globals.$ion-space-100; background: var(--background); color: var(--color); - font-family: globals.$ionic-font-family; - font-weight: globals.$ionic-font-weight-medium; + font-family: globals.$ion-font-family; + font-weight: globals.$ion-font-weight-medium; - line-height: globals.$ionic-line-height-full; + line-height: globals.$ion-font-line-height-full; cursor: pointer; @@ -43,9 +43,9 @@ // --------------------------------------------- :host(.chip-outline) { - border-width: globals.$ionic-border-size-025; - border-style: globals.$ionic-border-style-solid; - border-color: globals.$ionic-color-neutral-100; + border-width: globals.$ion-border-size-025; + border-style: globals.$ion-border-style-solid; + border-color: globals.$ion-primitives-neutral-100; background: transparent; } @@ -58,7 +58,7 @@ // --------------------------------------------- :host(.ion-focused) { - outline: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); + outline: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); outline-offset: var(--focus-ring-width); } @@ -67,7 +67,7 @@ @media (any-hover: hover) { :host(:hover) { - --background: #{globals.$ionic-color-neutral-200}; + --background: #{globals.$ion-primitives-neutral-200}; } :host(.ion-color:hover) { @@ -87,36 +87,36 @@ // --------------------------------------------- :host(.chip-soft) { - --border-radius: #{globals.$ionic-border-radius-100}; + --border-radius: #{globals.$ion-border-radius-100}; } :host(.chip-round) { - --border-radius: #{globals.$ionic-border-radius-400}; + --border-radius: #{globals.$ion-border-radius-400}; } :host(.chip-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Chip Icon // --------------------------------------------- ::slotted(ion-icon) { - font-size: globals.$ionic-font-size-400; + font-size: globals.$ion-font-size-400; } // Size // --------------------------------------------- :host(.chip-small) { - min-height: globals.$ionic-scale-600; + min-height: globals.$ion-scale-600; - font-size: #{globals.$ionic-font-size-300}; + font-size: #{globals.$ion-font-size-300}; } :host(.chip-large) { - min-height: globals.$ionic-scale-800; + min-height: globals.$ion-scale-800; - font-size: globals.$ionic-font-size-350; + font-size: globals.$ion-font-size-350; } // Chip Colors diff --git a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index 578c1c29a0..70250ac59e 100644 Binary files a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png index 26fc206e74..b0dd4fa238 100644 Binary files a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png index 8c3213baf1..a7b143cd36 100644 Binary files a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Safari-linux.png index 93649ba387..23f8f76aec 100644 Binary files a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-outline-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-solid-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-solid-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index a28295cd59..a566ea394c 100644 Binary files a/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-solid-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/basic/chip.e2e.ts-snapshots/chip-solid-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 048a7b7ce4..90459e325b 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index 46a3520f7a..a590e1dcbb 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Safari-linux.png index 41a65b4be3..588485561d 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png index be6a9db7b3..f594fbba08 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Firefox-linux.png index 4a36f48138..f9f69cb456 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png index a6a4731997..87d3c90267 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Chrome-linux.png index 7743bf90d0..b899a2b41b 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Firefox-linux.png index f631436edc..111efa1f55 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Safari-linux.png index 61590aa5f7..3e341a8064 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-round-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png index 5d3d234a30..2bf53f4350 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png index e773ac079b..cec631d325 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Safari-linux.png index 17cb7616b1..cc10e90ac6 100644 Binary files a/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/shape/chip.e2e.ts-snapshots/chip-soft-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png index 8d1c54d92f..a487c44e61 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Firefox-linux.png index 10e0f8cb07..8d51980ba3 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Safari-linux.png index fee5a895fc..93932ee9d2 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-large-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png index 972e395441..fbacd1fbd9 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Firefox-linux.png index 45ce79dc92..a28a5f576f 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Safari-linux.png index 05fa585b55..31fb93c910 100644 Binary files a/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/size/chip.e2e.ts-snapshots/chip-size-small-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png index a96b97b22b..1d862e9a2f 100644 Binary files a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png index bf1641ef94..783aa7b21d 100644 Binary files a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Safari-linux.png index edd81bb2c6..3ce039a30e 100644 Binary files a/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/chip/test/states/chip.e2e.ts-snapshots/chip-focused-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/datetime/datetime.ionic.scss b/core/src/components/datetime/datetime.ionic.scss index a60adfb23e..57b4f19c4f 100644 --- a/core/src/components/datetime/datetime.ionic.scss +++ b/core/src/components/datetime/datetime.ionic.scss @@ -9,19 +9,19 @@ * @prop --focus-ring-color: The color of the ring around the focused element. * @prop --focus-ring-width: The width of the ring around the focused element. */ - --background: #{globals.$ionic-color-base-white}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-radius-050}; + --background: #{globals.$ion-primitives-base-white}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-radius-025}; } // Header // ----------------------------------- :host .datetime-header { @include globals.padding( - globals.$ionic-space-200, - globals.$ionic-space-400, - globals.$ionic-space-400, - globals.$ionic-space-400 + globals.$ion-space-200, + globals.$ion-space-400, + globals.$ion-space-400, + globals.$ion-space-400 ); display: flex; @@ -30,34 +30,34 @@ align-items: start; justify-content: space-between; - height: globals.$ionic-scale-1400; + height: globals.$ion-scale-1400; - margin-bottom: globals.$ionic-space-200; + margin-bottom: globals.$ion-space-200; - border-bottom: globals.$ionic-border-style-solid globals.$ionic-border-size-025 globals.$ionic-color-neutral-300; + border-bottom: globals.$ion-border-style-solid globals.$ion-border-size-025 globals.$ion-primitives-neutral-300; } :host .datetime-header .datetime-title { - @include globals.typography(globals.$ionic-heading-h6-medium); + @include globals.typography(globals.$ion-heading-h6-medium); - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; } :host .datetime-header .datetime-selected-date { - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; } // Calendar Header // ----------------------------------- .calendar-action-buttons { - @include globals.padding(globals.$ionic-space-200, null); + @include globals.padding(globals.$ion-space-200, null); align-items: center; - height: globals.$ionic-scale-1400; + height: globals.$ion-scale-1400; box-sizing: border-box; } @@ -69,22 +69,22 @@ // Month year toggle should match the // default round clear button style .calendar-month-year-toggle { - @include globals.border-radius(globals.$ionic-border-radius-full); - @include globals.typography(globals.$ionic-action-lg); - @include globals.padding(globals.$ionic-space-200, globals.$ionic-space-400); + @include globals.border-radius(globals.$ion-border-radius-full); + @include globals.typography(globals.$ion-body-action-lg); + @include globals.padding(globals.$ion-space-200, globals.$ion-space-400); - min-width: globals.$ionic-scale-1600; - min-height: globals.$ionic-scale-1000; + min-width: globals.$ion-scale-1600; + min-height: globals.$ion-scale-1000; - border: var(--focus-ring-width) globals.$ionic-border-style-solid transparent; + border: var(--focus-ring-width) globals.$ion-border-style-solid transparent; - color: globals.$ionic-color-primary-base; + color: globals.$ion-semantics-primary-base; } // Hovered Month Year Toggle @media (any-hover: hover) { .calendar-month-year-toggle:hover { - background: globals.$ionic-color-neutral-200; + background: globals.$ion-primitives-neutral-200; } } @@ -95,20 +95,20 @@ // Activated Month Year Toggle .calendar-month-year-toggle.ion-activated { - background: globals.$ionic-color-neutral-200; + background: globals.$ion-primitives-neutral-200; } // TODO(ROU-11119): Rewrite this when we replace the ion-button with a native button .calendar-next-prev ion-button.button-has-icon-only { - --color: #{globals.$ionic-color-neutral-1000}; - --background-activated: #{globals.$ionic-color-neutral-200}; - --background-hover: #{globals.$ionic-color-neutral-200}; + --color: #{globals.$ion-primitives-neutral-1000}; + --background-activated: #{globals.$ion-primitives-neutral-200}; + --background-hover: #{globals.$ion-primitives-neutral-200}; --background-hover-opacity: 1; } // TODO(ROU-11119): Rewrite this when we replace the ion-button with a native button .calendar-next-prev ion-button.button-has-icon-only.ion-focused::part(native) { - border: globals.$ionic-border-size-050 globals.$ionic-border-style-solid globals.$ionic-state-focus-1; + border: globals.$ion-border-size-050 globals.$ion-border-style-solid globals.$ion-border-focus-default; outline: none; } @@ -117,86 +117,86 @@ // ----------------------------------- .calendar-days-of-week { - @include globals.typography(globals.$ionic-overline-medium); + @include globals.typography(globals.$ion-overline-medium); align-content: center; - height: globals.$ionic-scale-1200; + height: globals.$ion-scale-1200; - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; } // Calendar Day // ----------------------------------- .calendar-day { - @include globals.border-radius(globals.$ionic-border-radius-full); - @include globals.padding(globals.$ionic-space-100); - @include globals.typography(globals.$ionic-action-md); + @include globals.border-radius(globals.$ion-border-radius-full); + @include globals.padding(globals.$ion-space-100); + @include globals.typography(globals.$ion-body-action-md); - width: globals.$ionic-scale-1200; - min-width: globals.$ionic-scale-1200; + width: globals.$ion-scale-1200; + min-width: globals.$ion-scale-1200; - height: globals.$ionic-scale-1200; + height: globals.$ion-scale-1200; - color: globals.$ionic-color-neutral-1200; + color: globals.$ion-primitives-neutral-1200; } // Disabled Day .calendar-day[disabled]:not(.calendar-day-constrained) { - color: globals.$ionic-color-neutral-500; + color: globals.$ion-primitives-neutral-500; } // Current Day .calendar-day.calendar-day-today { - color: globals.$ionic-color-primary-base; + color: globals.$ion-semantics-primary-base; } // Selected Day .calendar-day.calendar-day-active { - background: globals.$ionic-color-primary-100; + background: globals.$ion-semantics-primary-100; } // Focused Day .calendar-day:focus-visible { - border: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); + border: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); } // Hovered Day @media (any-hover: hover) { .calendar-day:not([disabled]):not(:active):hover { - background: globals.$ionic-color-primary-200; + background: globals.$ion-semantics-primary-200; } } // Pressed Day .calendar-day:active { - background: globals.$ionic-color-primary-300; + background: globals.$ion-semantics-primary-300; } // Time / Header // ----------------------------------- :host .datetime-time { - @include globals.padding(globals.$ionic-space-100, globals.$ionic-space-400); + @include globals.padding(globals.$ion-space-100, globals.$ion-space-400); - height: globals.$ionic-scale-800; + height: globals.$ion-scale-800; } :host .datetime-time .time-header { - @include globals.typography(globals.$ionic-action-lg); + @include globals.typography(globals.$ion-body-action-lg); - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; } :host .datetime-time button { - @include globals.padding(globals.$ionic-space-0, globals.$ionic-space-200); - @include globals.typography(globals.$ionic-body-md-medium); - @include globals.border-radius(globals.$ionic-border-radius-full); + @include globals.padding(globals.$ion-space-0, globals.$ion-space-200); + @include globals.typography(globals.$ion-body-md-medium); + @include globals.border-radius(globals.$ion-border-radius-full); display: flex; align-items: center; - background-color: globals.$ionic-color-neutral-100; - color: globals.$ionic-color-neutral-1200; + background-color: globals.$ion-primitives-neutral-100; + color: globals.$ion-primitives-neutral-1200; } diff --git a/core/src/components/header/header.ionic.scss b/core/src/components/header/header.ionic.scss index 29da3783cd..8c7cc21fd1 100644 --- a/core/src/components/header/header.ionic.scss +++ b/core/src/components/header/header.ionic.scss @@ -5,15 +5,15 @@ // -------------------------------------------------- ion-header { - box-shadow: #{globals.$ionic-elevation-200}; + box-shadow: #{globals.$ion-elevation-2}; z-index: 10; // TODO(ROU-10853): replace this value with a layer token. &.header-divider { - border-bottom: globals.$ionic-border-size-025 globals.$ionic-border-style-solid globals.$ionic-color-neutral-300; + border-bottom: globals.$ion-border-size-025 globals.$ion-border-style-solid globals.$ion-primitives-neutral-300; } } ion-toolbar + ion-toolbar { - --padding-start: #{globals.$ionic-space-400}; - --padding-end: #{globals.$ionic-space-400}; + --padding-start: #{globals.$ion-space-400}; + --padding-end: #{globals.$ion-space-400}; } diff --git a/core/src/components/input-password-toggle/input-password-toggle.ionic.scss b/core/src/components/input-password-toggle/input-password-toggle.ionic.scss index 7f6e956b3d..2d9bf3c6c9 100644 --- a/core/src/components/input-password-toggle/input-password-toggle.ionic.scss +++ b/core/src/components/input-password-toggle/input-password-toggle.ionic.scss @@ -4,7 +4,7 @@ // Ionic Input Toggle Password // -------------------------------------------------- :host ion-button { - --color: #{globals.$ionic-color-neutral-800}; + --color: #{globals.$ion-primitives-neutral-800}; --margin-end: calc(-1 * var(--padding-end)); --padding-end: inherit; --icon-size: #{globals.dynamic-font(16px)}; diff --git a/core/src/components/input/input.ionic.outline.scss b/core/src/components/input/input.ionic.outline.scss index 9a00e21bce..7d4f98a43b 100644 --- a/core/src/components/input/input.ionic.outline.scss +++ b/core/src/components/input/input.ionic.outline.scss @@ -5,7 +5,7 @@ // ---------------------------------------------------------------- :host(.input-fill-outline) { - --border-radius: #{$ionic-border-radius-100}; + --border-radius: #{$ion-border-radius-100}; --padding-start: 12px; --padding-end: 12px; } @@ -138,20 +138,20 @@ // -------------------------------------------------- :host(.input-fill-outline.input-shape-soft) { - --border-radius: #{$ionic-border-radius-200}; + --border-radius: #{$ion-border-radius-200}; } :host(.input-fill-outline.input-shape-round) { - --border-radius: #{$ionic-border-radius-full}; + --border-radius: #{$ion-border-radius-full}; } :host(.input-fill-outline.input-shape-rectangular) { - --border-radius: #{$ionic-border-radius-0}; + --border-radius: #{$ion-border-radius-0}; } // Input Focus // ---------------------------------------------------------------- :host(.input-fill-outline.has-focus) { - --border-width: #{globals.$ionic-border-size-050}; + --border-width: #{globals.$ion-border-size-050}; } diff --git a/core/src/components/input/input.ionic.scss b/core/src/components/input/input.ionic.scss index 000d9b9425..a0dccc8c9f 100644 --- a/core/src/components/input/input.ionic.scss +++ b/core/src/components/input/input.ionic.scss @@ -7,17 +7,17 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-1000}; - --border-width: #{globals.$ionic-border-size-025}; - --border-color: #{globals.$ionic-color-neutral-300}; - --highlight-color-valid: #{globals.$ionic-color-success-base}; - --highlight-color-invalid: #{globals.$ionic-color-danger-base}; - --placeholder-color: #{globals.$ionic-color-neutral-800}; + --color: #{globals.$ion-primitives-neutral-1000}; + --border-width: #{globals.$ion-border-size-025}; + --border-color: #{globals.$ion-primitives-neutral-300}; + --highlight-color-valid: #{globals.$ion-semantics-success-base}; + --highlight-color-invalid: #{globals.$ion-semantics-danger-base}; + --placeholder-color: #{globals.$ion-primitives-neutral-800}; --placeholder-opacity: 1; - --text-color-invalid: #{globals.$ionic-color-danger-800}; - --background: #{globals.$ionic-color-base-white}; + --text-color-invalid: #{globals.$ion-semantics-danger-800}; + --background: #{globals.$ion-primitives-base-white}; - font-size: globals.$ionic-font-size-350; + font-size: globals.$ion-font-size-350; } // Ionic Input Sizes @@ -39,15 +39,15 @@ // -------------------------------------------------- :host ion-input-password-toggle { - --size: #{globals.$ionic-scale-1000}; + --size: #{globals.$ion-scale-1000}; } :host(.input-size-large) ion-input-password-toggle { - --size: #{globals.$ionic-scale-1200}; + --size: #{globals.$ion-scale-1200}; } :host(.input-size-xlarge) ion-input-password-toggle { - --size: #{globals.$ionic-scale-1400}; + --size: #{globals.$ion-scale-1400}; } // Target area @@ -89,13 +89,13 @@ width: 16px; height: 16px; - color: globals.$ionic-color-neutral-500; + color: globals.$ion-primitives-neutral-500; } .input-clear-icon:focus-visible { - @include border-radius(globals.$ionic-border-radius-100); + @include border-radius(globals.$ion-border-radius-100); - outline: globals.$ionic-border-size-050 globals.$ionic-border-style-solid globals.$ionic-state-focus-1; + outline: globals.$ion-border-size-050 globals.$ion-border-style-solid globals.$ion-border-focus-default; opacity: 1; } @@ -124,12 +124,12 @@ // ---------------------------------------------------------------- .label-text-wrapper { - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; - font-size: globals.$ionic-font-size-300; - font-weight: globals.$ionic-font-weight-medium; + font-size: globals.$ion-font-size-300; + font-weight: globals.$ion-font-weight-medium; - line-height: globals.$ionic-line-height-500; + line-height: globals.$ion-font-line-height-500; } :host(.label-floating) .label-text-wrapper { @@ -140,18 +140,18 @@ // ---------------------------------------------------------------- .input-bottom { - @include padding(globals.$ionic-space-100, 0, 0, 0); + @include padding(globals.$ion-space-100, 0, 0, 0); - font-weight: globals.$ionic-font-weight-medium; + font-weight: globals.$ion-font-weight-medium; } .input-bottom .helper-text, .input-bottom .counter { - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; } :host(.has-focus.ion-valid) .helper-text { - color: globals.$ionic-color-success-900; + color: globals.$ion-semantics-success-900; } :host(.ion-touched.ion-invalid) .error-text { @@ -160,7 +160,7 @@ :host(.has-focus.ion-valid), :host(.ion-touched.ion-invalid) { - --border-width: #{globals.$ionic-border-size-025}; + --border-width: #{globals.$ion-border-size-025}; } // Input Hover @@ -168,7 +168,7 @@ @media (any-hover: hover) { :host(:hover) { - --border-color: #{globals.$ionic-color-neutral-600}; + --border-color: #{globals.$ion-primitives-neutral-600}; } } @@ -177,8 +177,8 @@ :host(.input-disabled) { // color for the text within the input - --color: #{globals.$ionic-color-neutral-400}; - --background: #{globals.$ionic-color-neutral-100}; + --color: #{globals.$ion-primitives-neutral-400}; + --background: #{globals.$ion-primitives-neutral-100}; pointer-events: none; } @@ -186,15 +186,15 @@ :host(.input-disabled:not(.ion-valid)) .input-bottom .helper-text, :host(.input-disabled) .input-bottom .counter, :host(.input-disabled) .label-text-wrapper { - color: globals.$ionic-color-neutral-500; + color: globals.$ion-primitives-neutral-500; } :host(.input-disabled.has-focus.ion-valid) { - --border-color: rgba(#{globals.$ionic-color-success-base-rgb}, 0.6); + --border-color: rgba(#{globals.$ion-semantics-success-base-rgb}, 0.6); } :host(.input-disabled.ion-touched.ion-invalid) { - --border-color: rgba(#{globals.$ionic-color-danger-base-rgb}, 0.6); + --border-color: rgba(#{globals.$ion-semantics-danger-base-rgb}, 0.6); } :host(.input-disabled.ion-color) { @@ -212,7 +212,7 @@ // ---------------------------------------------------------------- :host(.input-readonly) { - --background: #{globals.$ionic-color-neutral-100}; + --background: #{globals.$ion-primitives-neutral-100}; } // Input Highlight @@ -224,7 +224,7 @@ position: absolute; width: 100%; - height: globals.$ionic-border-size-050; + height: globals.$ion-border-size-050; transform: scale(0); @@ -237,7 +237,7 @@ // ---------------------------------------------------------------- :host(.has-focus) { - --border-color: #{globals.$ionic-color-primary-base}; + --border-color: #{globals.$ion-semantics-primary-base}; } :host(.has-focus) .input-highlight { diff --git a/core/src/components/item-option/item-option.ionic.scss b/core/src/components/item-option/item-option.ionic.scss index 568c5895e1..a611fc73aa 100644 --- a/core/src/components/item-option/item-option.ionic.scss +++ b/core/src/components/item-option/item-option.ionic.scss @@ -7,43 +7,43 @@ :host { @include globals.padding(0); - font-size: globals.$ionic-font-size-350; - font-weight: globals.$ionic-font-weight-medium; + font-size: globals.$ion-font-size-350; + font-weight: globals.$ion-font-weight-medium; - line-height: globals.$ionic-line-height-500; + line-height: globals.$ion-font-line-height-500; } .button-native { - @include globals.padding(globals.$ionic-space-200); + @include globals.padding(globals.$ion-space-200); - min-width: globals.$ionic-scale-1600; - height: globals.$ionic-scale-1600; + min-width: globals.$ion-scale-1600; + height: globals.$ion-scale-1600; } ::slotted([slot="top"]) { - @include globals.margin(0, 0, globals.$ionic-space-100, 0); + @include globals.margin(0, 0, globals.$ion-space-100, 0); } ::slotted([slot="bottom"]) { - @include globals.margin(globals.$ionic-space-100, 0, 0, 0); + @include globals.margin(globals.$ion-space-100, 0, 0, 0); } ::slotted([slot="start"]) { - @include margin(0, globals.$ionic-space-100, 0, 0); + @include margin(0, globals.$ion-space-100, 0, 0); } ::slotted([slot="end"]) { - @include margin(0, 0, 0, globals.$ionic-space-100); + @include margin(0, 0, 0, globals.$ion-space-100); } ::slotted(ion-icon), ::slotted([slot="icon-only"]) { @include globals.margin(0); - width: globals.$ionic-scale-500; + width: globals.$ion-scale-500; min-width: initial; - height: globals.$ionic-scale-500; + height: globals.$ion-scale-500; } // Item Option Shapes @@ -51,17 +51,17 @@ /* Round */ :host(.item-option-round) { - @include globals.border-radius(globals.$ionic-border-radius-300); + @include globals.border-radius(globals.$ion-border-radius-300); } /* Soft */ :host(.item-option-soft) { - @include globals.border-radius(globals.$ionic-border-radius-200); + @include globals.border-radius(globals.$ion-border-radius-200); } /* Rectangular */ :host(.item-option-rectangular) { - @include globals.border-radius(globals.$ionic-border-radius-0); + @include globals.border-radius(globals.$ion-border-radius-0); } // Item Option States diff --git a/core/src/components/item-options/item-options.ionic.scss b/core/src/components/item-options/item-options.ionic.scss index 872709b4da..01a509a6c1 100644 --- a/core/src/components/item-options/item-options.ionic.scss +++ b/core/src/components/item-options/item-options.ionic.scss @@ -7,30 +7,30 @@ .item-options-ionic { align-items: center; - gap: globals.$ionic-space-100; + gap: globals.$ion-space-100; } /* stylelint-disable property-disallowed-list */ [dir="ltr"] .item-options-start ion-item-option:last-child, [dir="rtl"] .item-options-start ion-item-option:first-child { - margin-right: globals.$ionic-space-200; + margin-right: globals.$ion-space-200; } [dir="ltr"] .item-options-start ion-item-option:first-child, [dir="rtl"] .item-options-start ion-item-option:last-child { - margin-left: calc(globals.$ionic-space-200 + var(--ion-safe-area-left, 0)); + margin-left: calc(globals.$ion-space-200 + var(--ion-safe-area-left, 0)); padding-left: initial; } [dir="ltr"] .item-options-end ion-item-option:first-child, [dir="rtl"] .item-options-end ion-item-option:last-child { - margin-left: globals.$ionic-space-200; + margin-left: globals.$ion-space-200; } [dir="ltr"] .item-options-end ion-item-option:last-child, [dir="rtl"] .item-options-end ion-item-option:first-child { - margin-right: calc(globals.$ionic-space-200 + var(--ion-safe-area-right, 0)); + margin-right: calc(globals.$ion-space-200 + var(--ion-safe-area-right, 0)); padding-right: initial; } diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Chrome-linux.png index d3f749ede2..895f197fe3 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Firefox-linux.png index 84cc4f9557..0d94781057 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Safari-linux.png index dcdda8c317..f8dc78518c 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Chrome-linux.png index 7f55fba679..7d7226ddbc 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Firefox-linux.png index 1396bb466b..f89c9480d8 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Safari-linux.png index 5f92a008a8..efa43f5e13 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-end-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Chrome-linux.png index 444d29abcc..9d0e295997 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Firefox-linux.png index 858377d226..2130c4d147 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Safari-linux.png index 0baa3e40e5..f03102cac1 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Chrome-linux.png index 0588f25ff6..0a5265ed20 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Firefox-linux.png index 9980172f1e..0d108a468e 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Safari-linux.png index 0c970c6b0a..5414adf693 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ios-rtl-Mobile-Chrome-linux.png index d5108f68db..639de6c8aa 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-md-ltr-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-md-ltr-Mobile-Chrome-linux.png index 04035c1977..759baefcd5 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-left-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-ios-rtl-Mobile-Chrome-linux.png index 0c8adbff8f..1dbff9cab4 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-md-rtl-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-md-rtl-Mobile-Chrome-linux.png index ae1e7292ed..eaf321d5a8 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-safe-area-right-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Chrome-linux.png index 6113b43984..e386ca9ef0 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Firefox-linux.png index e64ef7ee29..857af57468 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Safari-linux.png index 9271dc7509..4457e05590 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Chrome-linux.png index 34fdb9df4a..4be6912608 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Firefox-linux.png index 602c585742..ce36481872 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Safari-linux.png index 734eeb6ef4..08e8c8074a 100644 Binary files a/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/basic/item-sliding.e2e.ts-snapshots/item-sliding-start-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/icons/item-sliding.e2e.ts-snapshots/item-sliding-icons-only-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/icons/item-sliding.e2e.ts-snapshots/item-sliding-icons-only-ionic-md-ltr-light-Mobile-Firefox-linux.png index ebcf83ffc1..916a9aad05 100644 Binary files a/core/src/components/item-sliding/test/icons/item-sliding.e2e.ts-snapshots/item-sliding-icons-only-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/icons/item-sliding.e2e.ts-snapshots/item-sliding-icons-only-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png index cb02f1f8c1..10eedf4408 100644 Binary files a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png index a0a4f69d65..6ed8893c9a 100644 Binary files a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png index f8cb0f0170..22fbed5a3c 100644 Binary files a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-md-ltr-Mobile-Firefox-linux.png index aa33b38c90..fcc0371664 100644 Binary files a/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item-sliding/test/states/item-sliding.e2e.ts-snapshots/item-sliding-option-disabled-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/item.ionic.scss b/core/src/components/item/item.ionic.scss index 211d21e913..62fcf981c1 100644 --- a/core/src/components/item/item.ionic.scss +++ b/core/src/components/item/item.ionic.scss @@ -7,24 +7,24 @@ :host { --background: #{vars.$item-ionic-background}; - --background-activated: #{globals.$ionic-color-neutral-200}; - --border-color: #{globals.$ionic-color-neutral-300}; - --border-style: #{globals.$ionic-border-style-solid}; - --border-width: #{0 0 globals.$ionic-border-size-025 0}; - --color: #{globals.$ionic-color-neutral-1200}; - --detail-icon-color: #{globals.$ionic-color-neutral-800}; - --detail-icon-font-size: #{globals.$ionic-scale-600}; + --background-activated: #{globals.$ion-primitives-neutral-200}; + --border-color: #{globals.$ion-primitives-neutral-300}; + --border-style: #{globals.$ion-border-style-solid}; + --border-width: #{0 0 globals.$ion-border-size-025 0}; + --color: #{globals.$ion-primitives-neutral-1200}; + --detail-icon-color: #{globals.$ion-primitives-neutral-800}; + --detail-icon-font-size: #{globals.$ion-scale-600}; --detail-icon-opacity: 1; - --min-height: #{globals.$ionic-scale-1800}; - --padding-top: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-400}; - --padding-bottom: #{globals.$ionic-space-200}; - --padding-start: #{globals.$ionic-space-400}; + --min-height: #{globals.$ion-scale-1800}; + --padding-top: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-400}; + --padding-bottom: #{globals.$ion-space-200}; + --padding-start: #{globals.$ion-space-400}; - @include globals.typography(globals.$ionic-body-lg-medium); + @include globals.typography(globals.$ion-body-lg-medium); - font-family: globals.$ionic-font-family; - font-size: globals.$ionic-font-size-400; + font-family: globals.$ion-font-family; + font-size: globals.$ion-font-size-400; } // Inner Item @@ -47,17 +47,17 @@ // -------------------------------------------------- slot[name="start"]::slotted(*) { - @include globals.margin(null, #{globals.$ionic-space-400}, null, null); + @include globals.margin(null, #{globals.$ion-space-400}, null, null); } slot[name="end"]::slotted(*) { - @include globals.margin(null, null, null, #{globals.$ionic-space-400}); + @include globals.margin(null, null, null, #{globals.$ion-space-400}); } ::slotted(ion-icon:not(.item-detail-icon)) { - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; - font-size: globals.$ionic-scale-1000; + font-size: globals.$ion-scale-1000; } // Item: Disabled @@ -88,9 +88,9 @@ slot[name="end"]::slotted(*) { position: absolute; - border-width: globals.$ionic-border-size-050; - border-style: globals.$ionic-border-style-solid; - border-color: globals.$ionic-state-focus-1; + border-width: globals.$ion-border-size-050; + border-style: globals.$ion-border-style-solid; + border-color: globals.$ion-border-focus-default; content: ""; } @@ -101,12 +101,11 @@ slot[name="end"]::slotted(*) { // Full lines - apply the border to the item // Inset lines - apply the border to the item inner :host(.item-lines-full) { - --border-width: #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-025} #{globals.$ionic-border-size-0}; + --border-width: #{globals.$ion-border-size-0} #{globals.$ion-border-size-0} #{globals.$ion-border-size-025} #{globals.$ion-border-size-0}; } :host(.item-lines-inset) { - --inner-border-width: #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-025} - #{globals.$ionic-border-size-0}; + --inner-border-width: #{globals.$ion-border-size-0} #{globals.$ion-border-size-0} #{globals.$ion-border-size-025} #{globals.$ion-border-size-0}; } // Full lines - remove the border from the item inner (inset list items) @@ -114,10 +113,10 @@ slot[name="end"]::slotted(*) { // No lines - remove the border on both (full / inset list items) :host(.item-lines-inset), :host(.item-lines-none) { - --border-width: #{globals.$ionic-border-size-0}; + --border-width: #{globals.$ion-border-size-0}; } :host(.item-lines-full), :host(.item-lines-none) { - --inner-border-width: #{globals.$ionic-border-size-0}; + --inner-border-width: #{globals.$ion-border-size-0}; } diff --git a/core/src/components/item/item.ionic.vars.scss b/core/src/components/item/item.ionic.vars.scss index 34734f3849..ce1c63ee49 100644 --- a/core/src/components/item/item.ionic.vars.scss +++ b/core/src/components/item/item.ionic.vars.scss @@ -1,10 +1,10 @@ @use "../../themes/ionic/ionic.globals.scss" as globals; /// @prop - Padding start for the item content -$item-ionic-padding-start: globals.$ionic-space-400; +$item-ionic-padding-start: globals.$ion-space-400; /// @prop - Padding end for the item content -$item-ionic-padding-end: globals.$ionic-space-400; +$item-ionic-padding-end: globals.$ion-space-400; /// @prop - Background color for the item content -$item-ionic-background: globals.$ionic-color-base-white; +$item-ionic-background: globals.$ion-primitives-base-white; diff --git a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png index b49fc32507..631b7fe86a 100644 Binary files a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png index 8d7b4a4e96..15d0c15312 100644 Binary files a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Safari-linux.png index be71b070cb..adf4b7c8ab 100644 Binary files a/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/disabled/item.e2e.ts-snapshots/item-disabled-diff-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Chrome-linux.png index 7fc005250e..424ef1ff86 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index 3755fd1931..5d3fe951fd 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Safari-linux.png index 77d170f169..6d5a0ad9a9 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Chrome-linux.png index 3f25e12ede..fbc264c5a5 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Firefox-linux.png index d54e06875b..813e36cf9a 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Safari-linux.png index 1fac6fe59b..946a9c2bdc 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-color-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png index 7fc005250e..424ef1ff86 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png index 3755fd1931..5d3fe951fd 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Safari-linux.png index 77d170f169..6d5a0ad9a9 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png index 3f25e12ede..fbc264c5a5 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png index d54e06875b..813e36cf9a 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Safari-linux.png index 1fac6fe59b..946a9c2bdc 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-icon-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 5c7b637b78..e38797e5d7 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index 672cfe052a..0d3ba8f2ea 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png index f875b60f71..f3f81d3461 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png index f1bd03f6f3..6a64cfe066 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png index d5a2b5668a..143e51f430 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png index d57fc1dd7a..4a09ffa9ee 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Chrome-linux.png index 7fc005250e..424ef1ff86 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index 3755fd1931..5d3fe951fd 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Safari-linux.png index 77d170f169..6d5a0ad9a9 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Chrome-linux.png index 3f25e12ede..fbc264c5a5 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Firefox-linux.png index d54e06875b..813e36cf9a 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Safari-linux.png index 1fac6fe59b..946a9c2bdc 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-color-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png index 7fc005250e..424ef1ff86 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png index 3755fd1931..5d3fe951fd 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Safari-linux.png index 77d170f169..6d5a0ad9a9 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png index 3f25e12ede..fbc264c5a5 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png index d54e06875b..813e36cf9a 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Safari-linux.png index 1fac6fe59b..946a9c2bdc 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-icon-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png index 5c7b637b78..e38797e5d7 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png index 672cfe052a..0d3ba8f2ea 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png index f875b60f71..f3f81d3461 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png index f1bd03f6f3..6a64cfe066 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png index d5a2b5668a..143e51f430 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png index d57fc1dd7a..4a09ffa9ee 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4cf8993306..f6730350f0 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index d4b5f33135..ab7a0c14b1 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Safari-linux.png index 9e8a9c33b0..c60a3cbff8 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Chrome-linux.png index b89f634541..ff3bbc4f4c 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Firefox-linux.png index 220b88e938..58c95c8436 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Safari-linux.png index 9883646a84..7bdde2878d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-color-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4cf8993306..f6730350f0 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png index d4b5f33135..ab7a0c14b1 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Safari-linux.png index 9e8a9c33b0..c60a3cbff8 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png index b89f634541..ff3bbc4f4c 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png index 220b88e938..58c95c8436 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Safari-linux.png index 9883646a84..7bdde2878d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-icon-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png index 1f868730b7..517c1203ac 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png index 7497d100f3..3ab01dbefe 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png index d4fdd1e89e..24131a9a81 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png index 039471d70b..40b9be2ade 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png index 8287e2fc55..45e86a9ecc 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png index aed8f29b22..d99381c671 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Chrome-linux.png index 1d1fd95264..5b5e24ef21 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index 0370a6584d..f9ea91f9a4 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Safari-linux.png index 9fc4a1cec6..fcdcf0d77d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Chrome-linux.png index 5ba242e923..67a94e760d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Firefox-linux.png index 5ba84517b5..d2c40a1401 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Safari-linux.png index ae01877542..c388d94f6e 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-color-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png index 1d1fd95264..5b5e24ef21 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png index 0370a6584d..f9ea91f9a4 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Safari-linux.png index 9fc4a1cec6..fcdcf0d77d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png index 5ba242e923..67a94e760d 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png index 5ba84517b5..d2c40a1401 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Safari-linux.png index ae01877542..c388d94f6e 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-icon-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png index 8940bd31ec..1de7a84633 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png index ab456208d8..ed66b1390f 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png index c06aeea69f..73ebb9c9f6 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png index f34465e177..e890c3e12a 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png index 83bc489a9f..ff5e705e14 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png index 3c1abf574b..6c8fcb2af1 100644 Binary files a/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/item/test/lines/item.e2e.ts-snapshots/item-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png index a8f2e98be3..3e87b2cfbb 100644 Binary files a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png index b9570d1191..c402e58e2b 100644 Binary files a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Safari-linux.png index a39adb72e9..6e142a6a50 100644 Binary files a/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/item/test/states/item.e2e.ts-snapshots/item-states-diff-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list-header/list-header.ionic.scss b/core/src/components/list-header/list-header.ionic.scss index 2fa54e7cf3..386d714b85 100644 --- a/core/src/components/list-header/list-header.ionic.scss +++ b/core/src/components/list-header/list-header.ionic.scss @@ -4,9 +4,9 @@ :host { --background: transparent; - --color: #{globals.$ionic-color-neutral-1200}; + --color: #{globals.$ion-primitives-neutral-1200}; - @include globals.typography(globals.$ionic-body-md-medium); + @include globals.typography(globals.$ion-body-md-medium); min-height: 58px; @@ -35,7 +35,7 @@ // Label ::slotted(ion-label) ::slotted(p) { - font-weight: globals.$ionic-font-weight-regular; + font-weight: globals.$ion-font-weight-regular; } // Link @@ -44,5 +44,5 @@ // that is set by the ionic theme at a global level. // /* stylelint-disable declaration-no-important */ - color: globals.$ionic-color-primary-base !important; + color: globals.$ion-semantics-primary-base !important; } diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 60383f6d2e..16b0f6657a 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index 908010e1a0..c5f1510759 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Safari-linux.png index e50b8e820a..35c0f6c29f 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Chrome-linux.png index 90ab760517..13c53e4f30 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Firefox-linux.png index 797baca5a2..d1e5566e0c 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Safari-linux.png index ae406b1105..dabace704f 100644 Binary files a/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list-header/test/basic/list-header.e2e.ts-snapshots/list-header-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/list.ionic.scss b/core/src/components/list/list.ionic.scss index 8bf64c6a04..ded1f9f3d8 100644 --- a/core/src/components/list/list.ionic.scss +++ b/core/src/components/list/list.ionic.scss @@ -21,7 +21,7 @@ ion-list { // -------------------------------------------------- .list-ionic.list-inset { - @include globals.margin(globals.$ionic-space-100); + @include globals.margin(globals.$ion-space-100); } // Ionic No Lines List @@ -137,23 +137,22 @@ ion-list { // -------------------------------------------------- .list-ionic-lines-none .item-lines-default { - --inner-border-width: #{globals.$ionic-border-size-0}; - --border-width: #{globals.$ionic-border-size-0}; + --inner-border-width: #{globals.$ion-border-size-0}; + --border-width: #{globals.$ion-border-size-0}; } // Ionic Full Lines List // -------------------------------------------------- .list-ionic-lines-full .item-lines-default { - --inner-border-width: #{globals.$ionic-border-size-0}; - --border-width: #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-025} #{globals.$ionic-border-size-0}; + --inner-border-width: #{globals.$ion-border-size-0}; + --border-width: #{globals.$ion-border-size-0} #{globals.$ion-border-size-0} #{globals.$ion-border-size-025} #{globals.$ion-border-size-0}; } // Ionic Inset Lines List // -------------------------------------------------- .list-ionic-lines-inset .item-lines-default { - --inner-border-width: #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-0} #{globals.$ionic-border-size-025} - #{globals.$ionic-border-size-0}; - --border-width: #{globals.$ionic-border-size-0}; + --inner-border-width: #{globals.$ion-border-size-0} #{globals.$ion-border-size-0} #{globals.$ion-border-size-025} #{globals.$ion-border-size-0}; + --border-width: #{globals.$ion-border-size-0}; } diff --git a/core/src/components/list/list.ionic.vars.scss b/core/src/components/list/list.ionic.vars.scss index af02803d2d..f1e1702e49 100644 --- a/core/src/components/list/list.ionic.vars.scss +++ b/core/src/components/list/list.ionic.vars.scss @@ -2,10 +2,10 @@ // -------------------------------------------------- /// @prop - Round border radius of the list -$list-ionic-border-radius-round: globals.$ionic-border-radius-400; +$list-ionic-border-radius-round: globals.$ion-border-radius-400; /// @prop - Soft border radius of the list -$list-ionic-border-radius-soft: globals.$ionic-border-radius-200; +$list-ionic-border-radius-soft: globals.$ion-border-radius-200; /// @prop - Rectangular border radius of the list -$list-ionic-border-radius-rectangular: globals.$ionic-border-radius-0; +$list-ionic-border-radius-rectangular: globals.$ion-border-radius-0; diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index d0f30b589e..b2241def81 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index f7ac96a63c..36dd3c50c4 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png index e707763162..db89f3edbd 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png index ea76d84d9f..47733e9850 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png index c3cd8b84ed..7769c35758 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png index 55e801e1f2..f35f660d00 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4c4e4ebd3a..37aa40af28 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png index a0a35e9073..412e504dd9 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png index 2e23464df8..ff83032939 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png index 851e28b395..25d32e9b13 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png index ee44ca5b48..4966a3f393 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png index a7fd81264c..5242fa731d 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4c4e4ebd3a..37aa40af28 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png index a0a35e9073..412e504dd9 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png index 2e23464df8..ff83032939 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png index 851e28b395..25d32e9b13 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png index ee44ca5b48..4966a3f393 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png index a7fd81264c..5242fa731d 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-default-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png index 18fca7753d..8497926063 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png index bec31b572d..4e93041a6f 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png index d006096274..34e9a823fa 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png index 09356d8435..3dae663a20 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png index 3d53b97f85..33b029b6e0 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png index c57d27204e..f91905dece 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png index e37d6e87b1..38fd568c34 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png index cb32ef71a6..b862850b18 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png index bf6ddc6af2..6c4152a0b8 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png index 11e20d25f2..0cb3ec05d5 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png index d1766b936c..57f1ee4365 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png index c4be0bda51..010c5dd2dc 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png index e37d6e87b1..38fd568c34 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png index cb32ef71a6..b862850b18 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png index bf6ddc6af2..6c4152a0b8 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png index 11e20d25f2..0cb3ec05d5 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png index d1766b936c..57f1ee4365 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png index c4be0bda51..010c5dd2dc 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-full-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png index a791a1e754..f99a86db91 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png index 5a74148498..ad54141667 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png index cf2c8f16be..e7c4e1f2b7 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png index a391c6fd10..3e9ccca64f 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png index d818c85d92..b94202454a 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png index 7d2dea2642..4f9b1bfab0 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png index bb1eca38fa..2d4a4d1cd1 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png index 53918c11b9..37ffab97c3 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png index 3511538b7e..a7cd5845d5 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png index 165066775d..7fc8da6de6 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png index 2de5531f8f..76b463de78 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png index e270d3b10c..8f6b603879 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png index bb1eca38fa..2d4a4d1cd1 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png index 53918c11b9..37ffab97c3 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png index 3511538b7e..a7cd5845d5 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png index 165066775d..7fc8da6de6 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png index 2de5531f8f..76b463de78 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png index e270d3b10c..8f6b603879 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-inset-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png index a7cacca41d..caaecbd8d9 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png index 2df1082388..972a2c266b 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png index 3199eec02d..e88da9d708 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png index 7c6ef86e17..43107de5d8 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png index b81aa6e196..5f8dbb14a1 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png index d27009bdf1..fc2ea77052 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png index 5442b0ef40..ec531c1286 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png index a5292dbd6e..1f5a6fd99e 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png index bf9a57bd39..a9e133406a 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png index 78057eb6f5..fccf862d3b 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png index 0cd21f9458..2a2b721d3c 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png index 0d10dab294..f4044de462 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-colors-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png index 5442b0ef40..ec531c1286 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png index a5292dbd6e..1f5a6fd99e 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png index bf9a57bd39..a9e133406a 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png index 78057eb6f5..fccf862d3b 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png index 0cd21f9458..2a2b721d3c 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png index 0d10dab294..f4044de462 100644 Binary files a/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/list/test/lines/list.e2e.ts-snapshots/list-lines-none-item-lines-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 4a86fd2e46..8f9ea76ebe 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index cb37f9d077..f566d94d13 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png index b18f80185f..1e96d2fe56 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index dff341ec21..120acf8684 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index 4313da79ad..24ecdaaf7a 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png index e4afbb2d92..3f20345b3a 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-rectangular-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 363dd038e9..819d30c017 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index 56d0d38b59..0e9ee0417e 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png index 9a31555a59..56050a6c48 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 80792a2ffd..287ce0bdf3 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index de13f476ff..f22a16e007 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png index f078432a90..50a64fc6af 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-round-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 2d88707644..c29499aabb 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index 77f74e878e..6cc9d8f56e 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png index 492cae13f9..808c010577 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-with-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png index 51210fcfeb..606056dc5a 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png index cb47c4d848..b182929689 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png index 10ed540548..5d6217ebaa 100644 Binary files a/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/list/test/shape/list.e2e.ts-snapshots/list-shape-soft-without-header-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/menu-button/menu-button.ionic.scss b/core/src/components/menu-button/menu-button.ionic.scss index 7abd073ba4..3dc2a68873 100644 --- a/core/src/components/menu-button/menu-button.ionic.scss +++ b/core/src/components/menu-button/menu-button.ionic.scss @@ -15,8 +15,8 @@ --padding-end: 0; position: relative; - width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; - font-size: globals.$ionic-font-size-600; + font-size: globals.$ion-font-size-600; } diff --git a/core/src/components/modal/modal.ionic.scss b/core/src/components/modal/modal.ionic.scss index 4baab64dcc..9e70a16ecb 100644 --- a/core/src/components/modal/modal.ionic.scss +++ b/core/src/components/modal/modal.ionic.scss @@ -5,39 +5,39 @@ // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-base-white}; - --box-shadow: #{globals.$ionic-elevation-300}; + --background: #{globals.$ion-primitives-base-white}; + --box-shadow: #{globals.$ion-elevation-3}; // Backdrop opacity is 1 because the backdrop's background color has an alpha value --backdrop-opacity: 1; - color: globals.$ionic-color-neutral-1200; + color: globals.$ion-primitives-neutral-1200; } // Shape // ------------------------------------- :host(.modal-round) { - --border-radius: #{globals.$ionic-border-radius-1000}; + --border-radius: #{globals.$ion-border-radius-1000}; } :host(.modal-soft) { - --border-radius: #{globals.$ionic-border-radius-400}; + --border-radius: #{globals.$ion-border-radius-400}; } :host(.modal-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Sheet Modal // -------------------------------------------------- .modal-handle { - @include globals.position(globals.$ionic-space-300, 0px, null, 0px); - @include globals.border-radius(globals.$ionic-border-radius-100); + @include globals.position(globals.$ion-space-300, 0px, null, 0px); + @include globals.border-radius(globals.$ion-border-radius-100); - width: globals.$ionic-scale-1100; - height: globals.$ionic-scale-100; + width: globals.$ion-scale-1100; + height: globals.$ion-scale-100; - background-color: globals.$ionic-color-neutral-300; + background-color: globals.$ion-primitives-neutral-300; } :host(.modal-sheet) .modal-wrapper { diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Firefox-linux.png index 148035a16e..3ceb26954c 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Safari-linux.png index 088dbfddbe..1763a28a54 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Firefox-linux.png index 3b829e5338..3b918a6f5a 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Safari-linux.png index 869aab35d6..319be1c02f 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Firefox-linux.png index d629da4c3e..146f1126e4 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Safari-linux.png index b187be3d90..063a168700 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Firefox-linux.png index 2589df3662..97e08e89ce 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Safari-linux.png index 7b9ab30ca1..0786d8c853 100644 Binary files a/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/basic/modal.e2e.ts-snapshots/modal-basic-present-tablet-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index c81acb04e4..d2dafff228 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Safari-linux.png index 8e5f745c7c..d05eed7ceb 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Firefox-linux.png index c81acb04e4..d2dafff228 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Safari-linux.png index 8e5f745c7c..d05eed7ceb 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-round-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png index f2cf84469a..85c157e2e5 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-card-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 68942b8017..61c667b297 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index eb9292fe60..a6ac8ac146 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Safari-linux.png index b33c29d4a0..479c2a5503 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png index 770c0b1c8f..8a37216d5e 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png index fc65192547..624f4b9262 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-rectangular-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Chrome-linux.png index 68942b8017..61c667b297 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Firefox-linux.png index eb9292fe60..a6ac8ac146 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Safari-linux.png index b33c29d4a0..479c2a5503 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-round-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png index a2f5ef114f..511cd20b07 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png index 8c803c7cfa..8a2f4cc8eb 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Safari-linux.png index 3643a0bdf1..09107b4f20 100644 Binary files a/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/shape/modal.e2e.ts-snapshots/modal-shape-sheet-soft-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Chrome-linux.png index c770e22904..cd8a637fe9 100644 Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Firefox-linux.png index 181ae5cb97..b0905c2c36 100644 Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Safari-linux.png index 4fccd9ae40..a6932f9530 100644 Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-half-sheet-present-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/radio.ionic.scss b/core/src/components/radio/radio.ionic.scss index 5eb04fa01c..3105867ed1 100644 --- a/core/src/components/radio/radio.ionic.scss +++ b/core/src/components/radio/radio.ionic.scss @@ -5,19 +5,19 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-500}; - --color-checked: #{globals.$ionic-color-primary-base}; - --border-width: #{globals.$ionic-border-size-025}; - --border-style: #{globals.$ionic-border-style-solid}; - --border-radius: #{globals.$ionic-border-radius-full}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; + --color: #{globals.$ion-primitives-neutral-500}; + --color-checked: #{globals.$ion-semantics-primary-base}; + --border-width: #{globals.$ion-border-size-025}; + --border-style: #{globals.$ion-border-style-solid}; + --border-radius: #{globals.$ion-border-radius-full}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; - color: globals.$ionic-color-neutral-1200; + color: globals.$ion-primitives-neutral-1200; } // Radio Color @@ -33,15 +33,15 @@ // ---------------------------------------------------------------- :host(.in-item.radio-label-placement-stacked) .native-wrapper { - @include globals.margin(null, null, globals.$ionic-space-250, null); + @include globals.margin(null, null, globals.$ion-space-250, null); } // Radio Native Wrapper // ---------------------------------------------------------------- .native-wrapper .radio-icon { - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; } // Ionic Radio Outer Circle: Unchecked @@ -55,7 +55,7 @@ border-style: var(--border-style); border-color: var(--color); - background-color: globals.$ionic-color-base-white; + background-color: globals.$ion-primitives-base-white; } // Ionic Radio Inner Circle: Unchecked @@ -67,7 +67,7 @@ width: calc(32% + var(--border-width)); height: calc(32% + var(--border-width)); - background-color: globals.$ionic-color-base-white; + background-color: globals.$ion-primitives-base-white; } // Ionic Radio Outer Circle: Checked @@ -89,7 +89,7 @@ * the radio should be on the end * when the label sits at the start. */ - @include globals.margin(null, globals.$ionic-space-400, null, 0); + @include globals.margin(null, globals.$ion-space-400, null, 0); } // Radio Label Placement - End @@ -101,7 +101,7 @@ * when the label sits at the end. */ :host(.radio-label-placement-end) .label-text-wrapper { - @include globals.margin(null, 0, null, globals.$ionic-space-400); + @include globals.margin(null, 0, null, globals.$ion-space-400); } // Radio Label Placement - Stacked @@ -115,7 +115,7 @@ * the radio should be on the bottom * when the label sits on top. */ - @include globals.margin(null, 0, globals.$ionic-space-400, 0); + @include globals.margin(null, 0, globals.$ion-space-400, 0); /** * Label text should not extend @@ -128,7 +128,7 @@ // ----------------------------------------- :host(:not(.in-item):not(:last-of-type)) { - @include globals.margin(null, null, globals.$ionic-space-200, null); + @include globals.margin(null, null, globals.$ion-space-200, null); } // Ionic Radio: Disabled diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png index 41ebc970cf..7351cb66fc 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png index 6d697269b4..6f6a7a53fb 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-ltr-light-Mobile-Firefox-linux.png index 108709c1c0..38a92a7b8e 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-rtl-light-Mobile-Firefox-linux.png index c159a3fb34..e58a02906a 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-ltr-light-Mobile-Firefox-linux.png index cb813bb4d4..fa0ddd8056 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-rtl-light-Mobile-Firefox-linux.png index 25e00907ec..aade1a0628 100644 Binary files a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-list-multiple-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/searchbar/searchbar.ionic.scss b/core/src/components/searchbar/searchbar.ionic.scss index d9dceecae9..0e009634e9 100644 --- a/core/src/components/searchbar/searchbar.ionic.scss +++ b/core/src/components/searchbar/searchbar.ionic.scss @@ -9,18 +9,18 @@ * @prop --focus-ring-color: The color of the ring around the focused element. * @prop --focus-ring-width: The width of the ring around the focused element. */ - --background: #{globals.$ionic-color-neutral-100}; - --border-radius: #{globals.$ionic-border-radius-400}; + --background: #{globals.$ion-primitives-neutral-100}; + --border-radius: #{globals.$ion-border-radius-400}; --box-shadow: none; - --cancel-button-color: #{globals.$ionic-color-neutral-800}; - --clear-button-color: #{globals.$ionic-color-neutral-1000}; - --color: #{globals.$ionic-color-neutral-1200}; - --icon-color: #{globals.$ionic-color-neutral-800}; - --placeholder-color: #{globals.$ionic-color-neutral-800}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; + --cancel-button-color: #{globals.$ion-primitives-neutral-800}; + --clear-button-color: #{globals.$ion-primitives-neutral-1000}; + --color: #{globals.$ion-primitives-neutral-1200}; + --icon-color: #{globals.$ion-primitives-neutral-800}; + --placeholder-color: #{globals.$ion-primitives-neutral-800}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); @include globals.padding(0); } @@ -29,10 +29,10 @@ .searchbar-search-icon { // Position is based on the size of the search icon. - @include globals.position(globals.$ionic-scale-400, null, null, globals.$ionic-scale-400); + @include globals.position(globals.$ion-scale-400, null, null, globals.$ion-scale-400); - width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + width: globals.$ion-scale-400; + height: globals.$ion-scale-400; } // Searchbar Input Field @@ -51,13 +51,13 @@ * and the gap between the icon and the input. */ @include globals.padding( - globals.$ionic-space-300, - calc(globals.$ionic-space-400 + globals.$ionic-scale-400 + globals.$ionic-space-200), - globals.$ionic-space-300, - calc(globals.$ionic-space-400 + globals.$ionic-scale-400 + globals.$ionic-space-200) + globals.$ion-space-300, + calc(globals.$ion-space-400 + globals.$ion-scale-400 + globals.$ion-space-200), + globals.$ion-space-300, + calc(globals.$ion-space-400 + globals.$ion-scale-400 + globals.$ion-space-200) ); - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; contain: strict; } @@ -67,14 +67,14 @@ .searchbar-clear-button { // Position is based on the size of the clear icon. - @include globals.position(globals.$ionic-scale-400, globals.$ionic-scale-400, null, null); + @include globals.position(globals.$ion-scale-400, globals.$ion-scale-400, null, null); - width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + width: globals.$ion-scale-400; + height: globals.$ion-scale-400; background-color: transparent; - font-size: globals.$ionic-scale-400; + font-size: globals.$ion-scale-400; contain: strict; } @@ -93,7 +93,7 @@ background-color: transparent; - font-size: globals.$ionic-font-size-400; + font-size: globals.$ion-font-size-400; } // Searchbar Search & Clear Icon & Cancel Icon @@ -110,9 +110,9 @@ .searchbar-clear-button:focus-visible, .searchbar-cancel-button:focus-visible ion-icon { - @include globals.border-radius(globals.$ionic-border-radius-100); + @include globals.border-radius(globals.$ion-border-radius-100); - outline: globals.$ionic-border-size-050 globals.$ionic-border-style-solid globals.$ionic-state-focus-1; + outline: globals.$ion-border-size-050 globals.$ion-border-style-solid globals.$ion-border-focus-default; opacity: 1; } @@ -121,7 +121,7 @@ // ----------------------------------------- :host-context(ion-toolbar) { - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; } // Searchbar States @@ -129,12 +129,12 @@ /* Hover */ :host(:hover) { - --background: #{globals.$ionic-color-neutral-200}; + --background: #{globals.$ion-primitives-neutral-200}; } /* Focus */ :host(.searchbar-has-focus) .searchbar-input { - outline: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); + outline: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); } :host(.searchbar-has-focus) .searchbar-search-icon, @@ -150,9 +150,9 @@ /* Disabled */ :host(.searchbar-disabled) { - --color: #{globals.$ionic-color-neutral-500}; - --icon-color: #{globals.$ionic-color-neutral-500}; - --placeholder-color: #{globals.$ionic-color-neutral-500}; + --color: #{globals.$ion-primitives-neutral-500}; + --icon-color: #{globals.$ion-primitives-neutral-500}; + --placeholder-color: #{globals.$ion-primitives-neutral-500}; cursor: default; pointer-events: none; diff --git a/core/src/components/segment-button/segment-button.ionic.scss b/core/src/components/segment-button/segment-button.ionic.scss index 67153d96a0..c5e45aba65 100644 --- a/core/src/components/segment-button/segment-button.ionic.scss +++ b/core/src/components/segment-button/segment-button.ionic.scss @@ -10,25 +10,25 @@ */ --background: none; --background-checked: var(--background); - --color: #{globals.$ionic-color-neutral-1000}; - --color-checked: #{globals.$ionic-color-primary-base}; - --color-disabled: #{globals.$ionic-color-neutral-500}; - --border-width: #{globals.$ionic-border-size-025}; - --border-color: #{globals.$ionic-color-neutral-300}; - --border-style: #{globals.$ionic-border-style-solid}; + --color: #{globals.$ion-primitives-neutral-1000}; + --color-checked: #{globals.$ion-semantics-primary-base}; + --color-disabled: #{globals.$ion-primitives-neutral-500}; + --border-width: #{globals.$ion-border-size-025}; + --border-color: #{globals.$ion-primitives-neutral-300}; + --border-style: #{globals.$ion-border-style-solid}; --indicator-box-shadow: none; --indicator-color: var(--color-checked); - --indicator-height: #{globals.$ionic-border-size-025}; + --indicator-height: #{globals.$ion-border-size-025}; --indicator-transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1); --indicator-transform: none; - --padding-top: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-200}; - --padding-bottom: #{globals.$ionic-space-200}; - --padding-start: #{globals.$ionic-space-200}; + --padding-top: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-200}; + --padding-bottom: #{globals.$ion-space-200}; + --padding-start: #{globals.$ion-space-200}; --transition: color 0.15s linear 0s, opacity 0.15s linear 0s; - min-width: globals.$ionic-scale-1200; - min-height: globals.$ionic-scale-1200; + min-width: globals.$ion-scale-1200; + min-height: globals.$ion-scale-1200; } .button-native { @@ -39,16 +39,16 @@ } .button-inner { - @include globals.padding(globals.$ionic-space-100, null, globals.$ionic-space-100, null); + @include globals.padding(globals.$ion-space-100, null, globals.$ion-space-100, null); - gap: globals.$ionic-space-100; + gap: globals.$ion-space-100; } // Segment Button Label // -------------------------------------------------- ::slotted(ion-label) { - @include globals.typography(globals.$ionic-action-md); + @include globals.typography(globals.$ion-body-action-md); color: var(--color); } @@ -57,8 +57,8 @@ // -------------------------------------------------- ::slotted(ion-icon) { - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; color: var(--color); } @@ -96,7 +96,7 @@ // should have a fixed height of 72px :host(.segment-button-layout-icon-top), :host(.segment-button-layout-icon-bottom) { - height: globals.$ionic-scale-1800; + height: globals.$ion-scale-1800; } // Segments with icons at the start or end, or with only @@ -105,10 +105,10 @@ :host(.segment-button-has-icon-only), :host(.segment-button-layout-icon-start), :host(.segment-button-layout-icon-end) { - height: globals.$ionic-scale-1200; + height: globals.$ion-scale-1200; } :host(.segment-button-layout-icon-start) .button-inner, :host(.segment-button-layout-icon-end) .button-inner { - gap: globals.$ionic-space-200; + gap: globals.$ion-space-200; } diff --git a/core/src/components/segment/segment.ionic.scss b/core/src/components/segment/segment.ionic.scss index 41ea69d14f..21af3ade2e 100644 --- a/core/src/components/segment/segment.ionic.scss +++ b/core/src/components/segment/segment.ionic.scss @@ -5,5 +5,5 @@ // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-base-white}; + --background: #{globals.$ion-primitives-base-white}; } diff --git a/core/src/components/spinner/spinner.ionic.scss b/core/src/components/spinner/spinner.ionic.scss index 53a6aa64da..b9f172e857 100644 --- a/core/src/components/spinner/spinner.ionic.scss +++ b/core/src/components/spinner/spinner.ionic.scss @@ -5,7 +5,7 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-800}; + --color: #{globals.$ion-primitives-neutral-800}; } // Sizes @@ -13,30 +13,30 @@ /* Extra Small */ :host(.spinner-xsmall) { - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; } /* Small */ :host(.spinner-small) { - width: globals.$ionic-scale-800; - height: globals.$ionic-scale-800; + width: globals.$ion-scale-800; + height: globals.$ion-scale-800; } /* Medium */ :host(.spinner-medium) { - width: globals.$ionic-scale-1000; - height: globals.$ionic-scale-1000; + width: globals.$ion-scale-1000; + height: globals.$ion-scale-1000; } /* Large */ :host(.spinner-large) { - width: globals.$ionic-scale-1200; - height: globals.$ionic-scale-1200; + width: globals.$ion-scale-1200; + height: globals.$ion-scale-1200; } /* Extra Large */ :host(.spinner-xlarge) { - width: globals.$ionic-scale-1400; - height: globals.$ionic-scale-1400; + width: globals.$ion-scale-1400; + height: globals.$ion-scale-1400; } diff --git a/core/src/components/tab-bar/tab-bar.ionic.scss b/core/src/components/tab-bar/tab-bar.ionic.scss index 2e4cf4bad4..183fd168ed 100644 --- a/core/src/components/tab-bar/tab-bar.ionic.scss +++ b/core/src/components/tab-bar/tab-bar.ionic.scss @@ -17,9 +17,9 @@ * In order for the height to be calculated correctly, the padding * top and bottom must be excluded from the height calculation. */ - min-height: calc(globals.$ionic-scale-1400 - calc(globals.$ionic-space-100 * 2)); + min-height: calc(globals.$ion-scale-1400 - calc(globals.$ion-space-100 * 2)); - gap: globals.$ionic-space-300; + gap: globals.$ion-space-300; // TODO(ROU-10853): replace this value with a layer token z-index: 10; @@ -31,22 +31,22 @@ /* Full */ :host(.tab-bar-full) { /* stylelint-disable */ - padding-top: globals.$ionic-space-100; - padding-bottom: calc(globals.$ionic-space-100 + var(--ion-safe-area-bottom, 0)); + padding-top: globals.$ion-space-100; + padding-bottom: calc(globals.$ion-space-100 + var(--ion-safe-area-bottom, 0)); - padding-right: calc(globals.$ionic-space-400 + var(--ion-safe-area-right, 0)); - padding-left: calc(globals.$ionic-space-400 + var(--ion-safe-area-left, 0)); + padding-right: calc(globals.$ion-space-400 + var(--ion-safe-area-right, 0)); + padding-left: calc(globals.$ion-space-400 + var(--ion-safe-area-left, 0)); /* stylelint-enable */ } :host([slot="top"].tab-bar-full) { - padding-top: calc(globals.$ionic-space-100 + var(--ion-safe-area-top, 0)); - padding-bottom: globals.$ionic-space-100; + padding-top: calc(globals.$ion-space-100 + var(--ion-safe-area-top, 0)); + padding-bottom: globals.$ion-space-100; } /* Compact */ :host(.tab-bar-compact) { - @include globals.padding(globals.$ionic-space-100, globals.$ionic-space-400); + @include globals.padding(globals.$ion-space-100, globals.$ion-space-400); position: absolute; @@ -54,17 +54,17 @@ width: fit-content; - box-shadow: #{globals.$ionic-elevation-200}; + box-shadow: #{globals.$ion-elevation-2}; contain: content; } :host([slot="top"].tab-bar-compact) { - top: calc(globals.$ionic-space-100 + var(--ion-safe-area-top, 0)); + top: calc(globals.$ion-space-100 + var(--ion-safe-area-top, 0)); } :host([slot="bottom"].tab-bar-compact) { - bottom: calc(globals.$ionic-space-100 + var(--ion-safe-area-bottom, 0)); + bottom: calc(globals.$ion-space-100 + var(--ion-safe-area-bottom, 0)); } // Tab Bar Shapes @@ -72,15 +72,15 @@ /* Soft */ :host(.tab-bar-soft) { - @include globals.border-radius(globals.$ionic-border-radius-400); + @include globals.border-radius(globals.$ion-border-radius-400); } /* Round */ :host(.tab-bar-round) { - @include globals.border-radius(globals.$ionic-border-radius-full); + @include globals.border-radius(globals.$ion-border-radius-full); } /* Rectangular */ :host(.tab-bar-rectangular) { - @include globals.border-radius(globals.$ionic-border-radius-0); + @include globals.border-radius(globals.$ion-border-radius-0); } diff --git a/core/src/components/tab-bar/tab-bar.ionic.vars.scss b/core/src/components/tab-bar/tab-bar.ionic.vars.scss index e35a2a97a1..10101ba023 100644 --- a/core/src/components/tab-bar/tab-bar.ionic.vars.scss +++ b/core/src/components/tab-bar/tab-bar.ionic.vars.scss @@ -4,16 +4,16 @@ // -------------------------------------------------- /// @prop - Background color of the tab bar -$tabbar-ionic-background: var(--ion-tab-bar-background, globals.$ionic-color-base-white); +$tabbar-ionic-background: var(--ion-tab-bar-background, globals.$ion-primitives-base-white); /// @prop - Background color of the tab bar button when activated -$tabbar-ionic-background-activated: var(--ion-tab-bar-background-activated, globals.$ionic-color-neutral-100); +$tabbar-ionic-background-activated: var(--ion-tab-bar-background-activated, globals.$ion-primitives-neutral-100); /// @prop - Background color of the tab bar button when focused $tabbar-ionic-background-focused: var(--ion-tab-bar-background-focused, transparent); /// @prop - Color of the tab bar button -$tabbar-ionic-color: var(--ion-tab-bar-color, globals.$ionic-color-neutral-800); +$tabbar-ionic-color: var(--ion-tab-bar-color, globals.$ion-primitives-neutral-800); /// @prop - Color of the selected tab bar button -$tabbar-ionic-color-selected: var(--ion-tab-bar-color-selected, globals.$ionic-color-primary-base); +$tabbar-ionic-color-selected: var(--ion-tab-bar-color-selected, globals.$ion-semantics-primary-base); diff --git a/core/src/components/tab-button/tab-button.ionic.scss b/core/src/components/tab-button/tab-button.ionic.scss index 79e905f5f8..463385df2a 100644 --- a/core/src/components/tab-button/tab-button.ionic.scss +++ b/core/src/components/tab-button/tab-button.ionic.scss @@ -5,20 +5,20 @@ // -------------------------------------------------------------- :host { - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-radius-050}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-radius-025}; - @include globals.border-radius(globals.$ionic-border-radius-200); + @include globals.border-radius(globals.$ion-border-radius-200); align-content: center; - min-height: globals.$ionic-scale-1200; - max-height: globals.$ionic-scale-1800; + min-height: globals.$ion-scale-1200; + max-height: globals.$ion-scale-1800; - font-size: globals.$ionic-font-size-300; - font-weight: globals.$ionic-font-weight-medium; + font-size: globals.$ion-font-size-300; + font-weight: globals.$ion-font-weight-medium; - line-height: globals.$ionic-line-height-500; + line-height: globals.$ion-font-line-height-500; } // Tab Button: Native @@ -39,7 +39,7 @@ // ------------------------------------------------------------------------------- .button-native { - min-width: globals.$ionic-scale-1200; + min-width: globals.$ion-scale-1200; overflow: visible; @@ -70,6 +70,6 @@ // Icon ::slotted(ion-icon) { - width: globals.$ionic-scale-600; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-600; + height: globals.$ion-scale-600; } diff --git a/core/src/components/textarea/textarea.ionic.outline.scss b/core/src/components/textarea/textarea.ionic.outline.scss index 5a5f69a34b..6bd42fe85c 100644 --- a/core/src/components/textarea/textarea.ionic.outline.scss +++ b/core/src/components/textarea/textarea.ionic.outline.scss @@ -4,8 +4,8 @@ // ---------------------------------------------------------------- :host(.textarea-fill-outline) { - --border-width: #{globals.$ionic-border-size-025}; - --border-color: #{globals.$ionic-color-neutral-500}; + --border-width: #{globals.$ion-border-size-025}; + --border-color: #{globals.$ion-primitives-neutral-500}; } // Textarea Fill: Outline, Textarea Wrapper @@ -57,5 +57,5 @@ // ---------------------------------------------------------------- :host(.textarea-fill-outline) textarea { - margin-top: globals.$ionic-space-100; + margin-top: globals.$ion-space-100; } diff --git a/core/src/components/textarea/textarea.ionic.scss b/core/src/components/textarea/textarea.ionic.scss index 2a5be63e26..28bef41a37 100644 --- a/core/src/components/textarea/textarea.ionic.scss +++ b/core/src/components/textarea/textarea.ionic.scss @@ -6,14 +6,14 @@ // -------------------------------------------------- :host { - --color: #{globals.$ionic-color-neutral-1200}; - --highlight-color-valid: #{globals.$ionic-color-success-base}; - --highlight-color-invalid: #{globals.$ionic-color-danger-base}; - --placeholder-color: #{globals.$ionic-color-neutral-800}; + --color: #{globals.$ion-primitives-neutral-1200}; + --highlight-color-valid: #{globals.$ion-semantics-success-base}; + --highlight-color-invalid: #{globals.$ion-semantics-danger-base}; + --placeholder-color: #{globals.$ion-primitives-neutral-800}; --placeholder-opacity: 1; - --background: #{globals.$ionic-color-base-white}; + --background: #{globals.$ion-primitives-base-white}; - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); } // Ionic Textarea Sizes @@ -26,52 +26,52 @@ } :host(.textarea-size-small) .textarea-wrapper-inner { - --padding-top: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-300}; - --padding-bottom: #{globals.$ionic-space-200}; - --padding-start: #{globals.$ionic-space-300}; + --padding-top: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-300}; + --padding-bottom: #{globals.$ion-space-200}; + --padding-start: #{globals.$ion-space-300}; - min-height: globals.$ionic-scale-2800; + min-height: globals.$ion-scale-2800; } :host(.textarea-size-medium) .textarea-wrapper-inner { - --padding-top: #{globals.$ionic-space-300}; - --padding-end: #{globals.$ionic-space-400}; - --padding-bottom: #{globals.$ionic-space-300}; - --padding-start: #{globals.$ionic-space-400}; + --padding-top: #{globals.$ion-space-300}; + --padding-end: #{globals.$ion-space-400}; + --padding-bottom: #{globals.$ion-space-300}; + --padding-start: #{globals.$ion-space-400}; - min-height: globals.$ionic-scale-3400; + min-height: globals.$ion-scale-3400; } :host(.textarea-size-large) .textarea-wrapper-inner { - --padding-top: #{globals.$ionic-space-400}; - --padding-end: #{globals.$ionic-space-500}; - --padding-bottom: #{globals.$ionic-space-400}; - --padding-start: #{globals.$ionic-space-500}; + --padding-top: #{globals.$ion-space-400}; + --padding-end: #{globals.$ion-space-500}; + --padding-bottom: #{globals.$ion-space-400}; + --padding-start: #{globals.$ion-space-500}; - min-height: globals.$ionic-scale-3600; + min-height: globals.$ion-scale-3600; } // Ionic Textarea Shapes // -------------------------------------------------- :host(.textarea-shape-soft) { - --border-radius: #{globals.$ionic-border-radius-200}; + --border-radius: #{globals.$ion-border-radius-200}; } :host(.textarea-shape-round) { - --border-radius: #{globals.$ionic-border-radius-400}; + --border-radius: #{globals.$ion-border-radius-400}; } :host(.textarea-shape-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Textarea Wrapper // ---------------------------------------------------------------- .textarea-wrapper { - gap: globals.$ionic-space-100; + gap: globals.$ion-space-100; } .textarea-wrapper-inner { @@ -97,9 +97,9 @@ // ---------------------------------------------------------------- .label-text-wrapper { - @include globals.typography(globals.$ionic-body-sm-medium); + @include globals.typography(globals.$ion-body-sm-medium); - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; } :host(.label-floating) .label-text-wrapper { @@ -110,25 +110,25 @@ // ---------------------------------------------------------------- ion-icon { - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; - font-size: globals.$ionic-scale-400; + font-size: globals.$ion-scale-400; } .start-slot-wrapper, .end-slot-wrapper { - margin-top: globals.$ionic-space-050; + margin-top: globals.$ion-space-050; } // Textarea Bottom Content // ---------------------------------------------------------------- .textarea-bottom { - @include globals.padding(globals.$ionic-space-100, var(--padding-end), null, var(--padding-start)); - @include globals.typography(globals.$ionic-body-sm-medium); + @include globals.padding(globals.$ion-space-100, var(--padding-end), null, var(--padding-start)); + @include globals.typography(globals.$ion-body-sm-medium); } .textarea-bottom .helper-text, .textarea-bottom .counter { - color: globals.$ionic-color-neutral-800; + color: globals.$ion-primitives-neutral-800; } diff --git a/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png index d5fd7ffa4d..288cade8dd 100644 Binary files a/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png index 98ee8a7e5c..1d902283a9 100644 Binary files a/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/title/test/basic/title.e2e.ts-snapshots/title-basic-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/title/title.ionic.scss b/core/src/components/title/title.ionic.scss index fe18c12eb9..f44007c0e6 100644 --- a/core/src/components/title/title.ionic.scss +++ b/core/src/components/title/title.ionic.scss @@ -5,7 +5,7 @@ // -------------------------------------------------- :host { - @include globals.typography(globals.$ionic-heading-h6-medium); + @include globals.typography(globals.$ion-heading-h6-medium); @include globals.padding(var(--padding-top), 0, var(--padding-bottom)); box-sizing: border-box; @@ -28,5 +28,5 @@ // -------------------------------------------------- :host(.title-large) { - @include globals.typography(globals.$ionic-heading-h1-medium); + @include globals.typography(globals.$ion-heading-h1-medium); } diff --git a/core/src/components/toast/toast.ionic.scss b/core/src/components/toast/toast.ionic.scss index 2f3bfced63..076f7df63a 100644 --- a/core/src/components/toast/toast.ionic.scss +++ b/core/src/components/toast/toast.ionic.scss @@ -5,15 +5,15 @@ // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-neutral-1200}; - --box-shadow: #{globals.$ionic-elevation-400}; - --button-color: #{globals.$ionic-color-base-white}; - --color: #{globals.$ionic-color-base-white}; + --background: #{globals.$ion-primitives-neutral-1200}; + --box-shadow: #{globals.$ion-elevation-4}; + --button-color: #{globals.$ion-primitives-base-white}; + --color: #{globals.$ion-primitives-base-white}; --max-width: 343px; --start: 8px; --end: 8px; - @include globals.typography(globals.$ionic-body-md-medium); + @include globals.typography(globals.$ion-body-md-medium); // TODO(ROU-10853): replace this value with a layer token. z-index: 1001; @@ -32,56 +32,56 @@ } .toast-container { - @include globals.padding(globals.$ionic-space-300, globals.$ionic-space-400); + @include globals.padding(globals.$ion-space-300, globals.$ion-space-400); } // Toast Shapes // -------------------------------------------------- :host(.toast-shape-soft) { - --border-radius: #{globals.$ionic-border-radius-200}; + --border-radius: #{globals.$ion-border-radius-200}; } :host(.toast-shape-round) { - --border-radius: #{globals.$ionic-border-radius-400}; + --border-radius: #{globals.$ion-border-radius-400}; } :host(.toast-shape-rectangular) { - --border-radius: #{globals.$ionic-border-radius-0}; + --border-radius: #{globals.$ion-border-radius-0}; } // Toast Header // -------------------------------------------------- .toast-header { - @include globals.typography(globals.$ionic-heading-h6-medium); + @include globals.typography(globals.$ion-heading-h6-medium); } // Toast Button // -------------------------------------------------- .toast-layout-baseline .toast-button-group-start { - @include globals.margin-horizontal(null, globals.$ionic-space-400); + @include globals.margin-horizontal(null, globals.$ion-space-400); } .toast-layout-stacked .toast-button-group-start { - @include globals.margin(null, null, globals.$ionic-space-400, null); + @include globals.margin(null, null, globals.$ion-space-400, null); } .toast-layout-baseline .toast-button-group-end { - @include globals.margin-horizontal(globals.$ionic-space-400, null); + @include globals.margin-horizontal(globals.$ion-space-400, null); } .toast-layout-stacked .toast-button-group-end { - @include globals.margin(globals.$ionic-space-400, null, null, null); + @include globals.margin(globals.$ion-space-400, null, null, null); } .toast-button-group { - gap: globals.$ionic-space-400; + gap: globals.$ion-space-400; } .toast-button { - @include globals.typography(globals.$ionic-body-md-link); + @include globals.typography(globals.$ion-body-md-regular); @include globals.padding(0); // necessary for ripple to work properly @@ -89,6 +89,8 @@ background-color: transparent; + text-decoration: underline; + overflow: hidden; } @@ -96,7 +98,7 @@ // -------------------------------------------------- .toast-icon { - @include globals.margin-horizontal(0, globals.$ionic-space-200); + @include globals.margin-horizontal(0, globals.$ion-space-200); } // Toast Icon @@ -104,5 +106,5 @@ .toast-icon, .toast-button-icon { - font-size: globals.$ionic-scale-600; + font-size: globals.$ion-scale-600; } diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Chrome-linux.png index eb2ace6413..e54dbf294b 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png index 4e09cc3051..9050c5f24f 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Chrome-linux.png index 19a7460e51..f06319015f 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png index 2dfc0829f8..d9f914779f 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-inset-list-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Chrome-linux.png index 90c6e16551..d76bd6e2e8 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Firefox-linux.png index d58e1c7d76..4fcf596db6 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-item-color-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Chrome-linux.png index 90c6e16551..d76bd6e2e8 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Firefox-linux.png index d58e1c7d76..4fcf596db6 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Chrome-linux.png index 4bcadc06aa..d098edd761 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Firefox-linux.png index 4a0e11570c..c283f8b47f 100644 Binary files a/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/item/toggle.e2e.ts-snapshots/toggle-list-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png index 78aad53634..7c0b0dc066 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png index 168a3e8051..f6bd27ead2 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Safari-linux.png index 3d6890bfa3..166a9813d4 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png index 58ce3cf3bf..07f694d200 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png index 602c4fa08c..a0ecc5a2fe 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Safari-linux.png index 911f1ecbc4..2eb485718c 100644 Binary files a/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/toggle/test/sizes/toggle.e2e.ts-snapshots/toggle-sizes-diff-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/toggle/toggle.ionic.scss b/core/src/components/toggle/toggle.ionic.scss index 670a8cddcf..a81e5797b2 100644 --- a/core/src/components/toggle/toggle.ionic.scss +++ b/core/src/components/toggle/toggle.ionic.scss @@ -5,22 +5,22 @@ // ----------------------------------------- :host { - --track-background: #{globals.$ionic-color-neutral-800}; + --track-background: #{globals.$ion-primitives-neutral-800}; --track-background-checked: #{globals.ion-color(primary, base)}; - --border-radius: #{globals.$ionic-border-radius-full}; - --focus-ring-color: #{globals.$ionic-state-focus-1}; - --focus-ring-width: #{globals.$ionic-border-size-050}; - --handle-background: #{globals.$ionic-color-base-white}; - --handle-background-checked: #{globals.$ionic-color-base-white}; - --handle-border-radius: #{globals.$ionic-border-radius-full}; - --handle-height: #{globals.$ionic-scale-500}; - --handle-max-height: #{globals.$ionic-scale-500}; - --handle-width: #{globals.$ionic-scale-500}; - --handle-spacing: #{globals.$ionic-space-050}; + --border-radius: #{globals.$ion-border-radius-full}; + --focus-ring-color: #{globals.$ion-border-focus-default}; + --focus-ring-width: #{globals.$ion-border-size-050}; + --handle-background: #{globals.$ion-primitives-base-white}; + --handle-background-checked: #{globals.$ion-primitives-base-white}; + --handle-border-radius: #{globals.$ion-border-radius-full}; + --handle-height: #{globals.$ion-scale-500}; + --handle-max-height: #{globals.$ion-scale-500}; + --handle-width: #{globals.$ion-scale-500}; + --handle-spacing: #{globals.$ion-space-050}; --handle-transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms; - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); width: 100%; @@ -33,15 +33,15 @@ .toggle-wrapper { align-items: center; - min-height: globals.$ionic-scale-1200; + min-height: globals.$ion-scale-1200; } // Toggle Native Wrapper // ---------------------------------------------------------------- .native-wrapper .toggle-icon { - width: globals.$ionic-scale-1100; - height: globals.$ionic-scale-600; + width: globals.$ion-scale-1100; + height: globals.$ion-scale-600; /** * The handle box shadow should not @@ -58,7 +58,7 @@ // ---------------------------------------------------------------- :host(.ion-focused) .toggle-icon { - outline: var(--focus-ring-width) globals.$ionic-border-style-solid var(--focus-ring-color); + outline: var(--focus-ring-width) globals.$ion-border-style-solid var(--focus-ring-color); outline-offset: var(--focus-ring-width); } @@ -87,12 +87,12 @@ align-items: center; justify-content: center; - color: globals.$ionic-color-neutral-1200; + color: globals.$ion-primitives-neutral-1200; } .toggle-inner .toggle-switch-icon { - width: globals.$ionic-scale-400; - height: globals.$ionic-scale-400; + width: globals.$ion-scale-400; + height: globals.$ion-scale-400; } // Toggle Label Placement - Start/Default @@ -112,8 +112,8 @@ * the input should be on the end * when the label sits at the start. */ - @include globals.margin(null, globals.$ionic-space-400, null, 0); - color: globals.$ionic-color-neutral-1200; + @include globals.margin(null, globals.$ion-space-400, null, 0); + color: globals.$ion-primitives-neutral-1200; } // Toggle Label Placement - End @@ -133,5 +133,5 @@ * when the label sits at the end. */ :host(.toggle-label-placement-end) .label-text-wrapper { - @include globals.margin(null, 0, null, globals.$ionic-space-400); + @include globals.margin(null, 0, null, globals.$ion-space-400); } diff --git a/core/src/components/toolbar/toolbar.ionic.scss b/core/src/components/toolbar/toolbar.ionic.scss index 6a15979af3..37214ef7b8 100644 --- a/core/src/components/toolbar/toolbar.ionic.scss +++ b/core/src/components/toolbar/toolbar.ionic.scss @@ -13,18 +13,18 @@ $toolbar-order-ionic: ( // -------------------------------------------------- :host { - --background: #{globals.$ionic-color-base-white}; - --color: #{globals.$ionic-color-neutral-1200}; + --background: #{globals.$ion-primitives-base-white}; + --color: #{globals.$ion-primitives-neutral-1200}; --border-color: currentColor; - --padding-top: #{globals.$ionic-space-200}; - --padding-bottom: #{globals.$ionic-space-200}; - --padding-start: #{globals.$ionic-space-200}; - --padding-end: #{globals.$ionic-space-200}; - --min-height: #{globals.$ionic-scale-1400}; + --padding-top: #{globals.$ion-space-200}; + --padding-bottom: #{globals.$ion-space-200}; + --padding-start: #{globals.$ion-space-200}; + --padding-end: #{globals.$ion-space-200}; + --min-height: #{globals.$ion-scale-1400}; } .toolbar-container { - gap: globals.$ionic-space-400; + gap: globals.$ion-space-400; } // Toolbar: Content @@ -56,7 +56,7 @@ $toolbar-order-ionic: ( } :host(.toolbar-title-large) ::slotted(ion-title) { - @include globals.padding-horizontal(globals.$ionic-space-400); + @include globals.padding-horizontal(globals.$ion-space-400); } // Ionic Toolbar Slot Placement @@ -81,7 +81,7 @@ $toolbar-order-ionic: ( display: flex; flex: 1; - gap: globals.$ionic-space-200; + gap: globals.$ion-space-200; } ::slotted([slot="end"]) { diff --git a/core/src/css/ionic/core.ionic.scss b/core/src/css/ionic/core.ionic.scss index 928291ee32..8142977284 100644 --- a/core/src/css/ionic/core.ionic.scss +++ b/core/src/css/ionic/core.ionic.scss @@ -4,8 +4,8 @@ // -------------------------------------------------- :root { - --ionic-global-background-color: #{globals.$ionic-color-neutral-100}; - --ionic-global-text-color: #{globals.$ionic-color-neutral-900}; + --ionic-global-background-color: #{globals.$ion-primitives-neutral-100}; + --ionic-global-text-color: #{globals.$ion-primitives-neutral-900}; /** * Set the theme colors from the @@ -50,7 +50,7 @@ html.ionic ion-modal ion-header { html.ionic ion-modal.modal-card ion-header ion-toolbar:first-of-type, html.ionic ion-modal.modal-sheet ion-header ion-toolbar:first-of-type, html.ionic ion-modal ion-footer ion-toolbar:first-of-type { - padding-top: globals.$ionic-space-400; + padding-top: globals.$ion-space-400; } /** @@ -61,7 +61,7 @@ html.ionic ion-modal ion-footer ion-toolbar:first-of-type { html.ionic ion-modal.modal-card ion-header ion-toolbar:last-of-type, html.ionic ion-modal.modal-sheet ion-header ion-toolbar:last-of-type, html.ionic ion-modal ion-footer ion-toolbar:last-of-type { - padding-bottom: globals.$ionic-space-400; + padding-bottom: globals.$ion-space-400; } /** @@ -69,8 +69,8 @@ html.ionic ion-modal ion-footer ion-toolbar:last-of-type { * for the safe area insets. */ html.ionic ion-modal ion-toolbar { - --padding-start: calc(var(--ion-safe-area-right) + #{globals.$ionic-space-400}); - --padding-end: calc(var(--ion-safe-area-left) + #{globals.$ionic-space-400}); + --padding-start: calc(var(--ion-safe-area-right) + #{globals.$ion-space-400}); + --padding-end: calc(var(--ion-safe-area-left) + #{globals.$ion-space-400}); } /** @@ -95,9 +95,9 @@ html.ionic ion-modal ion-header ion-toolbar ion-title { * within a modal. */ html.ionic ion-modal.modal-sheet ion-content { - --padding-start: #{globals.$ionic-space-400}; - --padding-end: #{globals.$ionic-space-400}; - --padding-bottom: #{globals.$ionic-space-400}; + --padding-start: #{globals.$ion-space-400}; + --padding-end: #{globals.$ion-space-400}; + --padding-bottom: #{globals.$ion-space-400}; } /** @@ -223,7 +223,7 @@ ion-toast-controller, html.plt-ios.plt-hybrid, html.plt-ios.plt-pwa { - --ion-statusbar-padding: #{globals.$ionic-space-500}; + --ion-statusbar-padding: #{globals.$ion-space-500}; } @supports (padding-top: 20px) { @@ -293,28 +293,28 @@ ion-card-header.ion-color .ion-inherit-color { } .menu-content-reveal { - box-shadow: #{globals.$ionic-elevation-100}; + box-shadow: #{globals.$ion-elevation-1}; } .menu-content-push { - box-shadow: #{globals.$ionic-elevation-100}; + box-shadow: #{globals.$ion-elevation-1}; } // Accordion Styles ion-accordion-group.accordion-group-expand-inset > ion-accordion:first-of-type { - border-top-left-radius: globals.$ionic-border-radius-200; - border-top-right-radius: globals.$ionic-border-radius-200; + border-top-left-radius: globals.$ion-border-radius-200; + border-top-right-radius: globals.$ion-border-radius-200; } ion-accordion-group.accordion-group-expand-inset > ion-accordion:last-of-type { - border-bottom-left-radius: globals.$ionic-border-radius-200; - border-bottom-right-radius: globals.$ionic-border-radius-200; + border-bottom-left-radius: globals.$ion-border-radius-200; + border-bottom-right-radius: globals.$ion-border-radius-200; } // The toggle icon is nested in the accordion item so we need to // style it from a global level. ion-accordion > [slot="header"] .ion-accordion-toggle-icon { - color: globals.$ionic-color-neutral-1000; - font-size: globals.$ionic-scale-600; + color: globals.$ion-primitives-neutral-1000; + font-size: globals.$ion-scale-600; } ion-accordion.accordion-animated > [slot="header"] .ion-accordion-toggle-icon { @@ -341,15 +341,15 @@ ion-accordion.accordion-expanded > [slot="header"] .ion-accordion-toggle-icon { // Items inside of an accordion should have reduced padding // due to the padding added to the accordion content. ion-accordion > [slot="content"] ion-item { - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); - color: globals.$ionic-color-neutral-1000; + color: globals.$ion-primitives-neutral-1000; --padding-start: 0; - --padding-top: #{globals.$ionic-space-300}; - --padding-bottom: #{globals.$ionic-space-300}; + --padding-top: #{globals.$ion-space-300}; + --padding-bottom: #{globals.$ion-space-300}; --padding-end: 0; - --min-height: #{globals.$ionic-scale-700}; + --min-height: #{globals.$ion-scale-700}; } // Safari/iOS 15 changes the appearance of input[type="date"]. diff --git a/core/src/css/ionic/ionic-swiper.ionic.scss b/core/src/css/ionic/ionic-swiper.ionic.scss index f2ffc58d4b..9de90bbf89 100644 --- a/core/src/css/ionic/ionic-swiper.ionic.scss +++ b/core/src/css/ionic/ionic-swiper.ionic.scss @@ -4,10 +4,10 @@ // -------------------------------------------------- .swiper { - --bullet-background: #{tokens.$ionic-color-neutral-800}; - --bullet-background-active: #{tokens.$ionic-color-primary-base}; + --bullet-background: #{tokens.$ion-primitives-neutral-800}; + --bullet-background-active: #{tokens.$ion-semantics-primary-base}; --progress-bar-background: rgba(#010408, 0.25); - --progress-bar-background-active: #{tokens.$ionic-color-primary-600}; + --progress-bar-background-active: #{tokens.$ion-semantics-primary-600}; --scroll-bar-background: rgba(#010408, 0.1); --scroll-bar-background-active: rgba(#010408, 0.5); /** diff --git a/core/src/css/ionic/link.ionic.scss b/core/src/css/ionic/link.ionic.scss index 25e706e866..e9d9d633c8 100644 --- a/core/src/css/ionic/link.ionic.scss +++ b/core/src/css/ionic/link.ionic.scss @@ -7,11 +7,11 @@ align-items: center; - gap: globals.$ionic-space-100; + gap: globals.$ion-space-100; transition: color 0.2s ease-in-out; - font-weight: globals.$ionic-font-weight-regular; + font-weight: globals.$ion-font-weight-regular; text-decoration-color: inherit; @@ -23,7 +23,7 @@ // ------------------------------------------------------------------------------- &:visited { - color: globals.$ionic-color-info-500; + color: globals.$ion-semantics-info-500; } } @@ -31,7 +31,7 @@ // ------------------------------------------------------------------------------- @mixin ionic-link { - color: globals.$ionic-color-info-400; + color: globals.$ion-semantics-info-400; text-decoration: none; @@ -51,7 +51,7 @@ &:focus, &.ion-focused { - outline: 2px solid globals.$ionic-color-primary-100; + outline: 2px solid globals.$ion-semantics-primary-100; outline-offset: 2px; text-decoration: underline; @@ -62,7 +62,7 @@ &:active, &.ion-activated { - color: globals.$ionic-color-info-500; + color: globals.$ion-semantics-info-500; text-decoration: underline; } @@ -88,7 +88,7 @@ a.ionic-link, @media (any-hover: hover) { &:hover { - color: globals.$ionic-color-info-400; + color: globals.$ion-semantics-info-400; } } @@ -97,7 +97,7 @@ a.ionic-link, &:focus, &.ion-focused { - outline: 2px solid globals.$ionic-color-primary-100; + outline: 2px solid globals.$ion-semantics-primary-100; outline-offset: 2px; color: currentColor; @@ -110,7 +110,7 @@ a.ionic-link, &:active, &.ion-activated { - color: globals.$ionic-color-info-500; + color: globals.$ion-semantics-info-500; } } diff --git a/core/src/css/ionic/typography.ionic.scss b/core/src/css/ionic/typography.ionic.scss index afbe10f65d..cb746952ec 100644 --- a/core/src/css/ionic/typography.ionic.scss +++ b/core/src/css/ionic/typography.ionic.scss @@ -2,34 +2,34 @@ // TODO(ROU-10833): add font loading solution here, as a @font-face, base64 or cdn html { - font-family: globals.$ionic-font-family; + font-family: globals.$ion-font-family; } body { - @include globals.typography(globals.$ionic-body-md-regular); + @include globals.typography(globals.$ion-body-md-regular); } /* Override html headings based on heading tokens */ h1 { - @include globals.typography(globals.$ionic-heading-h1-regular); + @include globals.typography(globals.$ion-heading-h1-regular); } h2 { - @include globals.typography(globals.$ionic-heading-h2-regular); + @include globals.typography(globals.$ion-heading-h2-regular); } h3 { - @include globals.typography(globals.$ionic-heading-h3-regular); + @include globals.typography(globals.$ion-heading-h3-regular); } h4 { - @include globals.typography(globals.$ionic-heading-h4-regular); + @include globals.typography(globals.$ion-heading-h4-regular); } h5 { - @include globals.typography(globals.$ionic-heading-h5-regular); + @include globals.typography(globals.$ion-heading-h5-regular); } h6 { - @include globals.typography(globals.$ionic-heading-h6-regular); + @include globals.typography(globals.$ion-heading-h6-regular); } diff --git a/core/src/css/test/typography/basic/index.html b/core/src/css/test/typography/basic/index.html index 989efe0443..2d88f16417 100644 --- a/core/src/css/test/typography/basic/index.html +++ b/core/src/css/test/typography/basic/index.html @@ -23,90 +23,84 @@ - +
Display lg -

display-lg-regular

-

display-lg-light

+

display-lg-regular

+

display-lg-light

sm -

display-sm-regular

-

display-sm-light

+

display-sm-regular

+

display-sm-light


Headings h1 -

heading-h1-regular

-

heading-h1-medium

-

heading-h1-semi-bold

-

heading-h1-bold

+

heading-h1-regular

+

heading-h1-medium

+

heading-h1-semi-bold

+

heading-h1-bold

h2 -

heading-h2-regular

-

heading-h2-medium

-

heading-h2-semi-bold

-

heading-h2-bold

+

heading-h2-regular

+

heading-h2-medium

+

heading-h2-semi-bold

+

heading-h2-bold

h3 -

heading-h3-regular

-

heading-h3-medium

-

heading-h3-semi-bold

-

heading-h3-bold

+

heading-h3-regular

+

heading-h3-medium

+

heading-h3-semi-bold

+

heading-h3-bold

h4 -

heading-h4-regular

-

heading-h4-medium

-

heading-h4-semi-bold

-

heading-h4-bold

+

heading-h4-regular

+

heading-h4-medium

+

heading-h4-semi-bold

+

heading-h4-bold

h5 -

heading-h5-regular

-

heading-h5-medium

-

heading-h5-semi-bold

-

heading-h5-bold

+

heading-h5-regular

+

heading-h5-medium

+

heading-h5-semi-bold

+

heading-h5-bold

h6 -

heading-h6-regular

-

heading-h6-medium

-

heading-h6-semi-bold

-

heading-h6-bold

+

heading-h6-regular

+

heading-h6-medium

+

heading-h6-semi-bold

+

heading-h6-bold


Body sm -

ionic-body-sm-regular

-

ionic-body-sm-medium

-

ionic-body-sm-semi-bold

-

ionic-body-sm-bold

-

ionic-body-sm-link

-

ionic-body-sm-italic

+

ion-body-sm-regular

+

ion-body-sm-medium

+

ion-body-sm-semi-bold

+

ion-body-sm-bold

md -

ionic-body-md-regular

-

ionic-body-md-medium

-

ionic-body-md-semi-bold

-

ionic-body-md-bold

-

ionic-body-md-link

-

ionic-body-md-italic

+

ion-body-md-regular

+

ion-body-md-medium

+

ion-body-md-semi-bold

+

ion-body-md-bold

lg -

ionic-body-lg-regular

-

ionic-body-lg-medium

-

ionic-body-lg-semi-bold

-

ionic-body-lg-bold

-

ionic-body-lg-link

-

ionic-body-lg-italic

+

ion-body-lg-regular

+

ion-body-lg-medium

+

ion-body-lg-semi-bold

+

ion-body-lg-bold


Action -

ionic-action-sm

-

ionic-action-md

-

ionic-action-lg

-

ionic-action-xl

+

ion-action-sm

+

ion-action-md

+

ion-action-lg

+

ion-action-xl


Overline -

ionic-overline-regular

-

ionic-overline-medium

-

ionic-overline-semi-bold

-

ionic-overline-bold

+

ion-overline-regular

+

ion-overline-medium

+

ion-overline-semi-bold

+

ion-overline-bold

 diff --git a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Chrome-linux.png index 635d03fdb6..7daa4d1dee 100644 Binary files a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Firefox-linux.png index 57d0fd4715..42643eb2d2 100644 Binary files a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Safari-linux.png index 22c1fe4764..8e1e568926 100644 Binary files a/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/css/test/typography/basic/typography.e2e.ts-snapshots/ionic-typography-basic-styles-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/foundations/README.md b/core/src/foundations/README.md index b2b0020ff4..261372cccd 100644 --- a/core/src/foundations/README.md +++ b/core/src/foundations/README.md @@ -8,21 +8,10 @@ Design tokens represent small, repeated design decisions that make up a design s ## Design Tokens Architecture -The Ionic Design Tokens are stored on `core/src/foundations/tokens`. Here we have the abstract primitive tokens that will be common between all themes. -Inside the `core/src/foundations/tokens/theme` we have the tokens that are specific to the new IOnic Theme, like primary colors, font-family and color states. +The Ionic Design Tokens come from the [outsystems-design-tokens repo](https://github.com/OutSystems/outsystems-design-tokens). -Currently, six categories of tokens are stored: +Using the [outsystems-design-tokens package](https://www.npmjs.com/package/outsystems-design-tokens), we use its `npx run build.tokens` to pass our configuration file, that will generate 2 files inside `core/src/foundations`: -- Colors -- Font -- Scale -- Border -- Elevation -- Z-index - -Using [Style Dictionary](https://amzn.github.io/style-dictionary/), these tokens generate 3 files inside `core/src/foundations`: - -- `ionic.root.scss` - native CSS Custom Properties inside a `:root` element. - `ionic.vars.scss` - SCSS variables, based on the native ones, that are used internally on all CSS/SCSS code. - `ionic.utility.scss` - list of utility classes based on each Design Token. @@ -51,39 +40,27 @@ Example: } ``` -The `tokens.js` script, responsible for generating CSS and SCSS variables along with utility classes, will follow the same nomenclature: `prefix - CSS property name - type variation - modifier name`. +The `index.js` script, on the scripts/tokens folder, is responsible for generating SCSS variables and utility classes, will follow the same nomenclature: `prefix - CSS property name - type variation - modifier name`. -Examples: - -CSS Custom Property: - -```css ---ionic-color-primary-100 -``` +Examples: SCSS Variable: ```scss -$ionic-color-primary-100 +$ion-semantics-primary-300 ``` Utility class: ```css -.ionic-color-primary-100 +.ion-semantics-primary-300 ``` -## When to change the Design Tokens +## Managing the Design Tokens -It's not expected that the `design-tokens.json` needs to be changed frequently. This represents the base of all the Ionic Design System and any change to the json file should be taken carefully, synced with the UX/UI Team and reviewed by other devs. +It's not expected that the tokens need to be changed frequently. This represents the base of all the Ionic Design System and any change to them should be taken carefully, synced with the UX/UI Team and reviewed by other devs. -Adding new tokens is more or less risk free. However, changing values will result in visual breaking changes and renaming tokens might cause the build to be broken. - -## How to change the Design Tokens - -Using `npm run build.tokens` will generate the `ionic.root.scss`, `ionic.vars.scss`, and `ionic.utility.scss` files with the updated values that come from the `design-tokens.json`. - -Design Tokens will also be generated automatically with the `npm run build` command. This ensures that if someone modifies the JSON without running the build tokens command, the changes will be applied correctly. +With the current architecture, this management is done on the [outsystems-design-tokens repo](https://github.com/OutSystems/outsystems-design-tokens), and its dependency is updated here as needed. ## How to use @@ -99,8 +76,8 @@ Usage example (Chip Component): @use '../../themes/ionic/ionic.globals.scss' as globals; :host { - --background: #{globals.$ionic-color-neutral-100}; - color: globals.$ionic-color-neutral-900; + --background: #{globals.$ion-primitives-neutral-100}; + color: globals.$ion-primitives-neutral-900; @include globals.font-smoothing; } ``` diff --git a/core/src/foundations/ionic.root.scss b/core/src/foundations/ionic.root.scss deleted file mode 100644 index ef0131858a..0000000000 --- a/core/src/foundations/ionic.root.scss +++ /dev/null @@ -1,629 +0,0 @@ -/** - * This is an auto-generated file, please do not change it directly. - * Ionic Design System - */ - -@use "../themes/functions.sizes" as font; - -:root { - --ionic-elevation-100: 0px 3px 9px 0px rgba(0, 0, 0, 0.07), 0px 0px 4px 0px rgba(0, 0, 0, 0.04); - --ionic-elevation-200: 0px 8px 25px 0px rgba(0, 0, 0, 0.08), 0px 1px 5px 0px rgba(0, 0, 0, 0.05); - --ionic-elevation-300: 0px 6px 32px 0px rgba(0, 0, 0, 0.16), 0px 2px 7px 0px rgba(0, 0, 0, 0.05); - --ionic-elevation-400: 0px 15px 48px 0px rgba(0, 0, 0, 0.18), 0px 3px 12px 0px rgba(0, 0, 0, 0.12); - --ionic-elevation-500: 0px 3px 9px 0px rgba(6, 43, 99, 0.07), 0px 0px 4px 0px rgba(6, 43, 99, 0.04); - --ionic-elevation-600: 0px 8px 25px 0px rgba(6, 43, 99, 0.08), 0px 1px 5px 0px rgba(6, 43, 99, 0.05); - --ionic-elevation-700: 0px 15px 32px 0px rgba(6, 43, 99, 0.09), 0px 2px 7px 0px rgba(6, 43, 99, 0.05); - --ionic-elevation-800: 0px 20px 48px 0px rgba(6, 43, 99, 0.12), 0px 3px 14px 0px rgba(6, 43, 99, 0.12); - --ionic-font-size-275: #{font.px-to-rem(11)}; - --ionic-font-size-300: #{font.px-to-rem(12)}; - --ionic-font-size-350: #{font.px-to-rem(14)}; - --ionic-font-size-400: #{font.px-to-rem(16)}; - --ionic-font-size-450: #{font.px-to-rem(18)}; - --ionic-font-size-500: #{font.px-to-rem(20)}; - --ionic-font-size-550: #{font.px-to-rem(22)}; - --ionic-font-size-600: #{font.px-to-rem(24)}; - --ionic-font-size-650: #{font.px-to-rem(26)}; - --ionic-font-size-700: #{font.px-to-rem(28)}; - --ionic-font-size-800: #{font.px-to-rem(32)}; - --ionic-font-size-900: #{font.px-to-rem(36)}; - --ionic-font-weight-thin: 100; - --ionic-font-weight-extra-light: 200; - --ionic-font-weight-light: 300; - --ionic-font-weight-regular: 400; - --ionic-font-weight-medium: 500; - --ionic-font-weight-semi-bold: 600; - --ionic-font-weight-bold: 700; - --ionic-font-weight-extra-bold: 800; - --ionic-font-weight-black: 900; - --ionic-letter-spacing-0: 0; - --ionic-letter-spacing-1: 1%; - --ionic-letter-spacing-2: 1.5%; - --ionic-line-height-300: 12px; - --ionic-line-height-400: 16px; - --ionic-line-height-500: 20px; - --ionic-line-height-600: 24px; - --ionic-line-height-700: 28px; - --ionic-line-height-800: 32px; - --ionic-line-height-900: 36px; - --ionic-line-height-1100: 44px; - --ionic-line-height-1200: 48px; - --ionic-line-height-full: 100%; - --ionic-space-0: 0px; - --ionic-space-100: 4px; - --ionic-space-150: 6px; - --ionic-space-200: 8px; - --ionic-space-250: 10px; - --ionic-space-300: 12px; - --ionic-space-400: 16px; - --ionic-space-500: 20px; - --ionic-space-600: 24px; - --ionic-space-700: 28px; - --ionic-space-800: 32px; - --ionic-space-850: 34px; - --ionic-space-900: 36px; - --ionic-space-1000: 40px; - --ionic-space-1200: 48px; - --ionic-space-050: 2px; - --ionic-border-radius-0: 0px; - --ionic-border-radius-100: 4px; - --ionic-border-radius-200: 8px; - --ionic-border-radius-300: 12px; - --ionic-border-radius-400: 16px; - --ionic-border-radius-500: 20px; - --ionic-border-radius-800: 32px; - --ionic-border-radius-1000: 40px; - --ionic-border-radius-050: 2px; - --ionic-border-radius-full: 999px; - --ionic-border-size-0: 0px; - --ionic-border-size-025: 1px; - --ionic-border-size-050: 2px; - --ionic-border-size-075: 3px; - --ionic-border-style-none: none; - --ionic-border-style-solid: solid; - --ionic-border-style-dashed: dashed; - --ionic-border-style-dotted: dotted; - --ionic-color-base-white: #ffffff; - --ionic-color-base-white-rgb: 255, 255, 255; - --ionic-color-base-black: #111111; - --ionic-color-base-black-rgb: 17, 17, 17; - --ionic-color-neutral-100: #f1f1f1; - --ionic-color-neutral-100-rgb: 241, 241, 241; - --ionic-color-neutral-200: #e7e7e7; - --ionic-color-neutral-200-rgb: 231, 231, 231; - --ionic-color-neutral-300: #cfcfcf; - --ionic-color-neutral-300-rgb: 207, 207, 207; - --ionic-color-neutral-400: #b9b9b9; - --ionic-color-neutral-400-rgb: 185, 185, 185; - --ionic-color-neutral-500: #a2a2a2; - --ionic-color-neutral-500-rgb: 162, 162, 162; - --ionic-color-neutral-600: #8c8c8c; - --ionic-color-neutral-600-rgb: 140, 140, 140; - --ionic-color-neutral-700: #777777; - --ionic-color-neutral-700-rgb: 119, 119, 119; - --ionic-color-neutral-800: #626262; - --ionic-color-neutral-800-rgb: 98, 98, 98; - --ionic-color-neutral-900: #4e4e4e; - --ionic-color-neutral-900-rgb: 78, 78, 78; - --ionic-color-neutral-1000: #3b3b3b; - --ionic-color-neutral-1000-rgb: 59, 59, 59; - --ionic-color-neutral-1100: #292929; - --ionic-color-neutral-1100-rgb: 41, 41, 41; - --ionic-color-neutral-1200: #242424; - --ionic-color-neutral-1200-rgb: 36, 36, 36; - --ionic-color-red-100: #feeded; - --ionic-color-red-100-rgb: 254, 237, 237; - --ionic-color-red-200: #fde1e1; - --ionic-color-red-200-rgb: 253, 225, 225; - --ionic-color-red-300: #fcc1c1; - --ionic-color-red-300-rgb: 252, 193, 193; - --ionic-color-red-400: #faa1a1; - --ionic-color-red-400-rgb: 250, 161, 161; - --ionic-color-red-500: #f97d7d; - --ionic-color-red-500-rgb: 249, 125, 125; - --ionic-color-red-600: #f85151; - --ionic-color-red-600-rgb: 248, 81, 81; - --ionic-color-red-700: #e52929; - --ionic-color-red-700-rgb: 229, 41, 41; - --ionic-color-red-800: #bf2222; - --ionic-color-red-800-rgb: 191, 34, 34; - --ionic-color-red-900: #991b1b; - --ionic-color-red-900-rgb: 153, 27, 27; - --ionic-color-red-1000: #761515; - --ionic-color-red-1000-rgb: 118, 21, 21; - --ionic-color-red-1100: #540f0f; - --ionic-color-red-1100-rgb: 84, 15, 15; - --ionic-color-red-1200: #330909; - --ionic-color-red-1200-rgb: 51, 9, 9; - --ionic-color-pumpkin-100: #feedea; - --ionic-color-pumpkin-100-rgb: 254, 237, 234; - --ionic-color-pumpkin-200: #fde0db; - --ionic-color-pumpkin-200-rgb: 253, 224, 219; - --ionic-color-pumpkin-300: #fbbdb1; - --ionic-color-pumpkin-300-rgb: 251, 189, 177; - --ionic-color-pumpkin-400: #f9947c; - --ionic-color-pumpkin-400-rgb: 249, 148, 124; - --ionic-color-pumpkin-500: #f75d07; - --ionic-color-pumpkin-500-rgb: 247, 93, 7; - --ionic-color-pumpkin-600: #da5206; - --ionic-color-pumpkin-600-rgb: 218, 82, 6; - --ionic-color-pumpkin-700: #bd4705; - --ionic-color-pumpkin-700-rgb: 189, 71, 5; - --ionic-color-pumpkin-800: #9f3c05; - --ionic-color-pumpkin-800-rgb: 159, 60, 5; - --ionic-color-pumpkin-900: #803004; - --ionic-color-pumpkin-900-rgb: 128, 48, 4; - --ionic-color-pumpkin-1000: #602403; - --ionic-color-pumpkin-1000-rgb: 96, 36, 3; - --ionic-color-pumpkin-1100: #401802; - --ionic-color-pumpkin-1100-rgb: 64, 24, 2; - --ionic-color-pumpkin-1200: #210c01; - --ionic-color-pumpkin-1200-rgb: 33, 12, 1; - --ionic-color-orange-100: #fff1ea; - --ionic-color-orange-100-rgb: 255, 241, 234; - --ionic-color-orange-200: #ffe8db; - --ionic-color-orange-200-rgb: 255, 232, 219; - --ionic-color-orange-300: #ffcfb1; - --ionic-color-orange-300-rgb: 255, 207, 177; - --ionic-color-orange-400: #ffb37b; - --ionic-color-orange-400-rgb: 255, 179, 123; - --ionic-color-orange-500: #ff9400; - --ionic-color-orange-500-rgb: 255, 148, 0; - --ionic-color-orange-600: #e18300; - --ionic-color-orange-600-rgb: 225, 131, 0; - --ionic-color-orange-700: #c37100; - --ionic-color-orange-700-rgb: 195, 113, 0; - --ionic-color-orange-800: #a45f00; - --ionic-color-orange-800-rgb: 164, 95, 0; - --ionic-color-orange-900: #844d00; - --ionic-color-orange-900-rgb: 132, 77, 0; - --ionic-color-orange-1000: #633a00; - --ionic-color-orange-1000-rgb: 99, 58, 0; - --ionic-color-orange-1100: #422700; - --ionic-color-orange-1100-rgb: 66, 39, 0; - --ionic-color-orange-1200: #221400; - --ionic-color-orange-1200-rgb: 34, 20, 0; - --ionic-color-yellow-100: #fff9ea; - --ionic-color-yellow-100-rgb: 255, 249, 234; - --ionic-color-yellow-200: #fff5db; - --ionic-color-yellow-200-rgb: 255, 245, 219; - --ionic-color-yellow-300: #ffebb1; - --ionic-color-yellow-300-rgb: 255, 235, 177; - --ionic-color-yellow-400: #ffe07b; - --ionic-color-yellow-400-rgb: 255, 224, 123; - --ionic-color-yellow-500: #ffd600; - --ionic-color-yellow-500-rgb: 255, 214, 0; - --ionic-color-yellow-600: #e1bd00; - --ionic-color-yellow-600-rgb: 225, 189, 0; - --ionic-color-yellow-700: #c3a400; - --ionic-color-yellow-700-rgb: 195, 164, 0; - --ionic-color-yellow-800: #a48a00; - --ionic-color-yellow-800-rgb: 164, 138, 0; - --ionic-color-yellow-900: #846f00; - --ionic-color-yellow-900-rgb: 132, 111, 0; - --ionic-color-yellow-1000: #635300; - --ionic-color-yellow-1000-rgb: 99, 83, 0; - --ionic-color-yellow-1100: #423800; - --ionic-color-yellow-1100-rgb: 66, 56, 0; - --ionic-color-yellow-1200: #221d00; - --ionic-color-yellow-1200-rgb: 34, 29, 0; - --ionic-color-lime-100: #f3faea; - --ionic-color-lime-100-rgb: 243, 250, 234; - --ionic-color-lime-200: #eaf7db; - --ionic-color-lime-200-rgb: 234, 247, 219; - --ionic-color-lime-300: #d3efb2; - --ionic-color-lime-300-rgb: 211, 239, 178; - --ionic-color-lime-400: #bbe77d; - --ionic-color-lime-400-rgb: 187, 231, 125; - --ionic-color-lime-500: #a0df18; - --ionic-color-lime-500-rgb: 160, 223, 24; - --ionic-color-lime-600: #8dc515; - --ionic-color-lime-600-rgb: 141, 197, 21; - --ionic-color-lime-700: #7aab12; - --ionic-color-lime-700-rgb: 122, 171, 18; - --ionic-color-lime-800: #678f0f; - --ionic-color-lime-800-rgb: 103, 143, 15; - --ionic-color-lime-900: #53730c; - --ionic-color-lime-900-rgb: 83, 115, 12; - --ionic-color-lime-1000: #3e5709; - --ionic-color-lime-1000-rgb: 62, 87, 9; - --ionic-color-lime-1100: #2a3a06; - --ionic-color-lime-1100-rgb: 42, 58, 6; - --ionic-color-lime-1200: #151e03; - --ionic-color-lime-1200-rgb: 21, 30, 3; - --ionic-color-green-100: #ebf9ec; - --ionic-color-green-100-rgb: 235, 249, 236; - --ionic-color-green-200: #dcf5de; - --ionic-color-green-200-rgb: 220, 245, 222; - --ionic-color-green-300: #b3ebb7; - --ionic-color-green-300-rgb: 179, 235, 183; - --ionic-color-green-400: #7fe089; - --ionic-color-green-400-rgb: 127, 224, 137; - --ionic-color-green-500: #23d643; - --ionic-color-green-500-rgb: 35, 214, 67; - --ionic-color-green-600: #1fbd3b; - --ionic-color-green-600-rgb: 31, 189, 59; - --ionic-color-green-700: #1ba433; - --ionic-color-green-700-rgb: 27, 164, 51; - --ionic-color-green-800: #178a2b; - --ionic-color-green-800-rgb: 23, 138, 43; - --ionic-color-green-900: #126f23; - --ionic-color-green-900-rgb: 18, 111, 35; - --ionic-color-green-1000: #0e531a; - --ionic-color-green-1000-rgb: 14, 83, 26; - --ionic-color-green-1100: #093811; - --ionic-color-green-1100-rgb: 9, 56, 17; - --ionic-color-green-1200: #051d09; - --ionic-color-green-1200-rgb: 5, 29, 9; - --ionic-color-teal-100: #eaf8f5; - --ionic-color-teal-100-rgb: 234, 248, 245; - --ionic-color-teal-200: #dbf3ee; - --ionic-color-teal-200-rgb: 219, 243, 238; - --ionic-color-teal-300: #b1e7dd; - --ionic-color-teal-300-rgb: 177, 231, 221; - --ionic-color-teal-400: #7bdbca; - --ionic-color-teal-400-rgb: 123, 219, 202; - --ionic-color-teal-500: #00cfb7; - --ionic-color-teal-500-rgb: 0, 207, 183; - --ionic-color-teal-600: #00b7a2; - --ionic-color-teal-600-rgb: 0, 183, 162; - --ionic-color-teal-700: #009e8c; - --ionic-color-teal-700-rgb: 0, 158, 140; - --ionic-color-teal-800: #008576; - --ionic-color-teal-800-rgb: 0, 133, 118; - --ionic-color-teal-900: #006b5f; - --ionic-color-teal-900-rgb: 0, 107, 95; - --ionic-color-teal-1000: #005147; - --ionic-color-teal-1000-rgb: 0, 81, 71; - --ionic-color-teal-1100: #003630; - --ionic-color-teal-1100-rgb: 0, 54, 48; - --ionic-color-teal-1200: #001c19; - --ionic-color-teal-1200-rgb: 0, 28, 25; - --ionic-color-aqua-100: #ebf9fe; - --ionic-color-aqua-100-rgb: 235, 249, 254; - --ionic-color-aqua-200: #dcf4fd; - --ionic-color-aqua-200-rgb: 220, 244, 253; - --ionic-color-aqua-300: #b3e9fc; - --ionic-color-aqua-300-rgb: 179, 233, 252; - --ionic-color-aqua-400: #80defa; - --ionic-color-aqua-400-rgb: 128, 222, 250; - --ionic-color-aqua-500: #27d3f9; - --ionic-color-aqua-500-rgb: 39, 211, 249; - --ionic-color-aqua-600: #22bbdc; - --ionic-color-aqua-600-rgb: 34, 187, 220; - --ionic-color-aqua-700: #1ea2bf; - --ionic-color-aqua-700-rgb: 30, 162, 191; - --ionic-color-aqua-800: #1988a0; - --ionic-color-aqua-800-rgb: 25, 136, 160; - --ionic-color-aqua-900: #146d81; - --ionic-color-aqua-900-rgb: 20, 109, 129; - --ionic-color-aqua-1000: #0f5261; - --ionic-color-aqua-1000-rgb: 15, 82, 97; - --ionic-color-aqua-1100: #0a3741; - --ionic-color-aqua-1100-rgb: 10, 55, 65; - --ionic-color-aqua-1200: #051c21; - --ionic-color-aqua-1200-rgb: 5, 28, 33; - --ionic-color-blue-100: #f2f4fd; - --ionic-color-blue-100-rgb: 242, 244, 253; - --ionic-color-blue-200: #e9ecfc; - --ionic-color-blue-200-rgb: 233, 236, 252; - --ionic-color-blue-300: #d0d7fa; - --ionic-color-blue-300-rgb: 208, 215, 250; - --ionic-color-blue-400: #b5c0f7; - --ionic-color-blue-400-rgb: 181, 192, 247; - --ionic-color-blue-500: #94a5f4; - --ionic-color-blue-500-rgb: 148, 165, 244; - --ionic-color-blue-600: #6986f2; - --ionic-color-blue-600-rgb: 105, 134, 242; - --ionic-color-blue-700: #105cef; - --ionic-color-blue-700-rgb: 16, 92, 239; - --ionic-color-blue-800: #0f54da; - --ionic-color-blue-800-rgb: 15, 84, 218; - --ionic-color-blue-900: #0d4bc3; - --ionic-color-blue-900-rgb: 13, 75, 195; - --ionic-color-blue-1000: #0b41a9; - --ionic-color-blue-1000-rgb: 11, 65, 169; - --ionic-color-blue-1100: #09358a; - --ionic-color-blue-1100-rgb: 9, 53, 138; - --ionic-color-blue-1200: #072561; - --ionic-color-blue-1200-rgb: 7, 37, 97; - --ionic-color-indigo-100: #f3f2fb; - --ionic-color-indigo-100-rgb: 243, 242, 251; - --ionic-color-indigo-200: #eae9f9; - --ionic-color-indigo-200-rgb: 234, 233, 249; - --ionic-color-indigo-300: #d3d1f2; - --ionic-color-indigo-300-rgb: 211, 209, 242; - --ionic-color-indigo-400: #bab5eb; - --ionic-color-indigo-400-rgb: 186, 181, 235; - --ionic-color-indigo-500: #9d95e4; - --ionic-color-indigo-500-rgb: 157, 149, 228; - --ionic-color-indigo-600: #786bdd; - --ionic-color-indigo-600-rgb: 120, 107, 221; - --ionic-color-indigo-700: #411bd5; - --ionic-color-indigo-700-rgb: 65, 27, 213; - --ionic-color-indigo-800: #3b19c3; - --ionic-color-indigo-800-rgb: 59, 25, 195; - --ionic-color-indigo-900: #3516ae; - --ionic-color-indigo-900-rgb: 53, 22, 174; - --ionic-color-indigo-1000: #2e1397; - --ionic-color-indigo-1000-rgb: 46, 19, 151; - --ionic-color-indigo-1100: #26107b; - --ionic-color-indigo-1100-rgb: 38, 16, 123; - --ionic-color-indigo-1200: #1a0b57; - --ionic-color-indigo-1200-rgb: 26, 11, 87; - --ionic-color-violet-100: #f5f2fe; - --ionic-color-violet-100-rgb: 245, 242, 254; - --ionic-color-violet-200: #eee9fd; - --ionic-color-violet-200-rgb: 238, 233, 253; - --ionic-color-violet-300: #dcd1fb; - --ionic-color-violet-300-rgb: 220, 209, 251; - --ionic-color-violet-400: #c9b6f9; - --ionic-color-violet-400-rgb: 201, 182, 249; - --ionic-color-violet-500: #b396f6; - --ionic-color-violet-500-rgb: 179, 150, 246; - --ionic-color-violet-600: #9a6cf4; - --ionic-color-violet-600-rgb: 154, 108, 244; - --ionic-color-violet-700: #7c20f2; - --ionic-color-violet-700-rgb: 124, 32, 242; - --ionic-color-violet-800: #711ddd; - --ionic-color-violet-800-rgb: 113, 29, 221; - --ionic-color-violet-900: #651ac5; - --ionic-color-violet-900-rgb: 101, 26, 197; - --ionic-color-violet-1000: #5817ab; - --ionic-color-violet-1000-rgb: 88, 23, 171; - --ionic-color-violet-1100: #48128c; - --ionic-color-violet-1100-rgb: 72, 18, 140; - --ionic-color-violet-1200: #330d63; - --ionic-color-violet-1200-rgb: 51, 13, 99; - --ionic-color-purple-100: #f9f3fe; - --ionic-color-purple-100-rgb: 249, 243, 254; - --ionic-color-purple-200: #f5eafd; - --ionic-color-purple-200-rgb: 245, 234, 253; - --ionic-color-purple-300: #e9d3fa; - --ionic-color-purple-300-rgb: 233, 211, 250; - --ionic-color-purple-400: #deb9f8; - --ionic-color-purple-400-rgb: 222, 185, 248; - --ionic-color-purple-500: #d29bf6; - --ionic-color-purple-500-rgb: 210, 155, 246; - --ionic-color-purple-600: #c575f3; - --ionic-color-purple-600-rgb: 197, 117, 243; - --ionic-color-purple-700: #b73cf1; - --ionic-color-purple-700-rgb: 183, 60, 241; - --ionic-color-purple-800: #a737dc; - --ionic-color-purple-800-rgb: 167, 55, 220; - --ionic-color-purple-900: #9531c5; - --ionic-color-purple-900-rgb: 149, 49, 197; - --ionic-color-purple-1000: #812aaa; - --ionic-color-purple-1000-rgb: 129, 42, 170; - --ionic-color-purple-1100: #6a238b; - --ionic-color-purple-1100-rgb: 106, 35, 139; - --ionic-color-purple-1200: #4b1862; - --ionic-color-purple-1200-rgb: 75, 24, 98; - --ionic-color-magenta-100: #fdf3fb; - --ionic-color-magenta-100-rgb: 253, 243, 251; - --ionic-color-magenta-200: #fcebf8; - --ionic-color-magenta-200-rgb: 252, 235, 248; - --ionic-color-magenta-300: #f9d4f1; - --ionic-color-magenta-300-rgb: 249, 212, 241; - --ionic-color-magenta-400: #f6bcea; - --ionic-color-magenta-400-rgb: 246, 188, 234; - --ionic-color-magenta-500: #f39fe3; - --ionic-color-magenta-500-rgb: 243, 159, 227; - --ionic-color-magenta-600: #f07cdb; - --ionic-color-magenta-600-rgb: 240, 124, 219; - --ionic-color-magenta-700: #ed4ad3; - --ionic-color-magenta-700-rgb: 237, 74, 211; - --ionic-color-magenta-800: #d844c1; - --ionic-color-magenta-800-rgb: 216, 68, 193; - --ionic-color-magenta-900: #c13cac; - --ionic-color-magenta-900-rgb: 193, 60, 172; - --ionic-color-magenta-1000: #a83495; - --ionic-color-magenta-1000-rgb: 168, 52, 149; - --ionic-color-magenta-1100: #892b7a; - --ionic-color-magenta-1100-rgb: 137, 43, 122; - --ionic-color-magenta-1200: #611e56; - --ionic-color-magenta-1200-rgb: 97, 30, 86; - --ionic-color-pink-100: #fef3f5; - --ionic-color-pink-100-rgb: 254, 243, 245; - --ionic-color-pink-200: #fdeaee; - --ionic-color-pink-200-rgb: 253, 234, 238; - --ionic-color-pink-300: #fad3dc; - --ionic-color-pink-300-rgb: 250, 211, 220; - --ionic-color-pink-400: #f8b9c9; - --ionic-color-pink-400-rgb: 248, 185, 201; - --ionic-color-pink-500: #f69bb3; - --ionic-color-pink-500-rgb: 246, 155, 179; - --ionic-color-pink-600: #f3759a; - --ionic-color-pink-600-rgb: 243, 117, 154; - --ionic-color-pink-700: #f13b7d; - --ionic-color-pink-700-rgb: 241, 59, 125; - --ionic-color-pink-800: #dc3672; - --ionic-color-pink-800-rgb: 220, 54, 114; - --ionic-color-pink-900: #c53066; - --ionic-color-pink-900-rgb: 197, 48, 102; - --ionic-color-pink-1000: #aa2a58; - --ionic-color-pink-1000-rgb: 170, 42, 88; - --ionic-color-pink-1100: #8b2248; - --ionic-color-pink-1100-rgb: 139, 34, 72; - --ionic-color-pink-1200: #621833; - --ionic-color-pink-1200-rgb: 98, 24, 51; - --ionic-color-primary-100: #f2f4fd; - --ionic-color-primary-100-rgb: 242, 244, 253; - --ionic-color-primary-200: #e9ecfc; - --ionic-color-primary-200-rgb: 233, 236, 252; - --ionic-color-primary-300: #d0d7fa; - --ionic-color-primary-300-rgb: 208, 215, 250; - --ionic-color-primary-400: #b5c0f7; - --ionic-color-primary-400-rgb: 181, 192, 247; - --ionic-color-primary-500: #94a5f4; - --ionic-color-primary-500-rgb: 148, 165, 244; - --ionic-color-primary-600: #6986f2; - --ionic-color-primary-600-rgb: 105, 134, 242; - --ionic-color-primary-700: #105cef; - --ionic-color-primary-700-rgb: 16, 92, 239; - --ionic-color-primary-800: #0f54da; - --ionic-color-primary-800-rgb: 15, 84, 218; - --ionic-color-primary-900: #0d4bc3; - --ionic-color-primary-900-rgb: 13, 75, 195; - --ionic-color-primary-1000: #0b41a9; - --ionic-color-primary-1000-rgb: 11, 65, 169; - --ionic-color-primary-1100: #09358a; - --ionic-color-primary-1100-rgb: 9, 53, 138; - --ionic-color-primary-1200: #072561; - --ionic-color-primary-1200-rgb: 7, 37, 97; - --ionic-color-primary-base: #105cef; - --ionic-color-primary-base-rgb: 16, 92, 239; - --ionic-color-info-100: #ebf9fe; - --ionic-color-info-100-rgb: 235, 249, 254; - --ionic-color-info-200: #dcf4fd; - --ionic-color-info-200-rgb: 220, 244, 253; - --ionic-color-info-300: #b3e9fc; - --ionic-color-info-300-rgb: 179, 233, 252; - --ionic-color-info-400: #80defa; - --ionic-color-info-400-rgb: 128, 222, 250; - --ionic-color-info-500: #27d3f9; - --ionic-color-info-500-rgb: 39, 211, 249; - --ionic-color-info-600: #22bbdc; - --ionic-color-info-600-rgb: 34, 187, 220; - --ionic-color-info-700: #1ea2bf; - --ionic-color-info-700-rgb: 30, 162, 191; - --ionic-color-info-800: #1988a0; - --ionic-color-info-800-rgb: 25, 136, 160; - --ionic-color-info-900: #146d81; - --ionic-color-info-900-rgb: 20, 109, 129; - --ionic-color-info-1000: #0f5261; - --ionic-color-info-1000-rgb: 15, 82, 97; - --ionic-color-info-1100: #0a3741; - --ionic-color-info-1100-rgb: 10, 55, 65; - --ionic-color-info-1200: #051c21; - --ionic-color-info-1200-rgb: 5, 28, 33; - --ionic-color-info-base: #1ea2bf; - --ionic-color-info-base-rgb: 30, 162, 191; - --ionic-color-warning-100: #fff1ea; - --ionic-color-warning-100-rgb: 255, 241, 234; - --ionic-color-warning-200: #ffe8db; - --ionic-color-warning-200-rgb: 255, 232, 219; - --ionic-color-warning-300: #ffcfb1; - --ionic-color-warning-300-rgb: 255, 207, 177; - --ionic-color-warning-400: #ffb37b; - --ionic-color-warning-400-rgb: 255, 179, 123; - --ionic-color-warning-500: #ff9400; - --ionic-color-warning-500-rgb: 255, 148, 0; - --ionic-color-warning-600: #e18300; - --ionic-color-warning-600-rgb: 225, 131, 0; - --ionic-color-warning-700: #c37100; - --ionic-color-warning-700-rgb: 195, 113, 0; - --ionic-color-warning-800: #a45f00; - --ionic-color-warning-800-rgb: 164, 95, 0; - --ionic-color-warning-900: #844d00; - --ionic-color-warning-900-rgb: 132, 77, 0; - --ionic-color-warning-1000: #633a00; - --ionic-color-warning-1000-rgb: 99, 58, 0; - --ionic-color-warning-1100: #422700; - --ionic-color-warning-1100-rgb: 66, 39, 0; - --ionic-color-warning-1200: #221400; - --ionic-color-warning-1200-rgb: 34, 20, 0; - --ionic-color-warning-base: #c37100; - --ionic-color-warning-base-rgb: 195, 113, 0; - --ionic-color-danger-100: #feeded; - --ionic-color-danger-100-rgb: 254, 237, 237; - --ionic-color-danger-200: #fde1e1; - --ionic-color-danger-200-rgb: 253, 225, 225; - --ionic-color-danger-300: #fcc1c1; - --ionic-color-danger-300-rgb: 252, 193, 193; - --ionic-color-danger-400: #faa1a1; - --ionic-color-danger-400-rgb: 250, 161, 161; - --ionic-color-danger-500: #f97d7d; - --ionic-color-danger-500-rgb: 249, 125, 125; - --ionic-color-danger-600: #f85151; - --ionic-color-danger-600-rgb: 248, 81, 81; - --ionic-color-danger-700: #e52929; - --ionic-color-danger-700-rgb: 229, 41, 41; - --ionic-color-danger-800: #bf2222; - --ionic-color-danger-800-rgb: 191, 34, 34; - --ionic-color-danger-900: #991b1b; - --ionic-color-danger-900-rgb: 153, 27, 27; - --ionic-color-danger-1000: #761515; - --ionic-color-danger-1000-rgb: 118, 21, 21; - --ionic-color-danger-1100: #540f0f; - --ionic-color-danger-1100-rgb: 84, 15, 15; - --ionic-color-danger-1200: #330909; - --ionic-color-danger-1200-rgb: 51, 9, 9; - --ionic-color-danger-base: #e52929; - --ionic-color-danger-base-rgb: 229, 41, 41; - --ionic-color-success-100: #ebf9ec; - --ionic-color-success-100-rgb: 235, 249, 236; - --ionic-color-success-200: #dcf5de; - --ionic-color-success-200-rgb: 220, 245, 222; - --ionic-color-success-300: #b3ebb7; - --ionic-color-success-300-rgb: 179, 235, 183; - --ionic-color-success-400: #7fe089; - --ionic-color-success-400-rgb: 127, 224, 137; - --ionic-color-success-500: #23d643; - --ionic-color-success-500-rgb: 35, 214, 67; - --ionic-color-success-600: #1fbd3b; - --ionic-color-success-600-rgb: 31, 189, 59; - --ionic-color-success-700: #1ba433; - --ionic-color-success-700-rgb: 27, 164, 51; - --ionic-color-success-800: #178a2b; - --ionic-color-success-800-rgb: 23, 138, 43; - --ionic-color-success-900: #126f23; - --ionic-color-success-900-rgb: 18, 111, 35; - --ionic-color-success-1000: #0e531a; - --ionic-color-success-1000-rgb: 14, 83, 26; - --ionic-color-success-1100: #093811; - --ionic-color-success-1100-rgb: 9, 56, 17; - --ionic-color-success-1200: #051d09; - --ionic-color-success-1200-rgb: 5, 29, 9; - --ionic-color-success-base: #1ba433; - --ionic-color-success-base-rgb: 27, 164, 51; - --ionic-z-index-0: 0; - --ionic-z-index-1: 100; - --ionic-z-index-2: 200; - --ionic-z-index-3: 300; - --ionic-z-index-4: 400; - --ionic-z-index-500: 500; - --ionic-z-index-bottom: -99999; - --ionic-z-index-top: 99999; - --ionic-scale-0: 0px; - --ionic-scale-100: 4px; - --ionic-scale-150: 6px; - --ionic-scale-200: 8px; - --ionic-scale-250: 10px; - --ionic-scale-300: 12px; - --ionic-scale-400: 16px; - --ionic-scale-500: 20px; - --ionic-scale-600: 24px; - --ionic-scale-700: 28px; - --ionic-scale-800: 32px; - --ionic-scale-850: 34px; - --ionic-scale-900: 36px; - --ionic-scale-1000: 40px; - --ionic-scale-1100: 44px; - --ionic-scale-1200: 48px; - --ionic-scale-1400: 56px; - --ionic-scale-1600: 64px; - --ionic-scale-1800: 72px; - --ionic-scale-2000: 80px; - --ionic-scale-2400: 96px; - --ionic-scale-2800: 112px; - --ionic-scale-3200: 128px; - --ionic-scale-3400: 136px; - --ionic-scale-3600: 144px; - --ionic-scale-4000: 160px; - --ionic-scale-5000: 200px; - --ionic-scale-6200: 248px; - --ionic-scale-7400: 296px; - --ionic-scale-9000: 360px; - --ionic-scale-025: 1px; - --ionic-scale-050: 2px; - --ionic-scale-075: 3px; - --ionic-font-family: "Inter", sans-serif; - --ionic-state-focus-0: none; - --ionic-state-focus-1: #9ec4fd; - --ionic-state-focus-1-rgb: 158, 196, 253; - --ionic-state-focus-2: #ffafaf; - --ionic-state-focus-2-rgb: 255, 175, 175; - --ionic-state-disabled: rgba(255, 255, 255, 0.6); - --ionic-state-hover: rgba(36, 36, 36, 0.04); - --ionic-state-pressed: rgba(36, 36, 36, 0.08); -} diff --git a/core/src/foundations/ionic.utility.scss b/core/src/foundations/ionic.utility.scss index 3d373c1447..12d14adde5 100644 --- a/core/src/foundations/ionic.utility.scss +++ b/core/src/foundations/ionic.utility.scss @@ -1,2559 +1,3652 @@ -/** - * This is an auto-generated file, please do not change it directly. - * Ionic Design System - */ - +/* +Do not edit directly, this file was auto-generated. +*/ @import "./ionic.vars"; @import "../themes/mixins"; -.ionic-elevation-100 { - box-shadow: $ionic-elevation-100; -} -.ionic-elevation-200 { - box-shadow: $ionic-elevation-200; -} -.ionic-elevation-300 { - box-shadow: $ionic-elevation-300; -} -.ionic-elevation-400 { - box-shadow: $ionic-elevation-400; -} -.ionic-elevation-500 { - box-shadow: $ionic-elevation-500; -} -.ionic-elevation-600 { - box-shadow: $ionic-elevation-600; -} -.ionic-elevation-700 { - box-shadow: $ionic-elevation-700; -} -.ionic-elevation-800 { - box-shadow: $ionic-elevation-800; -} -.ionic-font-size-275 { - font-size: $ionic-font-size-275; -} -.ionic-font-size-300 { - font-size: $ionic-font-size-300; -} -.ionic-font-size-350 { - font-size: $ionic-font-size-350; -} -.ionic-font-size-400 { - font-size: $ionic-font-size-400; -} -.ionic-font-size-450 { - font-size: $ionic-font-size-450; -} -.ionic-font-size-500 { - font-size: $ionic-font-size-500; -} -.ionic-font-size-550 { - font-size: $ionic-font-size-550; -} -.ionic-font-size-600 { - font-size: $ionic-font-size-600; -} -.ionic-font-size-650 { - font-size: $ionic-font-size-650; -} -.ionic-font-size-700 { - font-size: $ionic-font-size-700; -} -.ionic-font-size-800 { - font-size: $ionic-font-size-800; -} -.ionic-font-size-900 { - font-size: $ionic-font-size-900; -} -.ionic-font-weight-thin { - font-weight: $ionic-font-weight-thin; -} -.ionic-font-weight-extra-light { - font-weight: $ionic-font-weight-extra-light; -} -.ionic-font-weight-light { - font-weight: $ionic-font-weight-light; -} -.ionic-font-weight-regular { - font-weight: $ionic-font-weight-regular; -} -.ionic-font-weight-medium { - font-weight: $ionic-font-weight-medium; -} -.ionic-font-weight-semi-bold { - font-weight: $ionic-font-weight-semi-bold; -} -.ionic-font-weight-bold { - font-weight: $ionic-font-weight-bold; -} -.ionic-font-weight-extra-bold { - font-weight: $ionic-font-weight-extra-bold; -} -.ionic-font-weight-black { - font-weight: $ionic-font-weight-black; -} -.ionic-letter-spacing-0 { - letter-spacing: $ionic-letter-spacing-0; -} -.ionic-letter-spacing-1 { - letter-spacing: $ionic-letter-spacing-1; -} -.ionic-letter-spacing-2 { - letter-spacing: $ionic-letter-spacing-2; -} -.ionic-line-height-300 { - line-height: $ionic-line-height-300; -} -.ionic-line-height-400 { - line-height: $ionic-line-height-400; -} -.ionic-line-height-500 { - line-height: $ionic-line-height-500; -} -.ionic-line-height-600 { - line-height: $ionic-line-height-600; -} -.ionic-line-height-700 { - line-height: $ionic-line-height-700; -} -.ionic-line-height-800 { - line-height: $ionic-line-height-800; -} -.ionic-line-height-900 { - line-height: $ionic-line-height-900; -} -.ionic-line-height-1100 { - line-height: $ionic-line-height-1100; -} -.ionic-line-height-1200 { - line-height: $ionic-line-height-1200; -} -.ionic-line-height-full { - line-height: $ionic-line-height-full; -} - -.ionic-margin-space-0 { - --margin-start: #{$ionic-space-0}; - --margin-end: #{$ionic-space-0}; - --margin-top: #{$ionic-space-0}; - --margin-bottom: #{$ionic-space-0}; - - @include margin($ionic-space-0); -} - -.ionic-padding-space-0 { - --padding-start: #{$ionic-space-0}; - --padding-end: #{$ionic-space-0}; - --padding-top: #{$ionic-space-0}; - --padding-bottom: #{$ionic-space-0}; - - @include padding($ionic-space-0); -} - -.ionic-margin-space-100 { - --margin-start: #{$ionic-space-100}; - --margin-end: #{$ionic-space-100}; - --margin-top: #{$ionic-space-100}; - --margin-bottom: #{$ionic-space-100}; - - @include margin($ionic-space-100); -} - -.ionic-padding-space-100 { - --padding-start: #{$ionic-space-100}; - --padding-end: #{$ionic-space-100}; - --padding-top: #{$ionic-space-100}; - --padding-bottom: #{$ionic-space-100}; - - @include padding($ionic-space-100); -} - -.ionic-margin-space-150 { - --margin-start: #{$ionic-space-150}; - --margin-end: #{$ionic-space-150}; - --margin-top: #{$ionic-space-150}; - --margin-bottom: #{$ionic-space-150}; - - @include margin($ionic-space-150); -} - -.ionic-padding-space-150 { - --padding-start: #{$ionic-space-150}; - --padding-end: #{$ionic-space-150}; - --padding-top: #{$ionic-space-150}; - --padding-bottom: #{$ionic-space-150}; - - @include padding($ionic-space-150); -} - -.ionic-margin-space-200 { - --margin-start: #{$ionic-space-200}; - --margin-end: #{$ionic-space-200}; - --margin-top: #{$ionic-space-200}; - --margin-bottom: #{$ionic-space-200}; - - @include margin($ionic-space-200); -} - -.ionic-padding-space-200 { - --padding-start: #{$ionic-space-200}; - --padding-end: #{$ionic-space-200}; - --padding-top: #{$ionic-space-200}; - --padding-bottom: #{$ionic-space-200}; - - @include padding($ionic-space-200); -} - -.ionic-margin-space-250 { - --margin-start: #{$ionic-space-250}; - --margin-end: #{$ionic-space-250}; - --margin-top: #{$ionic-space-250}; - --margin-bottom: #{$ionic-space-250}; - - @include margin($ionic-space-250); -} - -.ionic-padding-space-250 { - --padding-start: #{$ionic-space-250}; - --padding-end: #{$ionic-space-250}; - --padding-top: #{$ionic-space-250}; - --padding-bottom: #{$ionic-space-250}; - - @include padding($ionic-space-250); -} - -.ionic-margin-space-300 { - --margin-start: #{$ionic-space-300}; - --margin-end: #{$ionic-space-300}; - --margin-top: #{$ionic-space-300}; - --margin-bottom: #{$ionic-space-300}; - - @include margin($ionic-space-300); -} - -.ionic-padding-space-300 { - --padding-start: #{$ionic-space-300}; - --padding-end: #{$ionic-space-300}; - --padding-top: #{$ionic-space-300}; - --padding-bottom: #{$ionic-space-300}; - - @include padding($ionic-space-300); -} - -.ionic-margin-space-400 { - --margin-start: #{$ionic-space-400}; - --margin-end: #{$ionic-space-400}; - --margin-top: #{$ionic-space-400}; - --margin-bottom: #{$ionic-space-400}; - - @include margin($ionic-space-400); -} - -.ionic-padding-space-400 { - --padding-start: #{$ionic-space-400}; - --padding-end: #{$ionic-space-400}; - --padding-top: #{$ionic-space-400}; - --padding-bottom: #{$ionic-space-400}; - - @include padding($ionic-space-400); -} - -.ionic-margin-space-500 { - --margin-start: #{$ionic-space-500}; - --margin-end: #{$ionic-space-500}; - --margin-top: #{$ionic-space-500}; - --margin-bottom: #{$ionic-space-500}; - - @include margin($ionic-space-500); -} - -.ionic-padding-space-500 { - --padding-start: #{$ionic-space-500}; - --padding-end: #{$ionic-space-500}; - --padding-top: #{$ionic-space-500}; - --padding-bottom: #{$ionic-space-500}; - - @include padding($ionic-space-500); -} - -.ionic-margin-space-600 { - --margin-start: #{$ionic-space-600}; - --margin-end: #{$ionic-space-600}; - --margin-top: #{$ionic-space-600}; - --margin-bottom: #{$ionic-space-600}; - - @include margin($ionic-space-600); -} - -.ionic-padding-space-600 { - --padding-start: #{$ionic-space-600}; - --padding-end: #{$ionic-space-600}; - --padding-top: #{$ionic-space-600}; - --padding-bottom: #{$ionic-space-600}; - - @include padding($ionic-space-600); -} - -.ionic-margin-space-700 { - --margin-start: #{$ionic-space-700}; - --margin-end: #{$ionic-space-700}; - --margin-top: #{$ionic-space-700}; - --margin-bottom: #{$ionic-space-700}; - - @include margin($ionic-space-700); -} - -.ionic-padding-space-700 { - --padding-start: #{$ionic-space-700}; - --padding-end: #{$ionic-space-700}; - --padding-top: #{$ionic-space-700}; - --padding-bottom: #{$ionic-space-700}; - - @include padding($ionic-space-700); -} - -.ionic-margin-space-800 { - --margin-start: #{$ionic-space-800}; - --margin-end: #{$ionic-space-800}; - --margin-top: #{$ionic-space-800}; - --margin-bottom: #{$ionic-space-800}; - - @include margin($ionic-space-800); -} - -.ionic-padding-space-800 { - --padding-start: #{$ionic-space-800}; - --padding-end: #{$ionic-space-800}; - --padding-top: #{$ionic-space-800}; - --padding-bottom: #{$ionic-space-800}; - - @include padding($ionic-space-800); -} - -.ionic-margin-space-850 { - --margin-start: #{$ionic-space-850}; - --margin-end: #{$ionic-space-850}; - --margin-top: #{$ionic-space-850}; - --margin-bottom: #{$ionic-space-850}; - - @include margin($ionic-space-850); -} - -.ionic-padding-space-850 { - --padding-start: #{$ionic-space-850}; - --padding-end: #{$ionic-space-850}; - --padding-top: #{$ionic-space-850}; - --padding-bottom: #{$ionic-space-850}; - - @include padding($ionic-space-850); -} - -.ionic-margin-space-900 { - --margin-start: #{$ionic-space-900}; - --margin-end: #{$ionic-space-900}; - --margin-top: #{$ionic-space-900}; - --margin-bottom: #{$ionic-space-900}; - - @include margin($ionic-space-900); -} - -.ionic-padding-space-900 { - --padding-start: #{$ionic-space-900}; - --padding-end: #{$ionic-space-900}; - --padding-top: #{$ionic-space-900}; - --padding-bottom: #{$ionic-space-900}; - - @include padding($ionic-space-900); -} - -.ionic-margin-space-1000 { - --margin-start: #{$ionic-space-1000}; - --margin-end: #{$ionic-space-1000}; - --margin-top: #{$ionic-space-1000}; - --margin-bottom: #{$ionic-space-1000}; - - @include margin($ionic-space-1000); -} - -.ionic-padding-space-1000 { - --padding-start: #{$ionic-space-1000}; - --padding-end: #{$ionic-space-1000}; - --padding-top: #{$ionic-space-1000}; - --padding-bottom: #{$ionic-space-1000}; - - @include padding($ionic-space-1000); -} - -.ionic-margin-space-1200 { - --margin-start: #{$ionic-space-1200}; - --margin-end: #{$ionic-space-1200}; - --margin-top: #{$ionic-space-1200}; - --margin-bottom: #{$ionic-space-1200}; - - @include margin($ionic-space-1200); -} - -.ionic-padding-space-1200 { - --padding-start: #{$ionic-space-1200}; - --padding-end: #{$ionic-space-1200}; - --padding-top: #{$ionic-space-1200}; - --padding-bottom: #{$ionic-space-1200}; - - @include padding($ionic-space-1200); -} - -.ionic-margin-space-050 { - --margin-start: #{$ionic-space-050}; - --margin-end: #{$ionic-space-050}; - --margin-top: #{$ionic-space-050}; - --margin-bottom: #{$ionic-space-050}; - - @include margin($ionic-space-050); -} - -.ionic-padding-space-050 { - --padding-start: #{$ionic-space-050}; - --padding-end: #{$ionic-space-050}; - --padding-top: #{$ionic-space-050}; - --padding-bottom: #{$ionic-space-050}; - - @include padding($ionic-space-050); -} -.ionic-border-radius-0 { - border-radius: $ionic-border-radius-0; -} -.ionic-border-radius-100 { - border-radius: $ionic-border-radius-100; -} -.ionic-border-radius-200 { - border-radius: $ionic-border-radius-200; -} -.ionic-border-radius-300 { - border-radius: $ionic-border-radius-300; -} -.ionic-border-radius-400 { - border-radius: $ionic-border-radius-400; -} -.ionic-border-radius-500 { - border-radius: $ionic-border-radius-500; -} -.ionic-border-radius-800 { - border-radius: $ionic-border-radius-800; -} -.ionic-border-radius-1000 { - border-radius: $ionic-border-radius-1000; -} -.ionic-border-radius-050 { - border-radius: $ionic-border-radius-050; -} -.ionic-border-radius-full { - border-radius: $ionic-border-radius-full; -} -.ionic-border-size-0 { - border-width: $ionic-border-size-0; -} -.ionic-border-size-025 { - border-width: $ionic-border-size-025; -} -.ionic-border-size-050 { - border-width: $ionic-border-size-050; -} -.ionic-border-size-075 { - border-width: $ionic-border-size-075; -} -.ionic-border-style-none { - border-style: $ionic-border-style-none; -} -.ionic-border-style-solid { - border-style: $ionic-border-style-solid; -} -.ionic-border-style-dashed { - border-style: $ionic-border-style-dashed; -} -.ionic-border-style-dotted { - border-style: $ionic-border-style-dotted; -} -.ionic-color-base-white { - color: $ionic-color-base-white; -} -.ionic-background-color-base-white { - background-color: $ionic-color-base-white; -} -.ionic-color-base-black { - color: $ionic-color-base-black; -} -.ionic-background-color-base-black { - background-color: $ionic-color-base-black; -} -.ionic-color-neutral-100 { - color: $ionic-color-neutral-100; -} -.ionic-background-color-neutral-100 { - background-color: $ionic-color-neutral-100; -} -.ionic-color-neutral-200 { - color: $ionic-color-neutral-200; -} -.ionic-background-color-neutral-200 { - background-color: $ionic-color-neutral-200; -} -.ionic-color-neutral-300 { - color: $ionic-color-neutral-300; -} -.ionic-background-color-neutral-300 { - background-color: $ionic-color-neutral-300; -} -.ionic-color-neutral-400 { - color: $ionic-color-neutral-400; -} -.ionic-background-color-neutral-400 { - background-color: $ionic-color-neutral-400; -} -.ionic-color-neutral-500 { - color: $ionic-color-neutral-500; -} -.ionic-background-color-neutral-500 { - background-color: $ionic-color-neutral-500; -} -.ionic-color-neutral-600 { - color: $ionic-color-neutral-600; -} -.ionic-background-color-neutral-600 { - background-color: $ionic-color-neutral-600; -} -.ionic-color-neutral-700 { - color: $ionic-color-neutral-700; -} -.ionic-background-color-neutral-700 { - background-color: $ionic-color-neutral-700; -} -.ionic-color-neutral-800 { - color: $ionic-color-neutral-800; -} -.ionic-background-color-neutral-800 { - background-color: $ionic-color-neutral-800; -} -.ionic-color-neutral-900 { - color: $ionic-color-neutral-900; -} -.ionic-background-color-neutral-900 { - background-color: $ionic-color-neutral-900; -} -.ionic-color-neutral-1000 { - color: $ionic-color-neutral-1000; -} -.ionic-background-color-neutral-1000 { - background-color: $ionic-color-neutral-1000; -} -.ionic-color-neutral-1100 { - color: $ionic-color-neutral-1100; -} -.ionic-background-color-neutral-1100 { - background-color: $ionic-color-neutral-1100; -} -.ionic-color-neutral-1200 { - color: $ionic-color-neutral-1200; -} -.ionic-background-color-neutral-1200 { - background-color: $ionic-color-neutral-1200; -} -.ionic-color-red-100 { - color: $ionic-color-red-100; -} -.ionic-background-color-red-100 { - background-color: $ionic-color-red-100; -} -.ionic-color-red-200 { - color: $ionic-color-red-200; -} -.ionic-background-color-red-200 { - background-color: $ionic-color-red-200; -} -.ionic-color-red-300 { - color: $ionic-color-red-300; -} -.ionic-background-color-red-300 { - background-color: $ionic-color-red-300; -} -.ionic-color-red-400 { - color: $ionic-color-red-400; -} -.ionic-background-color-red-400 { - background-color: $ionic-color-red-400; -} -.ionic-color-red-500 { - color: $ionic-color-red-500; -} -.ionic-background-color-red-500 { - background-color: $ionic-color-red-500; -} -.ionic-color-red-600 { - color: $ionic-color-red-600; -} -.ionic-background-color-red-600 { - background-color: $ionic-color-red-600; -} -.ionic-color-red-700 { - color: $ionic-color-red-700; -} -.ionic-background-color-red-700 { - background-color: $ionic-color-red-700; -} -.ionic-color-red-800 { - color: $ionic-color-red-800; -} -.ionic-background-color-red-800 { - background-color: $ionic-color-red-800; -} -.ionic-color-red-900 { - color: $ionic-color-red-900; -} -.ionic-background-color-red-900 { - background-color: $ionic-color-red-900; -} -.ionic-color-red-1000 { - color: $ionic-color-red-1000; -} -.ionic-background-color-red-1000 { - background-color: $ionic-color-red-1000; -} -.ionic-color-red-1100 { - color: $ionic-color-red-1100; -} -.ionic-background-color-red-1100 { - background-color: $ionic-color-red-1100; -} -.ionic-color-red-1200 { - color: $ionic-color-red-1200; -} -.ionic-background-color-red-1200 { - background-color: $ionic-color-red-1200; -} -.ionic-color-pumpkin-100 { - color: $ionic-color-pumpkin-100; -} -.ionic-background-color-pumpkin-100 { - background-color: $ionic-color-pumpkin-100; -} -.ionic-color-pumpkin-200 { - color: $ionic-color-pumpkin-200; -} -.ionic-background-color-pumpkin-200 { - background-color: $ionic-color-pumpkin-200; -} -.ionic-color-pumpkin-300 { - color: $ionic-color-pumpkin-300; -} -.ionic-background-color-pumpkin-300 { - background-color: $ionic-color-pumpkin-300; -} -.ionic-color-pumpkin-400 { - color: $ionic-color-pumpkin-400; -} -.ionic-background-color-pumpkin-400 { - background-color: $ionic-color-pumpkin-400; -} -.ionic-color-pumpkin-500 { - color: $ionic-color-pumpkin-500; -} -.ionic-background-color-pumpkin-500 { - background-color: $ionic-color-pumpkin-500; -} -.ionic-color-pumpkin-600 { - color: $ionic-color-pumpkin-600; -} -.ionic-background-color-pumpkin-600 { - background-color: $ionic-color-pumpkin-600; -} -.ionic-color-pumpkin-700 { - color: $ionic-color-pumpkin-700; -} -.ionic-background-color-pumpkin-700 { - background-color: $ionic-color-pumpkin-700; -} -.ionic-color-pumpkin-800 { - color: $ionic-color-pumpkin-800; -} -.ionic-background-color-pumpkin-800 { - background-color: $ionic-color-pumpkin-800; -} -.ionic-color-pumpkin-900 { - color: $ionic-color-pumpkin-900; -} -.ionic-background-color-pumpkin-900 { - background-color: $ionic-color-pumpkin-900; -} -.ionic-color-pumpkin-1000 { - color: $ionic-color-pumpkin-1000; -} -.ionic-background-color-pumpkin-1000 { - background-color: $ionic-color-pumpkin-1000; -} -.ionic-color-pumpkin-1100 { - color: $ionic-color-pumpkin-1100; -} -.ionic-background-color-pumpkin-1100 { - background-color: $ionic-color-pumpkin-1100; -} -.ionic-color-pumpkin-1200 { - color: $ionic-color-pumpkin-1200; -} -.ionic-background-color-pumpkin-1200 { - background-color: $ionic-color-pumpkin-1200; -} -.ionic-color-orange-100 { - color: $ionic-color-orange-100; -} -.ionic-background-color-orange-100 { - background-color: $ionic-color-orange-100; -} -.ionic-color-orange-200 { - color: $ionic-color-orange-200; -} -.ionic-background-color-orange-200 { - background-color: $ionic-color-orange-200; -} -.ionic-color-orange-300 { - color: $ionic-color-orange-300; -} -.ionic-background-color-orange-300 { - background-color: $ionic-color-orange-300; -} -.ionic-color-orange-400 { - color: $ionic-color-orange-400; -} -.ionic-background-color-orange-400 { - background-color: $ionic-color-orange-400; -} -.ionic-color-orange-500 { - color: $ionic-color-orange-500; -} -.ionic-background-color-orange-500 { - background-color: $ionic-color-orange-500; -} -.ionic-color-orange-600 { - color: $ionic-color-orange-600; -} -.ionic-background-color-orange-600 { - background-color: $ionic-color-orange-600; -} -.ionic-color-orange-700 { - color: $ionic-color-orange-700; -} -.ionic-background-color-orange-700 { - background-color: $ionic-color-orange-700; -} -.ionic-color-orange-800 { - color: $ionic-color-orange-800; -} -.ionic-background-color-orange-800 { - background-color: $ionic-color-orange-800; -} -.ionic-color-orange-900 { - color: $ionic-color-orange-900; -} -.ionic-background-color-orange-900 { - background-color: $ionic-color-orange-900; -} -.ionic-color-orange-1000 { - color: $ionic-color-orange-1000; -} -.ionic-background-color-orange-1000 { - background-color: $ionic-color-orange-1000; -} -.ionic-color-orange-1100 { - color: $ionic-color-orange-1100; -} -.ionic-background-color-orange-1100 { - background-color: $ionic-color-orange-1100; -} -.ionic-color-orange-1200 { - color: $ionic-color-orange-1200; -} -.ionic-background-color-orange-1200 { - background-color: $ionic-color-orange-1200; -} -.ionic-color-yellow-100 { - color: $ionic-color-yellow-100; -} -.ionic-background-color-yellow-100 { - background-color: $ionic-color-yellow-100; -} -.ionic-color-yellow-200 { - color: $ionic-color-yellow-200; -} -.ionic-background-color-yellow-200 { - background-color: $ionic-color-yellow-200; -} -.ionic-color-yellow-300 { - color: $ionic-color-yellow-300; -} -.ionic-background-color-yellow-300 { - background-color: $ionic-color-yellow-300; -} -.ionic-color-yellow-400 { - color: $ionic-color-yellow-400; -} -.ionic-background-color-yellow-400 { - background-color: $ionic-color-yellow-400; -} -.ionic-color-yellow-500 { - color: $ionic-color-yellow-500; -} -.ionic-background-color-yellow-500 { - background-color: $ionic-color-yellow-500; -} -.ionic-color-yellow-600 { - color: $ionic-color-yellow-600; -} -.ionic-background-color-yellow-600 { - background-color: $ionic-color-yellow-600; -} -.ionic-color-yellow-700 { - color: $ionic-color-yellow-700; -} -.ionic-background-color-yellow-700 { - background-color: $ionic-color-yellow-700; -} -.ionic-color-yellow-800 { - color: $ionic-color-yellow-800; -} -.ionic-background-color-yellow-800 { - background-color: $ionic-color-yellow-800; -} -.ionic-color-yellow-900 { - color: $ionic-color-yellow-900; -} -.ionic-background-color-yellow-900 { - background-color: $ionic-color-yellow-900; -} -.ionic-color-yellow-1000 { - color: $ionic-color-yellow-1000; -} -.ionic-background-color-yellow-1000 { - background-color: $ionic-color-yellow-1000; -} -.ionic-color-yellow-1100 { - color: $ionic-color-yellow-1100; -} -.ionic-background-color-yellow-1100 { - background-color: $ionic-color-yellow-1100; -} -.ionic-color-yellow-1200 { - color: $ionic-color-yellow-1200; -} -.ionic-background-color-yellow-1200 { - background-color: $ionic-color-yellow-1200; -} -.ionic-color-lime-100 { - color: $ionic-color-lime-100; -} -.ionic-background-color-lime-100 { - background-color: $ionic-color-lime-100; -} -.ionic-color-lime-200 { - color: $ionic-color-lime-200; -} -.ionic-background-color-lime-200 { - background-color: $ionic-color-lime-200; -} -.ionic-color-lime-300 { - color: $ionic-color-lime-300; -} -.ionic-background-color-lime-300 { - background-color: $ionic-color-lime-300; -} -.ionic-color-lime-400 { - color: $ionic-color-lime-400; -} -.ionic-background-color-lime-400 { - background-color: $ionic-color-lime-400; -} -.ionic-color-lime-500 { - color: $ionic-color-lime-500; -} -.ionic-background-color-lime-500 { - background-color: $ionic-color-lime-500; -} -.ionic-color-lime-600 { - color: $ionic-color-lime-600; -} -.ionic-background-color-lime-600 { - background-color: $ionic-color-lime-600; -} -.ionic-color-lime-700 { - color: $ionic-color-lime-700; -} -.ionic-background-color-lime-700 { - background-color: $ionic-color-lime-700; -} -.ionic-color-lime-800 { - color: $ionic-color-lime-800; -} -.ionic-background-color-lime-800 { - background-color: $ionic-color-lime-800; -} -.ionic-color-lime-900 { - color: $ionic-color-lime-900; -} -.ionic-background-color-lime-900 { - background-color: $ionic-color-lime-900; -} -.ionic-color-lime-1000 { - color: $ionic-color-lime-1000; -} -.ionic-background-color-lime-1000 { - background-color: $ionic-color-lime-1000; -} -.ionic-color-lime-1100 { - color: $ionic-color-lime-1100; -} -.ionic-background-color-lime-1100 { - background-color: $ionic-color-lime-1100; -} -.ionic-color-lime-1200 { - color: $ionic-color-lime-1200; -} -.ionic-background-color-lime-1200 { - background-color: $ionic-color-lime-1200; -} -.ionic-color-green-100 { - color: $ionic-color-green-100; -} -.ionic-background-color-green-100 { - background-color: $ionic-color-green-100; -} -.ionic-color-green-200 { - color: $ionic-color-green-200; -} -.ionic-background-color-green-200 { - background-color: $ionic-color-green-200; -} -.ionic-color-green-300 { - color: $ionic-color-green-300; -} -.ionic-background-color-green-300 { - background-color: $ionic-color-green-300; -} -.ionic-color-green-400 { - color: $ionic-color-green-400; -} -.ionic-background-color-green-400 { - background-color: $ionic-color-green-400; -} -.ionic-color-green-500 { - color: $ionic-color-green-500; -} -.ionic-background-color-green-500 { - background-color: $ionic-color-green-500; -} -.ionic-color-green-600 { - color: $ionic-color-green-600; -} -.ionic-background-color-green-600 { - background-color: $ionic-color-green-600; -} -.ionic-color-green-700 { - color: $ionic-color-green-700; -} -.ionic-background-color-green-700 { - background-color: $ionic-color-green-700; -} -.ionic-color-green-800 { - color: $ionic-color-green-800; -} -.ionic-background-color-green-800 { - background-color: $ionic-color-green-800; -} -.ionic-color-green-900 { - color: $ionic-color-green-900; -} -.ionic-background-color-green-900 { - background-color: $ionic-color-green-900; -} -.ionic-color-green-1000 { - color: $ionic-color-green-1000; -} -.ionic-background-color-green-1000 { - background-color: $ionic-color-green-1000; -} -.ionic-color-green-1100 { - color: $ionic-color-green-1100; -} -.ionic-background-color-green-1100 { - background-color: $ionic-color-green-1100; -} -.ionic-color-green-1200 { - color: $ionic-color-green-1200; -} -.ionic-background-color-green-1200 { - background-color: $ionic-color-green-1200; -} -.ionic-color-teal-100 { - color: $ionic-color-teal-100; -} -.ionic-background-color-teal-100 { - background-color: $ionic-color-teal-100; -} -.ionic-color-teal-200 { - color: $ionic-color-teal-200; -} -.ionic-background-color-teal-200 { - background-color: $ionic-color-teal-200; -} -.ionic-color-teal-300 { - color: $ionic-color-teal-300; -} -.ionic-background-color-teal-300 { - background-color: $ionic-color-teal-300; -} -.ionic-color-teal-400 { - color: $ionic-color-teal-400; -} -.ionic-background-color-teal-400 { - background-color: $ionic-color-teal-400; -} -.ionic-color-teal-500 { - color: $ionic-color-teal-500; -} -.ionic-background-color-teal-500 { - background-color: $ionic-color-teal-500; -} -.ionic-color-teal-600 { - color: $ionic-color-teal-600; -} -.ionic-background-color-teal-600 { - background-color: $ionic-color-teal-600; -} -.ionic-color-teal-700 { - color: $ionic-color-teal-700; -} -.ionic-background-color-teal-700 { - background-color: $ionic-color-teal-700; -} -.ionic-color-teal-800 { - color: $ionic-color-teal-800; -} -.ionic-background-color-teal-800 { - background-color: $ionic-color-teal-800; -} -.ionic-color-teal-900 { - color: $ionic-color-teal-900; -} -.ionic-background-color-teal-900 { - background-color: $ionic-color-teal-900; -} -.ionic-color-teal-1000 { - color: $ionic-color-teal-1000; -} -.ionic-background-color-teal-1000 { - background-color: $ionic-color-teal-1000; -} -.ionic-color-teal-1100 { - color: $ionic-color-teal-1100; -} -.ionic-background-color-teal-1100 { - background-color: $ionic-color-teal-1100; -} -.ionic-color-teal-1200 { - color: $ionic-color-teal-1200; -} -.ionic-background-color-teal-1200 { - background-color: $ionic-color-teal-1200; -} -.ionic-color-aqua-100 { - color: $ionic-color-aqua-100; -} -.ionic-background-color-aqua-100 { - background-color: $ionic-color-aqua-100; -} -.ionic-color-aqua-200 { - color: $ionic-color-aqua-200; -} -.ionic-background-color-aqua-200 { - background-color: $ionic-color-aqua-200; -} -.ionic-color-aqua-300 { - color: $ionic-color-aqua-300; -} -.ionic-background-color-aqua-300 { - background-color: $ionic-color-aqua-300; -} -.ionic-color-aqua-400 { - color: $ionic-color-aqua-400; -} -.ionic-background-color-aqua-400 { - background-color: $ionic-color-aqua-400; -} -.ionic-color-aqua-500 { - color: $ionic-color-aqua-500; -} -.ionic-background-color-aqua-500 { - background-color: $ionic-color-aqua-500; -} -.ionic-color-aqua-600 { - color: $ionic-color-aqua-600; -} -.ionic-background-color-aqua-600 { - background-color: $ionic-color-aqua-600; -} -.ionic-color-aqua-700 { - color: $ionic-color-aqua-700; -} -.ionic-background-color-aqua-700 { - background-color: $ionic-color-aqua-700; -} -.ionic-color-aqua-800 { - color: $ionic-color-aqua-800; -} -.ionic-background-color-aqua-800 { - background-color: $ionic-color-aqua-800; -} -.ionic-color-aqua-900 { - color: $ionic-color-aqua-900; -} -.ionic-background-color-aqua-900 { - background-color: $ionic-color-aqua-900; -} -.ionic-color-aqua-1000 { - color: $ionic-color-aqua-1000; -} -.ionic-background-color-aqua-1000 { - background-color: $ionic-color-aqua-1000; -} -.ionic-color-aqua-1100 { - color: $ionic-color-aqua-1100; -} -.ionic-background-color-aqua-1100 { - background-color: $ionic-color-aqua-1100; -} -.ionic-color-aqua-1200 { - color: $ionic-color-aqua-1200; -} -.ionic-background-color-aqua-1200 { - background-color: $ionic-color-aqua-1200; -} -.ionic-color-blue-100 { - color: $ionic-color-blue-100; -} -.ionic-background-color-blue-100 { - background-color: $ionic-color-blue-100; -} -.ionic-color-blue-200 { - color: $ionic-color-blue-200; -} -.ionic-background-color-blue-200 { - background-color: $ionic-color-blue-200; -} -.ionic-color-blue-300 { - color: $ionic-color-blue-300; -} -.ionic-background-color-blue-300 { - background-color: $ionic-color-blue-300; -} -.ionic-color-blue-400 { - color: $ionic-color-blue-400; -} -.ionic-background-color-blue-400 { - background-color: $ionic-color-blue-400; -} -.ionic-color-blue-500 { - color: $ionic-color-blue-500; -} -.ionic-background-color-blue-500 { - background-color: $ionic-color-blue-500; -} -.ionic-color-blue-600 { - color: $ionic-color-blue-600; -} -.ionic-background-color-blue-600 { - background-color: $ionic-color-blue-600; -} -.ionic-color-blue-700 { - color: $ionic-color-blue-700; -} -.ionic-background-color-blue-700 { - background-color: $ionic-color-blue-700; -} -.ionic-color-blue-800 { - color: $ionic-color-blue-800; -} -.ionic-background-color-blue-800 { - background-color: $ionic-color-blue-800; -} -.ionic-color-blue-900 { - color: $ionic-color-blue-900; -} -.ionic-background-color-blue-900 { - background-color: $ionic-color-blue-900; -} -.ionic-color-blue-1000 { - color: $ionic-color-blue-1000; -} -.ionic-background-color-blue-1000 { - background-color: $ionic-color-blue-1000; -} -.ionic-color-blue-1100 { - color: $ionic-color-blue-1100; -} -.ionic-background-color-blue-1100 { - background-color: $ionic-color-blue-1100; -} -.ionic-color-blue-1200 { - color: $ionic-color-blue-1200; -} -.ionic-background-color-blue-1200 { - background-color: $ionic-color-blue-1200; -} -.ionic-color-indigo-100 { - color: $ionic-color-indigo-100; -} -.ionic-background-color-indigo-100 { - background-color: $ionic-color-indigo-100; -} -.ionic-color-indigo-200 { - color: $ionic-color-indigo-200; -} -.ionic-background-color-indigo-200 { - background-color: $ionic-color-indigo-200; -} -.ionic-color-indigo-300 { - color: $ionic-color-indigo-300; -} -.ionic-background-color-indigo-300 { - background-color: $ionic-color-indigo-300; -} -.ionic-color-indigo-400 { - color: $ionic-color-indigo-400; -} -.ionic-background-color-indigo-400 { - background-color: $ionic-color-indigo-400; -} -.ionic-color-indigo-500 { - color: $ionic-color-indigo-500; -} -.ionic-background-color-indigo-500 { - background-color: $ionic-color-indigo-500; -} -.ionic-color-indigo-600 { - color: $ionic-color-indigo-600; -} -.ionic-background-color-indigo-600 { - background-color: $ionic-color-indigo-600; -} -.ionic-color-indigo-700 { - color: $ionic-color-indigo-700; -} -.ionic-background-color-indigo-700 { - background-color: $ionic-color-indigo-700; -} -.ionic-color-indigo-800 { - color: $ionic-color-indigo-800; -} -.ionic-background-color-indigo-800 { - background-color: $ionic-color-indigo-800; -} -.ionic-color-indigo-900 { - color: $ionic-color-indigo-900; -} -.ionic-background-color-indigo-900 { - background-color: $ionic-color-indigo-900; -} -.ionic-color-indigo-1000 { - color: $ionic-color-indigo-1000; -} -.ionic-background-color-indigo-1000 { - background-color: $ionic-color-indigo-1000; -} -.ionic-color-indigo-1100 { - color: $ionic-color-indigo-1100; -} -.ionic-background-color-indigo-1100 { - background-color: $ionic-color-indigo-1100; -} -.ionic-color-indigo-1200 { - color: $ionic-color-indigo-1200; -} -.ionic-background-color-indigo-1200 { - background-color: $ionic-color-indigo-1200; -} -.ionic-color-violet-100 { - color: $ionic-color-violet-100; -} -.ionic-background-color-violet-100 { - background-color: $ionic-color-violet-100; -} -.ionic-color-violet-200 { - color: $ionic-color-violet-200; -} -.ionic-background-color-violet-200 { - background-color: $ionic-color-violet-200; -} -.ionic-color-violet-300 { - color: $ionic-color-violet-300; -} -.ionic-background-color-violet-300 { - background-color: $ionic-color-violet-300; -} -.ionic-color-violet-400 { - color: $ionic-color-violet-400; -} -.ionic-background-color-violet-400 { - background-color: $ionic-color-violet-400; -} -.ionic-color-violet-500 { - color: $ionic-color-violet-500; -} -.ionic-background-color-violet-500 { - background-color: $ionic-color-violet-500; -} -.ionic-color-violet-600 { - color: $ionic-color-violet-600; -} -.ionic-background-color-violet-600 { - background-color: $ionic-color-violet-600; -} -.ionic-color-violet-700 { - color: $ionic-color-violet-700; -} -.ionic-background-color-violet-700 { - background-color: $ionic-color-violet-700; -} -.ionic-color-violet-800 { - color: $ionic-color-violet-800; -} -.ionic-background-color-violet-800 { - background-color: $ionic-color-violet-800; -} -.ionic-color-violet-900 { - color: $ionic-color-violet-900; -} -.ionic-background-color-violet-900 { - background-color: $ionic-color-violet-900; -} -.ionic-color-violet-1000 { - color: $ionic-color-violet-1000; -} -.ionic-background-color-violet-1000 { - background-color: $ionic-color-violet-1000; -} -.ionic-color-violet-1100 { - color: $ionic-color-violet-1100; -} -.ionic-background-color-violet-1100 { - background-color: $ionic-color-violet-1100; -} -.ionic-color-violet-1200 { - color: $ionic-color-violet-1200; -} -.ionic-background-color-violet-1200 { - background-color: $ionic-color-violet-1200; -} -.ionic-color-purple-100 { - color: $ionic-color-purple-100; -} -.ionic-background-color-purple-100 { - background-color: $ionic-color-purple-100; -} -.ionic-color-purple-200 { - color: $ionic-color-purple-200; -} -.ionic-background-color-purple-200 { - background-color: $ionic-color-purple-200; -} -.ionic-color-purple-300 { - color: $ionic-color-purple-300; -} -.ionic-background-color-purple-300 { - background-color: $ionic-color-purple-300; -} -.ionic-color-purple-400 { - color: $ionic-color-purple-400; -} -.ionic-background-color-purple-400 { - background-color: $ionic-color-purple-400; -} -.ionic-color-purple-500 { - color: $ionic-color-purple-500; -} -.ionic-background-color-purple-500 { - background-color: $ionic-color-purple-500; -} -.ionic-color-purple-600 { - color: $ionic-color-purple-600; -} -.ionic-background-color-purple-600 { - background-color: $ionic-color-purple-600; -} -.ionic-color-purple-700 { - color: $ionic-color-purple-700; -} -.ionic-background-color-purple-700 { - background-color: $ionic-color-purple-700; -} -.ionic-color-purple-800 { - color: $ionic-color-purple-800; -} -.ionic-background-color-purple-800 { - background-color: $ionic-color-purple-800; -} -.ionic-color-purple-900 { - color: $ionic-color-purple-900; -} -.ionic-background-color-purple-900 { - background-color: $ionic-color-purple-900; -} -.ionic-color-purple-1000 { - color: $ionic-color-purple-1000; -} -.ionic-background-color-purple-1000 { - background-color: $ionic-color-purple-1000; -} -.ionic-color-purple-1100 { - color: $ionic-color-purple-1100; -} -.ionic-background-color-purple-1100 { - background-color: $ionic-color-purple-1100; -} -.ionic-color-purple-1200 { - color: $ionic-color-purple-1200; -} -.ionic-background-color-purple-1200 { - background-color: $ionic-color-purple-1200; -} -.ionic-color-magenta-100 { - color: $ionic-color-magenta-100; -} -.ionic-background-color-magenta-100 { - background-color: $ionic-color-magenta-100; -} -.ionic-color-magenta-200 { - color: $ionic-color-magenta-200; -} -.ionic-background-color-magenta-200 { - background-color: $ionic-color-magenta-200; -} -.ionic-color-magenta-300 { - color: $ionic-color-magenta-300; -} -.ionic-background-color-magenta-300 { - background-color: $ionic-color-magenta-300; -} -.ionic-color-magenta-400 { - color: $ionic-color-magenta-400; -} -.ionic-background-color-magenta-400 { - background-color: $ionic-color-magenta-400; -} -.ionic-color-magenta-500 { - color: $ionic-color-magenta-500; -} -.ionic-background-color-magenta-500 { - background-color: $ionic-color-magenta-500; -} -.ionic-color-magenta-600 { - color: $ionic-color-magenta-600; -} -.ionic-background-color-magenta-600 { - background-color: $ionic-color-magenta-600; -} -.ionic-color-magenta-700 { - color: $ionic-color-magenta-700; -} -.ionic-background-color-magenta-700 { - background-color: $ionic-color-magenta-700; -} -.ionic-color-magenta-800 { - color: $ionic-color-magenta-800; -} -.ionic-background-color-magenta-800 { - background-color: $ionic-color-magenta-800; -} -.ionic-color-magenta-900 { - color: $ionic-color-magenta-900; -} -.ionic-background-color-magenta-900 { - background-color: $ionic-color-magenta-900; -} -.ionic-color-magenta-1000 { - color: $ionic-color-magenta-1000; -} -.ionic-background-color-magenta-1000 { - background-color: $ionic-color-magenta-1000; -} -.ionic-color-magenta-1100 { - color: $ionic-color-magenta-1100; -} -.ionic-background-color-magenta-1100 { - background-color: $ionic-color-magenta-1100; -} -.ionic-color-magenta-1200 { - color: $ionic-color-magenta-1200; -} -.ionic-background-color-magenta-1200 { - background-color: $ionic-color-magenta-1200; -} -.ionic-color-pink-100 { - color: $ionic-color-pink-100; -} -.ionic-background-color-pink-100 { - background-color: $ionic-color-pink-100; -} -.ionic-color-pink-200 { - color: $ionic-color-pink-200; -} -.ionic-background-color-pink-200 { - background-color: $ionic-color-pink-200; -} -.ionic-color-pink-300 { - color: $ionic-color-pink-300; -} -.ionic-background-color-pink-300 { - background-color: $ionic-color-pink-300; -} -.ionic-color-pink-400 { - color: $ionic-color-pink-400; -} -.ionic-background-color-pink-400 { - background-color: $ionic-color-pink-400; -} -.ionic-color-pink-500 { - color: $ionic-color-pink-500; -} -.ionic-background-color-pink-500 { - background-color: $ionic-color-pink-500; -} -.ionic-color-pink-600 { - color: $ionic-color-pink-600; -} -.ionic-background-color-pink-600 { - background-color: $ionic-color-pink-600; -} -.ionic-color-pink-700 { - color: $ionic-color-pink-700; -} -.ionic-background-color-pink-700 { - background-color: $ionic-color-pink-700; -} -.ionic-color-pink-800 { - color: $ionic-color-pink-800; -} -.ionic-background-color-pink-800 { - background-color: $ionic-color-pink-800; -} -.ionic-color-pink-900 { - color: $ionic-color-pink-900; -} -.ionic-background-color-pink-900 { - background-color: $ionic-color-pink-900; -} -.ionic-color-pink-1000 { - color: $ionic-color-pink-1000; -} -.ionic-background-color-pink-1000 { - background-color: $ionic-color-pink-1000; -} -.ionic-color-pink-1100 { - color: $ionic-color-pink-1100; -} -.ionic-background-color-pink-1100 { - background-color: $ionic-color-pink-1100; -} -.ionic-color-pink-1200 { - color: $ionic-color-pink-1200; -} -.ionic-background-color-pink-1200 { - background-color: $ionic-color-pink-1200; -} -.ionic-color-primary-100 { - color: $ionic-color-primary-100; -} -.ionic-background-color-primary-100 { - background-color: $ionic-color-primary-100; -} -.ionic-color-primary-200 { - color: $ionic-color-primary-200; -} -.ionic-background-color-primary-200 { - background-color: $ionic-color-primary-200; -} -.ionic-color-primary-300 { - color: $ionic-color-primary-300; -} -.ionic-background-color-primary-300 { - background-color: $ionic-color-primary-300; -} -.ionic-color-primary-400 { - color: $ionic-color-primary-400; -} -.ionic-background-color-primary-400 { - background-color: $ionic-color-primary-400; -} -.ionic-color-primary-500 { - color: $ionic-color-primary-500; -} -.ionic-background-color-primary-500 { - background-color: $ionic-color-primary-500; -} -.ionic-color-primary-600 { - color: $ionic-color-primary-600; -} -.ionic-background-color-primary-600 { - background-color: $ionic-color-primary-600; -} -.ionic-color-primary-700 { - color: $ionic-color-primary-700; -} -.ionic-background-color-primary-700 { - background-color: $ionic-color-primary-700; -} -.ionic-color-primary-800 { - color: $ionic-color-primary-800; -} -.ionic-background-color-primary-800 { - background-color: $ionic-color-primary-800; -} -.ionic-color-primary-900 { - color: $ionic-color-primary-900; -} -.ionic-background-color-primary-900 { - background-color: $ionic-color-primary-900; -} -.ionic-color-primary-1000 { - color: $ionic-color-primary-1000; -} -.ionic-background-color-primary-1000 { - background-color: $ionic-color-primary-1000; -} -.ionic-color-primary-1100 { - color: $ionic-color-primary-1100; -} -.ionic-background-color-primary-1100 { - background-color: $ionic-color-primary-1100; -} -.ionic-color-primary-1200 { - color: $ionic-color-primary-1200; -} -.ionic-background-color-primary-1200 { - background-color: $ionic-color-primary-1200; -} -.ionic-color-primary-base { - color: $ionic-color-primary-base; -} -.ionic-background-color-primary-base { - background-color: $ionic-color-primary-base; -} -.ionic-color-info-100 { - color: $ionic-color-info-100; -} -.ionic-background-color-info-100 { - background-color: $ionic-color-info-100; -} -.ionic-color-info-200 { - color: $ionic-color-info-200; -} -.ionic-background-color-info-200 { - background-color: $ionic-color-info-200; -} -.ionic-color-info-300 { - color: $ionic-color-info-300; -} -.ionic-background-color-info-300 { - background-color: $ionic-color-info-300; -} -.ionic-color-info-400 { - color: $ionic-color-info-400; -} -.ionic-background-color-info-400 { - background-color: $ionic-color-info-400; -} -.ionic-color-info-500 { - color: $ionic-color-info-500; -} -.ionic-background-color-info-500 { - background-color: $ionic-color-info-500; -} -.ionic-color-info-600 { - color: $ionic-color-info-600; -} -.ionic-background-color-info-600 { - background-color: $ionic-color-info-600; -} -.ionic-color-info-700 { - color: $ionic-color-info-700; -} -.ionic-background-color-info-700 { - background-color: $ionic-color-info-700; -} -.ionic-color-info-800 { - color: $ionic-color-info-800; -} -.ionic-background-color-info-800 { - background-color: $ionic-color-info-800; -} -.ionic-color-info-900 { - color: $ionic-color-info-900; -} -.ionic-background-color-info-900 { - background-color: $ionic-color-info-900; -} -.ionic-color-info-1000 { - color: $ionic-color-info-1000; -} -.ionic-background-color-info-1000 { - background-color: $ionic-color-info-1000; -} -.ionic-color-info-1100 { - color: $ionic-color-info-1100; -} -.ionic-background-color-info-1100 { - background-color: $ionic-color-info-1100; -} -.ionic-color-info-1200 { - color: $ionic-color-info-1200; -} -.ionic-background-color-info-1200 { - background-color: $ionic-color-info-1200; -} -.ionic-color-info-base { - color: $ionic-color-info-base; -} -.ionic-background-color-info-base { - background-color: $ionic-color-info-base; -} -.ionic-color-warning-100 { - color: $ionic-color-warning-100; -} -.ionic-background-color-warning-100 { - background-color: $ionic-color-warning-100; -} -.ionic-color-warning-200 { - color: $ionic-color-warning-200; -} -.ionic-background-color-warning-200 { - background-color: $ionic-color-warning-200; -} -.ionic-color-warning-300 { - color: $ionic-color-warning-300; -} -.ionic-background-color-warning-300 { - background-color: $ionic-color-warning-300; -} -.ionic-color-warning-400 { - color: $ionic-color-warning-400; -} -.ionic-background-color-warning-400 { - background-color: $ionic-color-warning-400; -} -.ionic-color-warning-500 { - color: $ionic-color-warning-500; -} -.ionic-background-color-warning-500 { - background-color: $ionic-color-warning-500; -} -.ionic-color-warning-600 { - color: $ionic-color-warning-600; -} -.ionic-background-color-warning-600 { - background-color: $ionic-color-warning-600; -} -.ionic-color-warning-700 { - color: $ionic-color-warning-700; -} -.ionic-background-color-warning-700 { - background-color: $ionic-color-warning-700; -} -.ionic-color-warning-800 { - color: $ionic-color-warning-800; -} -.ionic-background-color-warning-800 { - background-color: $ionic-color-warning-800; -} -.ionic-color-warning-900 { - color: $ionic-color-warning-900; -} -.ionic-background-color-warning-900 { - background-color: $ionic-color-warning-900; -} -.ionic-color-warning-1000 { - color: $ionic-color-warning-1000; -} -.ionic-background-color-warning-1000 { - background-color: $ionic-color-warning-1000; -} -.ionic-color-warning-1100 { - color: $ionic-color-warning-1100; -} -.ionic-background-color-warning-1100 { - background-color: $ionic-color-warning-1100; -} -.ionic-color-warning-1200 { - color: $ionic-color-warning-1200; -} -.ionic-background-color-warning-1200 { - background-color: $ionic-color-warning-1200; -} -.ionic-color-warning-base { - color: $ionic-color-warning-base; -} -.ionic-background-color-warning-base { - background-color: $ionic-color-warning-base; -} -.ionic-color-danger-100 { - color: $ionic-color-danger-100; -} -.ionic-background-color-danger-100 { - background-color: $ionic-color-danger-100; -} -.ionic-color-danger-200 { - color: $ionic-color-danger-200; -} -.ionic-background-color-danger-200 { - background-color: $ionic-color-danger-200; -} -.ionic-color-danger-300 { - color: $ionic-color-danger-300; -} -.ionic-background-color-danger-300 { - background-color: $ionic-color-danger-300; -} -.ionic-color-danger-400 { - color: $ionic-color-danger-400; -} -.ionic-background-color-danger-400 { - background-color: $ionic-color-danger-400; -} -.ionic-color-danger-500 { - color: $ionic-color-danger-500; -} -.ionic-background-color-danger-500 { - background-color: $ionic-color-danger-500; -} -.ionic-color-danger-600 { - color: $ionic-color-danger-600; -} -.ionic-background-color-danger-600 { - background-color: $ionic-color-danger-600; -} -.ionic-color-danger-700 { - color: $ionic-color-danger-700; -} -.ionic-background-color-danger-700 { - background-color: $ionic-color-danger-700; -} -.ionic-color-danger-800 { - color: $ionic-color-danger-800; -} -.ionic-background-color-danger-800 { - background-color: $ionic-color-danger-800; -} -.ionic-color-danger-900 { - color: $ionic-color-danger-900; -} -.ionic-background-color-danger-900 { - background-color: $ionic-color-danger-900; -} -.ionic-color-danger-1000 { - color: $ionic-color-danger-1000; -} -.ionic-background-color-danger-1000 { - background-color: $ionic-color-danger-1000; -} -.ionic-color-danger-1100 { - color: $ionic-color-danger-1100; -} -.ionic-background-color-danger-1100 { - background-color: $ionic-color-danger-1100; -} -.ionic-color-danger-1200 { - color: $ionic-color-danger-1200; -} -.ionic-background-color-danger-1200 { - background-color: $ionic-color-danger-1200; -} -.ionic-color-danger-base { - color: $ionic-color-danger-base; -} -.ionic-background-color-danger-base { - background-color: $ionic-color-danger-base; -} -.ionic-color-success-100 { - color: $ionic-color-success-100; -} -.ionic-background-color-success-100 { - background-color: $ionic-color-success-100; -} -.ionic-color-success-200 { - color: $ionic-color-success-200; -} -.ionic-background-color-success-200 { - background-color: $ionic-color-success-200; -} -.ionic-color-success-300 { - color: $ionic-color-success-300; -} -.ionic-background-color-success-300 { - background-color: $ionic-color-success-300; -} -.ionic-color-success-400 { - color: $ionic-color-success-400; -} -.ionic-background-color-success-400 { - background-color: $ionic-color-success-400; -} -.ionic-color-success-500 { - color: $ionic-color-success-500; -} -.ionic-background-color-success-500 { - background-color: $ionic-color-success-500; -} -.ionic-color-success-600 { - color: $ionic-color-success-600; -} -.ionic-background-color-success-600 { - background-color: $ionic-color-success-600; -} -.ionic-color-success-700 { - color: $ionic-color-success-700; -} -.ionic-background-color-success-700 { - background-color: $ionic-color-success-700; -} -.ionic-color-success-800 { - color: $ionic-color-success-800; -} -.ionic-background-color-success-800 { - background-color: $ionic-color-success-800; -} -.ionic-color-success-900 { - color: $ionic-color-success-900; -} -.ionic-background-color-success-900 { - background-color: $ionic-color-success-900; -} -.ionic-color-success-1000 { - color: $ionic-color-success-1000; -} -.ionic-background-color-success-1000 { - background-color: $ionic-color-success-1000; -} -.ionic-color-success-1100 { - color: $ionic-color-success-1100; -} -.ionic-background-color-success-1100 { - background-color: $ionic-color-success-1100; -} -.ionic-color-success-1200 { - color: $ionic-color-success-1200; -} -.ionic-background-color-success-1200 { - background-color: $ionic-color-success-1200; -} -.ionic-color-success-base { - color: $ionic-color-success-base; -} -.ionic-background-color-success-base { - background-color: $ionic-color-success-base; -} -.ionic-z-index-0 { - z-index: $ionic-z-index-0; -} -.ionic-z-index-1 { - z-index: $ionic-z-index-1; -} -.ionic-z-index-2 { - z-index: $ionic-z-index-2; -} -.ionic-z-index-3 { - z-index: $ionic-z-index-3; -} -.ionic-z-index-4 { - z-index: $ionic-z-index-4; -} -.ionic-z-index-500 { - z-index: $ionic-z-index-500; -} -.ionic-z-index-bottom { - z-index: $ionic-z-index-bottom; -} -.ionic-z-index-top { - z-index: $ionic-z-index-top; -} - -.ionic-display-sm-regular { - font-size: $ionic-font-size-800; +.ion-display-sm-regular { + font-size: $ion-font-size-800; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-1100; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-1100; text-transform: none; text-decoration: none; } -.ionic-display-sm-light { - font-size: $ionic-font-size-800; +.ion-display-sm-light { + font-size: $ion-font-size-800; font-style: normal; - font-weight: $ionic-font-weight-light; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-1100; + font-weight: $ion-font-weight-light; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-1100; text-transform: none; text-decoration: none; } -.ionic-display-lg-regular { - font-size: $ionic-font-size-900; +.ion-display-lg-regular { + font-size: $ion-font-size-900; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-1200; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-1200; text-transform: none; text-decoration: none; } -.ionic-display-lg-light { - font-size: $ionic-font-size-900; +.ion-display-lg-light { + font-size: $ion-font-size-900; font-style: normal; - font-weight: $ionic-font-weight-light; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-1200; + font-weight: $ion-font-weight-light; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-1200; text-transform: none; text-decoration: none; } -.ionic-heading-h1-regular { - font-size: $ionic-font-size-700; +.ion-heading-h1-regular { + font-size: $ion-font-size-700; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h1-medium { - font-size: $ionic-font-size-700; +.ion-heading-h1-medium { + font-size: $ion-font-size-700; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h1-semi-bold { - font-size: $ionic-font-size-600; +.ion-heading-h1-semi-bold { + font-size: $ion-font-size-700; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h1-bold { - font-size: $ionic-font-size-700; +.ion-heading-h1-bold { + font-size: $ion-font-size-700; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h2-regular { - font-size: $ionic-font-size-650; +.ion-heading-h2-regular { + font-size: $ion-font-size-650; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h2-medium { - font-size: $ionic-font-size-650; +.ion-heading-h2-medium { + font-size: $ion-font-size-650; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h2-semi-bold { - font-size: $ionic-font-size-650; +.ion-heading-h2-semi-bold { + font-size: $ion-font-size-650; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h2-bold { - font-size: $ionic-font-size-650; +.ion-heading-h2-bold { + font-size: $ion-font-size-650; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-900; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-900; text-transform: none; text-decoration: none; } -.ionic-heading-h3-regular { - font-size: $ionic-font-size-600; +.ion-heading-h3-regular { + font-size: $ion-font-size-600; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-800; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-800; text-transform: none; text-decoration: none; } -.ionic-heading-h3-medium { - font-size: $ionic-font-size-600; +.ion-heading-h3-medium { + font-size: $ion-font-size-600; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-800; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-800; text-transform: none; text-decoration: none; } -.ionic-heading-h3-semi-bold { - font-size: $ionic-font-size-600; +.ion-heading-h3-semi-bold { + font-size: $ion-font-size-600; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-800; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-800; text-transform: none; text-decoration: none; } -.ionic-heading-h3-bold { - font-size: $ionic-font-size-600; +.ion-heading-h3-bold { + font-size: $ion-font-size-600; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-800; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-800; text-transform: none; text-decoration: none; } -.ionic-heading-h4-regular { - font-size: $ionic-font-size-550; +.ion-heading-h4-regular { + font-size: $ion-font-size-550; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h4-medium { - font-size: $ionic-font-size-550; +.ion-heading-h4-medium { + font-size: $ion-font-size-550; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h4-semi-bold { - font-size: $ionic-font-size-550; +.ion-heading-h4-semi-bold { + font-size: $ion-font-size-550; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h4-bold { - font-size: $ionic-font-size-550; +.ion-heading-h4-bold { + font-size: $ion-font-size-550; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h5-regular { - font-size: $ionic-font-size-500; +.ion-heading-h5-regular { + font-size: $ion-font-size-500; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h5-medium { - font-size: $ionic-font-size-500; +.ion-heading-h5-medium { + font-size: $ion-font-size-500; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h5-semi-bold { - font-size: $ionic-font-size-500; +.ion-heading-h5-semi-bold { + font-size: $ion-font-size-500; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h5-bold { - font-size: $ionic-font-size-500; +.ion-heading-h5-bold { + font-size: $ion-font-size-500; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h6-regular { - font-size: $ionic-font-size-450; +.ion-heading-h6-regular { + font-size: $ion-font-size-450; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h6-medium { - font-size: $ionic-font-size-450; +.ion-heading-h6-medium { + font-size: $ion-font-size-450; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h6-semi-bold { - font-size: $ionic-font-size-450; +.ion-heading-h6-semi-bold { + font-size: $ion-font-size-450; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-heading-h6-bold { - font-size: $ionic-font-size-450; +.ion-heading-h6-bold { + font-size: $ion-font-size-450; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-700; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-700; text-transform: none; text-decoration: none; } -.ionic-body-lg-regular { - font-size: $ionic-font-size-400; +.ion-body-action-xl { + font-size: $ion-font-size-500; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-1; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-lg-medium { - font-size: $ionic-font-size-400; +.ion-body-action-lg { + font-size: $ion-font-size-400; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-1; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-lg-semi-bold { - font-size: $ionic-font-size-400; +.ion-body-action-md { + font-size: $ion-font-size-350; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-1; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-body-lg-bold { - font-size: $ionic-font-size-400; +.ion-body-action-sm { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-1; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-body-lg-link { - font-size: $ionic-font-size-400; +.ion-body-lg-regular { + font-size: $ion-font-size-400; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; - text-transform: none; - text-decoration: underline; -} - -.ionic-body-lg-italic { - font-size: $ionic-font-size-400; - font-style: italic; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-md-regular { - font-size: $ionic-font-size-350; +.ion-body-lg-medium { + font-size: $ion-font-size-400; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-md-medium { - font-size: $ionic-font-size-350; +.ion-body-lg-semi-bold { + font-size: $ion-font-size-400; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-md-semi-bold { - font-size: $ionic-font-size-350; +.ion-body-lg-bold { + font-size: $ion-font-size-400; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-md-bold { - font-size: $ionic-font-size-350; +.ion-body-md-regular { + font-size: $ion-font-size-350; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-md-link { - font-size: $ionic-font-size-350; +.ion-body-md-medium { + font-size: $ion-font-size-350; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; - text-transform: none; - text-decoration: underline; -} - -.ionic-body-md-italic { - font-size: $ionic-font-size-350; - font-style: italic; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-sm-regular { - font-size: $ionic-font-size-300; +.ion-body-md-semi-bold { + font-size: $ion-font-size-350; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-sm-medium { - font-size: $ionic-font-size-300; +.ion-body-md-bold { + font-size: $ion-font-size-350; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-600; text-transform: none; text-decoration: none; } -.ionic-body-sm-semi-bold { - font-size: $ionic-font-size-300; +.ion-body-sm-regular { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-body-sm-bold { - font-size: $ionic-font-size-300; +.ion-body-sm-medium { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-body-sm-link { - font-size: $ionic-font-size-300; +.ion-body-sm-semi-bold { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; - text-transform: none; - text-decoration: underline; -} - -.ionic-body-sm-italic { - font-size: $ionic-font-size-300; - font-style: italic; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-0; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-action-xl { - font-size: $ionic-font-size-500; +.ion-body-sm-bold { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-1; - line-height: $ionic-line-height-600; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-0; + line-height: $ion-font-line-height-500; text-transform: none; text-decoration: none; } -.ionic-action-lg { - font-size: $ionic-font-size-400; +.ion-overline-regular { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-1; - line-height: $ionic-line-height-600; - text-transform: none; - text-decoration: none; -} - -.ionic-action-md { - font-size: $ionic-font-size-350; - font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-1; - line-height: $ionic-line-height-500; - text-transform: none; - text-decoration: none; -} - -.ionic-action-sm { - font-size: $ionic-font-size-300; - font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-1; - line-height: $ionic-line-height-500; - text-transform: none; - text-decoration: none; -} - -.ionic-overline-regular { - font-size: $ionic-font-size-300; - font-style: normal; - font-weight: $ionic-font-weight-regular; - letter-spacing: $ionic-letter-spacing-2; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-regular; + letter-spacing: $ion-font-letter-spacing-2; + line-height: $ion-font-line-height-500; text-transform: uppercase; text-decoration: none; } -.ionic-overline-medium { - font-size: $ionic-font-size-300; +.ion-overline-medium { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-medium; - letter-spacing: $ionic-letter-spacing-2; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-medium; + letter-spacing: $ion-font-letter-spacing-2; + line-height: $ion-font-line-height-500; text-transform: uppercase; text-decoration: none; } -.ionic-overline-semi-bold { - font-size: $ionic-font-size-300; +.ion-overline-semi-bold { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-semi-bold; - letter-spacing: $ionic-letter-spacing-2; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-semi-bold; + letter-spacing: $ion-font-letter-spacing-2; + line-height: $ion-font-line-height-500; text-transform: uppercase; text-decoration: none; } -.ionic-overline-bold { - font-size: $ionic-font-size-300; +.ion-overline-bold { + font-size: $ion-font-size-300; font-style: normal; - font-weight: $ionic-font-weight-bold; - letter-spacing: $ionic-letter-spacing-2; - line-height: $ionic-line-height-500; + font-weight: $ion-font-weight-bold; + letter-spacing: $ion-font-letter-spacing-2; + line-height: $ion-font-line-height-500; text-transform: uppercase; text-decoration: none; } -.ionic-state-focus-0 { - color: $ionic-state-focus-0; +.ion-semantics-primary-100 { + color: $ion-semantics-primary-100; } -.ionic-background-state-focus-0 { - background-color: $ionic-state-focus-0; +.ion-background-semantics-primary-100 { + background-color: $ion-semantics-primary-100; } -.ionic-state-focus-1 { - color: $ionic-state-focus-1; +.ion-semantics-primary-200 { + color: $ion-semantics-primary-200; } -.ionic-background-state-focus-1 { - background-color: $ionic-state-focus-1; +.ion-background-semantics-primary-200 { + background-color: $ion-semantics-primary-200; } -.ionic-state-focus-2 { - color: $ionic-state-focus-2; +.ion-semantics-primary-300 { + color: $ion-semantics-primary-300; } -.ionic-background-state-focus-2 { - background-color: $ionic-state-focus-2; +.ion-background-semantics-primary-300 { + background-color: $ion-semantics-primary-300; } -.ionic-state-disabled { - color: $ionic-state-disabled; +.ion-semantics-primary-400 { + color: $ion-semantics-primary-400; } -.ionic-background-state-disabled { - background-color: $ionic-state-disabled; +.ion-background-semantics-primary-400 { + background-color: $ion-semantics-primary-400; } -.ionic-state-hover { - color: $ionic-state-hover; +.ion-semantics-primary-500 { + color: $ion-semantics-primary-500; } -.ionic-background-state-hover { - background-color: $ionic-state-hover; +.ion-background-semantics-primary-500 { + background-color: $ion-semantics-primary-500; } -.ionic-state-pressed { - color: $ionic-state-pressed; +.ion-semantics-primary-600 { + color: $ion-semantics-primary-600; } -.ionic-background-state-pressed { - background-color: $ionic-state-pressed; +.ion-background-semantics-primary-600 { + background-color: $ion-semantics-primary-600; +} +.ion-semantics-primary-700 { + color: $ion-semantics-primary-700; +} +.ion-background-semantics-primary-700 { + background-color: $ion-semantics-primary-700; +} +.ion-semantics-primary-800 { + color: $ion-semantics-primary-800; +} +.ion-background-semantics-primary-800 { + background-color: $ion-semantics-primary-800; +} +.ion-semantics-primary-900 { + color: $ion-semantics-primary-900; +} +.ion-background-semantics-primary-900 { + background-color: $ion-semantics-primary-900; +} +.ion-semantics-primary-1000 { + color: $ion-semantics-primary-1000; +} +.ion-background-semantics-primary-1000 { + background-color: $ion-semantics-primary-1000; +} +.ion-semantics-primary-1100 { + color: $ion-semantics-primary-1100; +} +.ion-background-semantics-primary-1100 { + background-color: $ion-semantics-primary-1100; +} +.ion-semantics-primary-1200 { + color: $ion-semantics-primary-1200; +} +.ion-background-semantics-primary-1200 { + background-color: $ion-semantics-primary-1200; +} +.ion-semantics-primary-base { + color: $ion-semantics-primary-base; +} +.ion-background-semantics-primary-base { + background-color: $ion-semantics-primary-base; +} +.ion-semantics-info-100 { + color: $ion-semantics-info-100; +} +.ion-background-semantics-info-100 { + background-color: $ion-semantics-info-100; +} +.ion-semantics-info-200 { + color: $ion-semantics-info-200; +} +.ion-background-semantics-info-200 { + background-color: $ion-semantics-info-200; +} +.ion-semantics-info-300 { + color: $ion-semantics-info-300; +} +.ion-background-semantics-info-300 { + background-color: $ion-semantics-info-300; +} +.ion-semantics-info-400 { + color: $ion-semantics-info-400; +} +.ion-background-semantics-info-400 { + background-color: $ion-semantics-info-400; +} +.ion-semantics-info-500 { + color: $ion-semantics-info-500; +} +.ion-background-semantics-info-500 { + background-color: $ion-semantics-info-500; +} +.ion-semantics-info-600 { + color: $ion-semantics-info-600; +} +.ion-background-semantics-info-600 { + background-color: $ion-semantics-info-600; +} +.ion-semantics-info-700 { + color: $ion-semantics-info-700; +} +.ion-background-semantics-info-700 { + background-color: $ion-semantics-info-700; +} +.ion-semantics-info-800 { + color: $ion-semantics-info-800; +} +.ion-background-semantics-info-800 { + background-color: $ion-semantics-info-800; +} +.ion-semantics-info-900 { + color: $ion-semantics-info-900; +} +.ion-background-semantics-info-900 { + background-color: $ion-semantics-info-900; +} +.ion-semantics-info-1000 { + color: $ion-semantics-info-1000; +} +.ion-background-semantics-info-1000 { + background-color: $ion-semantics-info-1000; +} +.ion-semantics-info-1100 { + color: $ion-semantics-info-1100; +} +.ion-background-semantics-info-1100 { + background-color: $ion-semantics-info-1100; +} +.ion-semantics-info-1200 { + color: $ion-semantics-info-1200; +} +.ion-background-semantics-info-1200 { + background-color: $ion-semantics-info-1200; +} +.ion-semantics-info-base { + color: $ion-semantics-info-base; +} +.ion-background-semantics-info-base { + background-color: $ion-semantics-info-base; +} +.ion-semantics-success-100 { + color: $ion-semantics-success-100; +} +.ion-background-semantics-success-100 { + background-color: $ion-semantics-success-100; +} +.ion-semantics-success-200 { + color: $ion-semantics-success-200; +} +.ion-background-semantics-success-200 { + background-color: $ion-semantics-success-200; +} +.ion-semantics-success-300 { + color: $ion-semantics-success-300; +} +.ion-background-semantics-success-300 { + background-color: $ion-semantics-success-300; +} +.ion-semantics-success-400 { + color: $ion-semantics-success-400; +} +.ion-background-semantics-success-400 { + background-color: $ion-semantics-success-400; +} +.ion-semantics-success-500 { + color: $ion-semantics-success-500; +} +.ion-background-semantics-success-500 { + background-color: $ion-semantics-success-500; +} +.ion-semantics-success-600 { + color: $ion-semantics-success-600; +} +.ion-background-semantics-success-600 { + background-color: $ion-semantics-success-600; +} +.ion-semantics-success-700 { + color: $ion-semantics-success-700; +} +.ion-background-semantics-success-700 { + background-color: $ion-semantics-success-700; +} +.ion-semantics-success-800 { + color: $ion-semantics-success-800; +} +.ion-background-semantics-success-800 { + background-color: $ion-semantics-success-800; +} +.ion-semantics-success-900 { + color: $ion-semantics-success-900; +} +.ion-background-semantics-success-900 { + background-color: $ion-semantics-success-900; +} +.ion-semantics-success-1000 { + color: $ion-semantics-success-1000; +} +.ion-background-semantics-success-1000 { + background-color: $ion-semantics-success-1000; +} +.ion-semantics-success-1100 { + color: $ion-semantics-success-1100; +} +.ion-background-semantics-success-1100 { + background-color: $ion-semantics-success-1100; +} +.ion-semantics-success-1200 { + color: $ion-semantics-success-1200; +} +.ion-background-semantics-success-1200 { + background-color: $ion-semantics-success-1200; +} +.ion-semantics-success-base { + color: $ion-semantics-success-base; +} +.ion-background-semantics-success-base { + background-color: $ion-semantics-success-base; +} +.ion-semantics-danger-100 { + color: $ion-semantics-danger-100; +} +.ion-background-semantics-danger-100 { + background-color: $ion-semantics-danger-100; +} +.ion-semantics-danger-200 { + color: $ion-semantics-danger-200; +} +.ion-background-semantics-danger-200 { + background-color: $ion-semantics-danger-200; +} +.ion-semantics-danger-300 { + color: $ion-semantics-danger-300; +} +.ion-background-semantics-danger-300 { + background-color: $ion-semantics-danger-300; +} +.ion-semantics-danger-400 { + color: $ion-semantics-danger-400; +} +.ion-background-semantics-danger-400 { + background-color: $ion-semantics-danger-400; +} +.ion-semantics-danger-500 { + color: $ion-semantics-danger-500; +} +.ion-background-semantics-danger-500 { + background-color: $ion-semantics-danger-500; +} +.ion-semantics-danger-600 { + color: $ion-semantics-danger-600; +} +.ion-background-semantics-danger-600 { + background-color: $ion-semantics-danger-600; +} +.ion-semantics-danger-700 { + color: $ion-semantics-danger-700; +} +.ion-background-semantics-danger-700 { + background-color: $ion-semantics-danger-700; +} +.ion-semantics-danger-800 { + color: $ion-semantics-danger-800; +} +.ion-background-semantics-danger-800 { + background-color: $ion-semantics-danger-800; +} +.ion-semantics-danger-900 { + color: $ion-semantics-danger-900; +} +.ion-background-semantics-danger-900 { + background-color: $ion-semantics-danger-900; +} +.ion-semantics-danger-1000 { + color: $ion-semantics-danger-1000; +} +.ion-background-semantics-danger-1000 { + background-color: $ion-semantics-danger-1000; +} +.ion-semantics-danger-1100 { + color: $ion-semantics-danger-1100; +} +.ion-background-semantics-danger-1100 { + background-color: $ion-semantics-danger-1100; +} +.ion-semantics-danger-1200 { + color: $ion-semantics-danger-1200; +} +.ion-background-semantics-danger-1200 { + background-color: $ion-semantics-danger-1200; +} +.ion-semantics-danger-base { + color: $ion-semantics-danger-base; +} +.ion-background-semantics-danger-base { + background-color: $ion-semantics-danger-base; +} +.ion-semantics-warning-100 { + color: $ion-semantics-warning-100; +} +.ion-background-semantics-warning-100 { + background-color: $ion-semantics-warning-100; +} +.ion-semantics-warning-200 { + color: $ion-semantics-warning-200; +} +.ion-background-semantics-warning-200 { + background-color: $ion-semantics-warning-200; +} +.ion-semantics-warning-300 { + color: $ion-semantics-warning-300; +} +.ion-background-semantics-warning-300 { + background-color: $ion-semantics-warning-300; +} +.ion-semantics-warning-400 { + color: $ion-semantics-warning-400; +} +.ion-background-semantics-warning-400 { + background-color: $ion-semantics-warning-400; +} +.ion-semantics-warning-500 { + color: $ion-semantics-warning-500; +} +.ion-background-semantics-warning-500 { + background-color: $ion-semantics-warning-500; +} +.ion-semantics-warning-600 { + color: $ion-semantics-warning-600; +} +.ion-background-semantics-warning-600 { + background-color: $ion-semantics-warning-600; +} +.ion-semantics-warning-700 { + color: $ion-semantics-warning-700; +} +.ion-background-semantics-warning-700 { + background-color: $ion-semantics-warning-700; +} +.ion-semantics-warning-800 { + color: $ion-semantics-warning-800; +} +.ion-background-semantics-warning-800 { + background-color: $ion-semantics-warning-800; +} +.ion-semantics-warning-900 { + color: $ion-semantics-warning-900; +} +.ion-background-semantics-warning-900 { + background-color: $ion-semantics-warning-900; +} +.ion-semantics-warning-1000 { + color: $ion-semantics-warning-1000; +} +.ion-background-semantics-warning-1000 { + background-color: $ion-semantics-warning-1000; +} +.ion-semantics-warning-1100 { + color: $ion-semantics-warning-1100; +} +.ion-background-semantics-warning-1100 { + background-color: $ion-semantics-warning-1100; +} +.ion-semantics-warning-1200 { + color: $ion-semantics-warning-1200; +} +.ion-background-semantics-warning-1200 { + background-color: $ion-semantics-warning-1200; +} +.ion-semantics-warning-base { + color: $ion-semantics-warning-base; +} +.ion-background-semantics-warning-base { + background-color: $ion-semantics-warning-base; +} +.ion-bg-primary-base-default { + color: $ion-bg-primary-base-default; +} +.ion-background-bg-primary-base-default { + background-color: $ion-bg-primary-base-default; +} +.ion-bg-primary-base-press { + color: $ion-bg-primary-base-press; +} +.ion-background-bg-primary-base-press { + background-color: $ion-bg-primary-base-press; +} +.ion-bg-primary-subtle-default { + color: $ion-bg-primary-subtle-default; +} +.ion-background-bg-primary-subtle-default { + background-color: $ion-bg-primary-subtle-default; +} +.ion-bg-primary-subtle-press { + color: $ion-bg-primary-subtle-press; +} +.ion-background-bg-primary-subtle-press { + background-color: $ion-bg-primary-subtle-press; +} +.ion-bg-danger-base-default { + color: $ion-bg-danger-base-default; +} +.ion-background-bg-danger-base-default { + background-color: $ion-bg-danger-base-default; +} +.ion-bg-danger-base-press { + color: $ion-bg-danger-base-press; +} +.ion-background-bg-danger-base-press { + background-color: $ion-bg-danger-base-press; +} +.ion-bg-danger-subtle-default { + color: $ion-bg-danger-subtle-default; +} +.ion-background-bg-danger-subtle-default { + background-color: $ion-bg-danger-subtle-default; +} +.ion-bg-danger-subtle-press { + color: $ion-bg-danger-subtle-press; +} +.ion-background-bg-danger-subtle-press { + background-color: $ion-bg-danger-subtle-press; +} +.ion-bg-success-base-default { + color: $ion-bg-success-base-default; +} +.ion-background-bg-success-base-default { + background-color: $ion-bg-success-base-default; +} +.ion-bg-success-base-press { + color: $ion-bg-success-base-press; +} +.ion-background-bg-success-base-press { + background-color: $ion-bg-success-base-press; +} +.ion-bg-success-subtle-default { + color: $ion-bg-success-subtle-default; +} +.ion-background-bg-success-subtle-default { + background-color: $ion-bg-success-subtle-default; +} +.ion-bg-success-subtle-press { + color: $ion-bg-success-subtle-press; +} +.ion-background-bg-success-subtle-press { + background-color: $ion-bg-success-subtle-press; +} +.ion-bg-info-base-default { + color: $ion-bg-info-base-default; +} +.ion-background-bg-info-base-default { + background-color: $ion-bg-info-base-default; +} +.ion-bg-info-base-press { + color: $ion-bg-info-base-press; +} +.ion-background-bg-info-base-press { + background-color: $ion-bg-info-base-press; +} +.ion-bg-info-subtle-default { + color: $ion-bg-info-subtle-default; +} +.ion-background-bg-info-subtle-default { + background-color: $ion-bg-info-subtle-default; +} +.ion-bg-info-subtle-press { + color: $ion-bg-info-subtle-press; +} +.ion-background-bg-info-subtle-press { + background-color: $ion-bg-info-subtle-press; +} +.ion-bg-warning-base-default { + color: $ion-bg-warning-base-default; +} +.ion-background-bg-warning-base-default { + background-color: $ion-bg-warning-base-default; +} +.ion-bg-warning-base-press { + color: $ion-bg-warning-base-press; +} +.ion-background-bg-warning-base-press { + background-color: $ion-bg-warning-base-press; +} +.ion-bg-warning-subtle-default { + color: $ion-bg-warning-subtle-default; +} +.ion-background-bg-warning-subtle-default { + background-color: $ion-bg-warning-subtle-default; +} +.ion-bg-warning-subtle-press { + color: $ion-bg-warning-subtle-press; +} +.ion-background-bg-warning-subtle-press { + background-color: $ion-bg-warning-subtle-press; +} +.ion-bg-body { + color: $ion-bg-body; +} +.ion-background-bg-body { + background-color: $ion-bg-body; +} +.ion-bg-neutral-subtle-default { + color: $ion-bg-neutral-subtle-default; +} +.ion-background-bg-neutral-subtle-default { + background-color: $ion-bg-neutral-subtle-default; +} +.ion-bg-neutral-subtle-press { + color: $ion-bg-neutral-subtle-press; +} +.ion-background-bg-neutral-subtle-press { + background-color: $ion-bg-neutral-subtle-press; +} +.ion-bg-neutral-base-default { + color: $ion-bg-neutral-base-default; +} +.ion-background-bg-neutral-base-default { + background-color: $ion-bg-neutral-base-default; +} +.ion-bg-neutral-base-press { + color: $ion-bg-neutral-base-press; +} +.ion-background-bg-neutral-base-press { + background-color: $ion-bg-neutral-base-press; +} +.ion-bg-neutral-subtlest-default { + color: $ion-bg-neutral-subtlest-default; +} +.ion-background-bg-neutral-subtlest-default { + background-color: $ion-bg-neutral-subtlest-default; +} +.ion-bg-neutral-subtlest-press { + color: $ion-bg-neutral-subtlest-press; +} +.ion-background-bg-neutral-subtlest-press { + background-color: $ion-bg-neutral-subtlest-press; +} +.ion-bg-surface-default { + color: $ion-bg-surface-default; +} +.ion-background-bg-surface-default { + background-color: $ion-bg-surface-default; +} +.ion-bg-input-default { + color: $ion-bg-input-default; +} +.ion-background-bg-input-default { + background-color: $ion-bg-input-default; +} +.ion-bg-input-read-only { + color: $ion-bg-input-read-only; +} +.ion-background-bg-input-read-only { + background-color: $ion-bg-input-read-only; +} +.ion-text-default { + color: $ion-text-default; +} +.ion-background-text-default { + background-color: $ion-text-default; +} +.ion-text-subtle { + color: $ion-text-subtle; +} +.ion-background-text-subtle { + background-color: $ion-text-subtle; +} +.ion-text-subtlest { + color: $ion-text-subtlest; +} +.ion-background-text-subtlest { + background-color: $ion-text-subtlest; +} +.ion-text-primary { + color: $ion-text-primary; +} +.ion-background-text-primary { + background-color: $ion-text-primary; +} +.ion-text-disabled { + color: $ion-text-disabled; +} +.ion-background-text-disabled { + background-color: $ion-text-disabled; +} +.ion-text-danger { + color: $ion-text-danger; +} +.ion-background-text-danger { + background-color: $ion-text-danger; +} +.ion-text-info { + color: $ion-text-info; +} +.ion-background-text-info { + background-color: $ion-text-info; +} +.ion-text-warning { + color: $ion-text-warning; +} +.ion-background-text-warning { + background-color: $ion-text-warning; +} +.ion-text-success { + color: $ion-text-success; +} +.ion-background-text-success { + background-color: $ion-text-success; +} +.ion-text-link-default { + color: $ion-text-link-default; +} +.ion-background-text-link-default { + background-color: $ion-text-link-default; +} +.ion-text-link-press { + color: $ion-text-link-press; +} +.ion-background-text-link-press { + background-color: $ion-text-link-press; +} +.ion-text-link-visited { + color: $ion-text-link-visited; +} +.ion-background-text-link-visited { + background-color: $ion-text-link-visited; +} +.ion-text-inverse { + color: $ion-text-inverse; +} +.ion-background-text-inverse { + background-color: $ion-text-inverse; +} +.ion-text-select { + color: $ion-text-select; +} +.ion-background-text-select { + background-color: $ion-text-select; +} +.ion-border-default { + border: $ion-border-default; +} +.ion-border-focus-0 { + border: $ion-border-focus-0; +} +.ion-border-focus-default { + border: $ion-border-focus-default; +} +.ion-border-focus-error { + border: $ion-border-focus-error; +} +.ion-border-primary { + border: $ion-border-primary; +} +.ion-border-success { + border: $ion-border-success; +} +.ion-border-warning { + border: $ion-border-warning; +} +.ion-border-danger { + border: $ion-border-danger; +} +.ion-border-subtle { + border: $ion-border-subtle; +} +.ion-border-input-default { + border: $ion-border-input-default; +} +.ion-border-input-press { + border: $ion-border-input-press; +} +.ion-border-input-read-only { + border: $ion-border-input-read-only; +} +.ion-border-style-none { + border: $ion-border-style-none; +} +.ion-border-style-solid { + border: $ion-border-style-solid; +} +.ion-border-style-dashed { + border: $ion-border-style-dashed; +} +.ion-border-style-dotted { + border: $ion-border-style-dotted; +} +.ion-border-size-0 { + border: $ion-border-size-0; +} +.ion-border-size-025 { + border: $ion-border-size-025; +} +.ion-border-size-050 { + border: $ion-border-size-050; +} +.ion-border-size-075 { + border: $ion-border-size-075; +} +.ion-border-radius-0 { + border: $ion-border-radius-0; +} +.ion-border-radius-100 { + border: $ion-border-radius-100; +} +.ion-border-radius-200 { + border: $ion-border-radius-200; +} +.ion-border-radius-300 { + border: $ion-border-radius-300; +} +.ion-border-radius-400 { + border: $ion-border-radius-400; +} +.ion-border-radius-500 { + border: $ion-border-radius-500; +} +.ion-border-radius-800 { + border: $ion-border-radius-800; +} +.ion-border-radius-1000 { + border: $ion-border-radius-1000; +} +.ion-border-radius-full { + border: $ion-border-radius-full; +} +.ion-border-radius-025 { + border: $ion-border-radius-025; +} +.ion-shadow-1 { + box-shadow: $ion-shadow-1; +} +.ion-shadow-2 { + box-shadow: $ion-shadow-2; +} +.ion-shadow-3 { + box-shadow: $ion-shadow-3; +} +.ion-shadow-4 { + box-shadow: $ion-shadow-4; +} +.ion-shadow-5 { + box-shadow: $ion-shadow-5; +} +.ion-shadow-6 { + box-shadow: $ion-shadow-6; +} +.ion-shadow-7 { + box-shadow: $ion-shadow-7; +} +.ion-icon-subtlest { + color: $ion-icon-subtlest; +} +.ion-background-icon-subtlest { + background-color: $ion-icon-subtlest; +} +.ion-icon-info { + color: $ion-icon-info; +} +.ion-background-icon-info { + background-color: $ion-icon-info; +} +.ion-icon-success { + color: $ion-icon-success; +} +.ion-background-icon-success { + background-color: $ion-icon-success; +} +.ion-icon-danger { + color: $ion-icon-danger; +} +.ion-background-icon-danger { + background-color: $ion-icon-danger; +} +.ion-icon-warning { + color: $ion-icon-warning; +} +.ion-background-icon-warning { + background-color: $ion-icon-warning; +} +.ion-icon-inverse { + color: $ion-icon-inverse; +} +.ion-background-icon-inverse { + background-color: $ion-icon-inverse; +} +.ion-icon-primary { + color: $ion-icon-primary; +} +.ion-background-icon-primary { + background-color: $ion-icon-primary; +} +.ion-icon-default { + color: $ion-icon-default; +} +.ion-background-icon-default { + background-color: $ion-icon-default; +} +.ion-icon-disabled { + color: $ion-icon-disabled; +} +.ion-background-icon-disabled { + background-color: $ion-icon-disabled; +} +.ion-icon-subtle { + color: $ion-icon-subtle; +} +.ion-background-icon-subtle { + background-color: $ion-icon-subtle; +} +.ion-icon-select { + color: $ion-icon-select; +} +.ion-background-icon-select { + background-color: $ion-icon-select; +} +.ion-primitives-neutral-100 { + color: $ion-primitives-neutral-100; +} +.ion-background-primitives-neutral-100 { + background-color: $ion-primitives-neutral-100; +} +.ion-primitives-neutral-200 { + color: $ion-primitives-neutral-200; +} +.ion-background-primitives-neutral-200 { + background-color: $ion-primitives-neutral-200; +} +.ion-primitives-neutral-300 { + color: $ion-primitives-neutral-300; +} +.ion-background-primitives-neutral-300 { + background-color: $ion-primitives-neutral-300; +} +.ion-primitives-neutral-400 { + color: $ion-primitives-neutral-400; +} +.ion-background-primitives-neutral-400 { + background-color: $ion-primitives-neutral-400; +} +.ion-primitives-neutral-500 { + color: $ion-primitives-neutral-500; +} +.ion-background-primitives-neutral-500 { + background-color: $ion-primitives-neutral-500; +} +.ion-primitives-neutral-600 { + color: $ion-primitives-neutral-600; +} +.ion-background-primitives-neutral-600 { + background-color: $ion-primitives-neutral-600; +} +.ion-primitives-neutral-700 { + color: $ion-primitives-neutral-700; +} +.ion-background-primitives-neutral-700 { + background-color: $ion-primitives-neutral-700; +} +.ion-primitives-neutral-800 { + color: $ion-primitives-neutral-800; +} +.ion-background-primitives-neutral-800 { + background-color: $ion-primitives-neutral-800; +} +.ion-primitives-neutral-900 { + color: $ion-primitives-neutral-900; +} +.ion-background-primitives-neutral-900 { + background-color: $ion-primitives-neutral-900; +} +.ion-primitives-neutral-1000 { + color: $ion-primitives-neutral-1000; +} +.ion-background-primitives-neutral-1000 { + background-color: $ion-primitives-neutral-1000; +} +.ion-primitives-neutral-1100 { + color: $ion-primitives-neutral-1100; +} +.ion-background-primitives-neutral-1100 { + background-color: $ion-primitives-neutral-1100; +} +.ion-primitives-neutral-1200 { + color: $ion-primitives-neutral-1200; +} +.ion-background-primitives-neutral-1200 { + background-color: $ion-primitives-neutral-1200; +} +.ion-primitives-base-white { + color: $ion-primitives-base-white; +} +.ion-background-primitives-base-white { + background-color: $ion-primitives-base-white; +} +.ion-primitives-base-black { + color: $ion-primitives-base-black; +} +.ion-background-primitives-base-black { + background-color: $ion-primitives-base-black; +} +.ion-primitives-red-100 { + color: $ion-primitives-red-100; +} +.ion-background-primitives-red-100 { + background-color: $ion-primitives-red-100; +} +.ion-primitives-red-200 { + color: $ion-primitives-red-200; +} +.ion-background-primitives-red-200 { + background-color: $ion-primitives-red-200; +} +.ion-primitives-red-300 { + color: $ion-primitives-red-300; +} +.ion-background-primitives-red-300 { + background-color: $ion-primitives-red-300; +} +.ion-primitives-red-400 { + color: $ion-primitives-red-400; +} +.ion-background-primitives-red-400 { + background-color: $ion-primitives-red-400; +} +.ion-primitives-red-500 { + color: $ion-primitives-red-500; +} +.ion-background-primitives-red-500 { + background-color: $ion-primitives-red-500; +} +.ion-primitives-red-600 { + color: $ion-primitives-red-600; +} +.ion-background-primitives-red-600 { + background-color: $ion-primitives-red-600; +} +.ion-primitives-red-700 { + color: $ion-primitives-red-700; +} +.ion-background-primitives-red-700 { + background-color: $ion-primitives-red-700; +} +.ion-primitives-red-800 { + color: $ion-primitives-red-800; +} +.ion-background-primitives-red-800 { + background-color: $ion-primitives-red-800; +} +.ion-primitives-red-900 { + color: $ion-primitives-red-900; +} +.ion-background-primitives-red-900 { + background-color: $ion-primitives-red-900; +} +.ion-primitives-red-1000 { + color: $ion-primitives-red-1000; +} +.ion-background-primitives-red-1000 { + background-color: $ion-primitives-red-1000; +} +.ion-primitives-red-1100 { + color: $ion-primitives-red-1100; +} +.ion-background-primitives-red-1100 { + background-color: $ion-primitives-red-1100; +} +.ion-primitives-red-1200 { + color: $ion-primitives-red-1200; +} +.ion-background-primitives-red-1200 { + background-color: $ion-primitives-red-1200; +} +.ion-primitives-pumpkin-100 { + color: $ion-primitives-pumpkin-100; +} +.ion-background-primitives-pumpkin-100 { + background-color: $ion-primitives-pumpkin-100; +} +.ion-primitives-pumpkin-200 { + color: $ion-primitives-pumpkin-200; +} +.ion-background-primitives-pumpkin-200 { + background-color: $ion-primitives-pumpkin-200; +} +.ion-primitives-pumpkin-300 { + color: $ion-primitives-pumpkin-300; +} +.ion-background-primitives-pumpkin-300 { + background-color: $ion-primitives-pumpkin-300; +} +.ion-primitives-pumpkin-400 { + color: $ion-primitives-pumpkin-400; +} +.ion-background-primitives-pumpkin-400 { + background-color: $ion-primitives-pumpkin-400; +} +.ion-primitives-pumpkin-500 { + color: $ion-primitives-pumpkin-500; +} +.ion-background-primitives-pumpkin-500 { + background-color: $ion-primitives-pumpkin-500; +} +.ion-primitives-pumpkin-600 { + color: $ion-primitives-pumpkin-600; +} +.ion-background-primitives-pumpkin-600 { + background-color: $ion-primitives-pumpkin-600; +} +.ion-primitives-pumpkin-700 { + color: $ion-primitives-pumpkin-700; +} +.ion-background-primitives-pumpkin-700 { + background-color: $ion-primitives-pumpkin-700; +} +.ion-primitives-pumpkin-800 { + color: $ion-primitives-pumpkin-800; +} +.ion-background-primitives-pumpkin-800 { + background-color: $ion-primitives-pumpkin-800; +} +.ion-primitives-pumpkin-900 { + color: $ion-primitives-pumpkin-900; +} +.ion-background-primitives-pumpkin-900 { + background-color: $ion-primitives-pumpkin-900; +} +.ion-primitives-pumpkin-1000 { + color: $ion-primitives-pumpkin-1000; +} +.ion-background-primitives-pumpkin-1000 { + background-color: $ion-primitives-pumpkin-1000; +} +.ion-primitives-pumpkin-1100 { + color: $ion-primitives-pumpkin-1100; +} +.ion-background-primitives-pumpkin-1100 { + background-color: $ion-primitives-pumpkin-1100; +} +.ion-primitives-pumpkin-1200 { + color: $ion-primitives-pumpkin-1200; +} +.ion-background-primitives-pumpkin-1200 { + background-color: $ion-primitives-pumpkin-1200; +} +.ion-primitives-orange-100 { + color: $ion-primitives-orange-100; +} +.ion-background-primitives-orange-100 { + background-color: $ion-primitives-orange-100; +} +.ion-primitives-orange-200 { + color: $ion-primitives-orange-200; +} +.ion-background-primitives-orange-200 { + background-color: $ion-primitives-orange-200; +} +.ion-primitives-orange-300 { + color: $ion-primitives-orange-300; +} +.ion-background-primitives-orange-300 { + background-color: $ion-primitives-orange-300; +} +.ion-primitives-orange-400 { + color: $ion-primitives-orange-400; +} +.ion-background-primitives-orange-400 { + background-color: $ion-primitives-orange-400; +} +.ion-primitives-orange-500 { + color: $ion-primitives-orange-500; +} +.ion-background-primitives-orange-500 { + background-color: $ion-primitives-orange-500; +} +.ion-primitives-orange-600 { + color: $ion-primitives-orange-600; +} +.ion-background-primitives-orange-600 { + background-color: $ion-primitives-orange-600; +} +.ion-primitives-orange-700 { + color: $ion-primitives-orange-700; +} +.ion-background-primitives-orange-700 { + background-color: $ion-primitives-orange-700; +} +.ion-primitives-orange-800 { + color: $ion-primitives-orange-800; +} +.ion-background-primitives-orange-800 { + background-color: $ion-primitives-orange-800; +} +.ion-primitives-orange-900 { + color: $ion-primitives-orange-900; +} +.ion-background-primitives-orange-900 { + background-color: $ion-primitives-orange-900; +} +.ion-primitives-orange-1000 { + color: $ion-primitives-orange-1000; +} +.ion-background-primitives-orange-1000 { + background-color: $ion-primitives-orange-1000; +} +.ion-primitives-orange-1100 { + color: $ion-primitives-orange-1100; +} +.ion-background-primitives-orange-1100 { + background-color: $ion-primitives-orange-1100; +} +.ion-primitives-orange-1200 { + color: $ion-primitives-orange-1200; +} +.ion-background-primitives-orange-1200 { + background-color: $ion-primitives-orange-1200; +} +.ion-primitives-yellow-100 { + color: $ion-primitives-yellow-100; +} +.ion-background-primitives-yellow-100 { + background-color: $ion-primitives-yellow-100; +} +.ion-primitives-yellow-200 { + color: $ion-primitives-yellow-200; +} +.ion-background-primitives-yellow-200 { + background-color: $ion-primitives-yellow-200; +} +.ion-primitives-yellow-300 { + color: $ion-primitives-yellow-300; +} +.ion-background-primitives-yellow-300 { + background-color: $ion-primitives-yellow-300; +} +.ion-primitives-yellow-400 { + color: $ion-primitives-yellow-400; +} +.ion-background-primitives-yellow-400 { + background-color: $ion-primitives-yellow-400; +} +.ion-primitives-yellow-500 { + color: $ion-primitives-yellow-500; +} +.ion-background-primitives-yellow-500 { + background-color: $ion-primitives-yellow-500; +} +.ion-primitives-yellow-600 { + color: $ion-primitives-yellow-600; +} +.ion-background-primitives-yellow-600 { + background-color: $ion-primitives-yellow-600; +} +.ion-primitives-yellow-700 { + color: $ion-primitives-yellow-700; +} +.ion-background-primitives-yellow-700 { + background-color: $ion-primitives-yellow-700; +} +.ion-primitives-yellow-800 { + color: $ion-primitives-yellow-800; +} +.ion-background-primitives-yellow-800 { + background-color: $ion-primitives-yellow-800; +} +.ion-primitives-yellow-900 { + color: $ion-primitives-yellow-900; +} +.ion-background-primitives-yellow-900 { + background-color: $ion-primitives-yellow-900; +} +.ion-primitives-yellow-1000 { + color: $ion-primitives-yellow-1000; +} +.ion-background-primitives-yellow-1000 { + background-color: $ion-primitives-yellow-1000; +} +.ion-primitives-yellow-1100 { + color: $ion-primitives-yellow-1100; +} +.ion-background-primitives-yellow-1100 { + background-color: $ion-primitives-yellow-1100; +} +.ion-primitives-yellow-1200 { + color: $ion-primitives-yellow-1200; +} +.ion-background-primitives-yellow-1200 { + background-color: $ion-primitives-yellow-1200; +} +.ion-primitives-lime-100 { + color: $ion-primitives-lime-100; +} +.ion-background-primitives-lime-100 { + background-color: $ion-primitives-lime-100; +} +.ion-primitives-lime-200 { + color: $ion-primitives-lime-200; +} +.ion-background-primitives-lime-200 { + background-color: $ion-primitives-lime-200; +} +.ion-primitives-lime-300 { + color: $ion-primitives-lime-300; +} +.ion-background-primitives-lime-300 { + background-color: $ion-primitives-lime-300; +} +.ion-primitives-lime-400 { + color: $ion-primitives-lime-400; +} +.ion-background-primitives-lime-400 { + background-color: $ion-primitives-lime-400; +} +.ion-primitives-lime-500 { + color: $ion-primitives-lime-500; +} +.ion-background-primitives-lime-500 { + background-color: $ion-primitives-lime-500; +} +.ion-primitives-lime-600 { + color: $ion-primitives-lime-600; +} +.ion-background-primitives-lime-600 { + background-color: $ion-primitives-lime-600; +} +.ion-primitives-lime-700 { + color: $ion-primitives-lime-700; +} +.ion-background-primitives-lime-700 { + background-color: $ion-primitives-lime-700; +} +.ion-primitives-lime-800 { + color: $ion-primitives-lime-800; +} +.ion-background-primitives-lime-800 { + background-color: $ion-primitives-lime-800; +} +.ion-primitives-lime-900 { + color: $ion-primitives-lime-900; +} +.ion-background-primitives-lime-900 { + background-color: $ion-primitives-lime-900; +} +.ion-primitives-lime-1000 { + color: $ion-primitives-lime-1000; +} +.ion-background-primitives-lime-1000 { + background-color: $ion-primitives-lime-1000; +} +.ion-primitives-lime-1100 { + color: $ion-primitives-lime-1100; +} +.ion-background-primitives-lime-1100 { + background-color: $ion-primitives-lime-1100; +} +.ion-primitives-lime-1200 { + color: $ion-primitives-lime-1200; +} +.ion-background-primitives-lime-1200 { + background-color: $ion-primitives-lime-1200; +} +.ion-primitives-green-100 { + color: $ion-primitives-green-100; +} +.ion-background-primitives-green-100 { + background-color: $ion-primitives-green-100; +} +.ion-primitives-green-200 { + color: $ion-primitives-green-200; +} +.ion-background-primitives-green-200 { + background-color: $ion-primitives-green-200; +} +.ion-primitives-green-300 { + color: $ion-primitives-green-300; +} +.ion-background-primitives-green-300 { + background-color: $ion-primitives-green-300; +} +.ion-primitives-green-400 { + color: $ion-primitives-green-400; +} +.ion-background-primitives-green-400 { + background-color: $ion-primitives-green-400; +} +.ion-primitives-green-500 { + color: $ion-primitives-green-500; +} +.ion-background-primitives-green-500 { + background-color: $ion-primitives-green-500; +} +.ion-primitives-green-600 { + color: $ion-primitives-green-600; +} +.ion-background-primitives-green-600 { + background-color: $ion-primitives-green-600; +} +.ion-primitives-green-700 { + color: $ion-primitives-green-700; +} +.ion-background-primitives-green-700 { + background-color: $ion-primitives-green-700; +} +.ion-primitives-green-800 { + color: $ion-primitives-green-800; +} +.ion-background-primitives-green-800 { + background-color: $ion-primitives-green-800; +} +.ion-primitives-green-900 { + color: $ion-primitives-green-900; +} +.ion-background-primitives-green-900 { + background-color: $ion-primitives-green-900; +} +.ion-primitives-green-1000 { + color: $ion-primitives-green-1000; +} +.ion-background-primitives-green-1000 { + background-color: $ion-primitives-green-1000; +} +.ion-primitives-green-1100 { + color: $ion-primitives-green-1100; +} +.ion-background-primitives-green-1100 { + background-color: $ion-primitives-green-1100; +} +.ion-primitives-green-1200 { + color: $ion-primitives-green-1200; +} +.ion-background-primitives-green-1200 { + background-color: $ion-primitives-green-1200; +} +.ion-primitives-teal-100 { + color: $ion-primitives-teal-100; +} +.ion-background-primitives-teal-100 { + background-color: $ion-primitives-teal-100; +} +.ion-primitives-teal-200 { + color: $ion-primitives-teal-200; +} +.ion-background-primitives-teal-200 { + background-color: $ion-primitives-teal-200; +} +.ion-primitives-teal-300 { + color: $ion-primitives-teal-300; +} +.ion-background-primitives-teal-300 { + background-color: $ion-primitives-teal-300; +} +.ion-primitives-teal-400 { + color: $ion-primitives-teal-400; +} +.ion-background-primitives-teal-400 { + background-color: $ion-primitives-teal-400; +} +.ion-primitives-teal-500 { + color: $ion-primitives-teal-500; +} +.ion-background-primitives-teal-500 { + background-color: $ion-primitives-teal-500; +} +.ion-primitives-teal-600 { + color: $ion-primitives-teal-600; +} +.ion-background-primitives-teal-600 { + background-color: $ion-primitives-teal-600; +} +.ion-primitives-teal-700 { + color: $ion-primitives-teal-700; +} +.ion-background-primitives-teal-700 { + background-color: $ion-primitives-teal-700; +} +.ion-primitives-teal-800 { + color: $ion-primitives-teal-800; +} +.ion-background-primitives-teal-800 { + background-color: $ion-primitives-teal-800; +} +.ion-primitives-teal-900 { + color: $ion-primitives-teal-900; +} +.ion-background-primitives-teal-900 { + background-color: $ion-primitives-teal-900; +} +.ion-primitives-teal-1000 { + color: $ion-primitives-teal-1000; +} +.ion-background-primitives-teal-1000 { + background-color: $ion-primitives-teal-1000; +} +.ion-primitives-teal-1100 { + color: $ion-primitives-teal-1100; +} +.ion-background-primitives-teal-1100 { + background-color: $ion-primitives-teal-1100; +} +.ion-primitives-teal-1200 { + color: $ion-primitives-teal-1200; +} +.ion-background-primitives-teal-1200 { + background-color: $ion-primitives-teal-1200; +} +.ion-primitives-aqua-100 { + color: $ion-primitives-aqua-100; +} +.ion-background-primitives-aqua-100 { + background-color: $ion-primitives-aqua-100; +} +.ion-primitives-aqua-200 { + color: $ion-primitives-aqua-200; +} +.ion-background-primitives-aqua-200 { + background-color: $ion-primitives-aqua-200; +} +.ion-primitives-aqua-300 { + color: $ion-primitives-aqua-300; +} +.ion-background-primitives-aqua-300 { + background-color: $ion-primitives-aqua-300; +} +.ion-primitives-aqua-400 { + color: $ion-primitives-aqua-400; +} +.ion-background-primitives-aqua-400 { + background-color: $ion-primitives-aqua-400; +} +.ion-primitives-aqua-500 { + color: $ion-primitives-aqua-500; +} +.ion-background-primitives-aqua-500 { + background-color: $ion-primitives-aqua-500; +} +.ion-primitives-aqua-600 { + color: $ion-primitives-aqua-600; +} +.ion-background-primitives-aqua-600 { + background-color: $ion-primitives-aqua-600; +} +.ion-primitives-aqua-700 { + color: $ion-primitives-aqua-700; +} +.ion-background-primitives-aqua-700 { + background-color: $ion-primitives-aqua-700; +} +.ion-primitives-aqua-800 { + color: $ion-primitives-aqua-800; +} +.ion-background-primitives-aqua-800 { + background-color: $ion-primitives-aqua-800; +} +.ion-primitives-aqua-900 { + color: $ion-primitives-aqua-900; +} +.ion-background-primitives-aqua-900 { + background-color: $ion-primitives-aqua-900; +} +.ion-primitives-aqua-1000 { + color: $ion-primitives-aqua-1000; +} +.ion-background-primitives-aqua-1000 { + background-color: $ion-primitives-aqua-1000; +} +.ion-primitives-aqua-1100 { + color: $ion-primitives-aqua-1100; +} +.ion-background-primitives-aqua-1100 { + background-color: $ion-primitives-aqua-1100; +} +.ion-primitives-aqua-1200 { + color: $ion-primitives-aqua-1200; +} +.ion-background-primitives-aqua-1200 { + background-color: $ion-primitives-aqua-1200; +} +.ion-primitives-blue-100 { + color: $ion-primitives-blue-100; +} +.ion-background-primitives-blue-100 { + background-color: $ion-primitives-blue-100; +} +.ion-primitives-blue-200 { + color: $ion-primitives-blue-200; +} +.ion-background-primitives-blue-200 { + background-color: $ion-primitives-blue-200; +} +.ion-primitives-blue-300 { + color: $ion-primitives-blue-300; +} +.ion-background-primitives-blue-300 { + background-color: $ion-primitives-blue-300; +} +.ion-primitives-blue-400 { + color: $ion-primitives-blue-400; +} +.ion-background-primitives-blue-400 { + background-color: $ion-primitives-blue-400; +} +.ion-primitives-blue-500 { + color: $ion-primitives-blue-500; +} +.ion-background-primitives-blue-500 { + background-color: $ion-primitives-blue-500; +} +.ion-primitives-blue-600 { + color: $ion-primitives-blue-600; +} +.ion-background-primitives-blue-600 { + background-color: $ion-primitives-blue-600; +} +.ion-primitives-blue-700 { + color: $ion-primitives-blue-700; +} +.ion-background-primitives-blue-700 { + background-color: $ion-primitives-blue-700; +} +.ion-primitives-blue-800 { + color: $ion-primitives-blue-800; +} +.ion-background-primitives-blue-800 { + background-color: $ion-primitives-blue-800; +} +.ion-primitives-blue-900 { + color: $ion-primitives-blue-900; +} +.ion-background-primitives-blue-900 { + background-color: $ion-primitives-blue-900; +} +.ion-primitives-blue-1000 { + color: $ion-primitives-blue-1000; +} +.ion-background-primitives-blue-1000 { + background-color: $ion-primitives-blue-1000; +} +.ion-primitives-blue-1100 { + color: $ion-primitives-blue-1100; +} +.ion-background-primitives-blue-1100 { + background-color: $ion-primitives-blue-1100; +} +.ion-primitives-blue-1200 { + color: $ion-primitives-blue-1200; +} +.ion-background-primitives-blue-1200 { + background-color: $ion-primitives-blue-1200; +} +.ion-primitives-indigo-100 { + color: $ion-primitives-indigo-100; +} +.ion-background-primitives-indigo-100 { + background-color: $ion-primitives-indigo-100; +} +.ion-primitives-indigo-200 { + color: $ion-primitives-indigo-200; +} +.ion-background-primitives-indigo-200 { + background-color: $ion-primitives-indigo-200; +} +.ion-primitives-indigo-300 { + color: $ion-primitives-indigo-300; +} +.ion-background-primitives-indigo-300 { + background-color: $ion-primitives-indigo-300; +} +.ion-primitives-indigo-400 { + color: $ion-primitives-indigo-400; +} +.ion-background-primitives-indigo-400 { + background-color: $ion-primitives-indigo-400; +} +.ion-primitives-indigo-500 { + color: $ion-primitives-indigo-500; +} +.ion-background-primitives-indigo-500 { + background-color: $ion-primitives-indigo-500; +} +.ion-primitives-indigo-600 { + color: $ion-primitives-indigo-600; +} +.ion-background-primitives-indigo-600 { + background-color: $ion-primitives-indigo-600; +} +.ion-primitives-indigo-700 { + color: $ion-primitives-indigo-700; +} +.ion-background-primitives-indigo-700 { + background-color: $ion-primitives-indigo-700; +} +.ion-primitives-indigo-800 { + color: $ion-primitives-indigo-800; +} +.ion-background-primitives-indigo-800 { + background-color: $ion-primitives-indigo-800; +} +.ion-primitives-indigo-900 { + color: $ion-primitives-indigo-900; +} +.ion-background-primitives-indigo-900 { + background-color: $ion-primitives-indigo-900; +} +.ion-primitives-indigo-1000 { + color: $ion-primitives-indigo-1000; +} +.ion-background-primitives-indigo-1000 { + background-color: $ion-primitives-indigo-1000; +} +.ion-primitives-indigo-1100 { + color: $ion-primitives-indigo-1100; +} +.ion-background-primitives-indigo-1100 { + background-color: $ion-primitives-indigo-1100; +} +.ion-primitives-indigo-1200 { + color: $ion-primitives-indigo-1200; +} +.ion-background-primitives-indigo-1200 { + background-color: $ion-primitives-indigo-1200; +} +.ion-primitives-violet-100 { + color: $ion-primitives-violet-100; +} +.ion-background-primitives-violet-100 { + background-color: $ion-primitives-violet-100; +} +.ion-primitives-violet-200 { + color: $ion-primitives-violet-200; +} +.ion-background-primitives-violet-200 { + background-color: $ion-primitives-violet-200; +} +.ion-primitives-violet-300 { + color: $ion-primitives-violet-300; +} +.ion-background-primitives-violet-300 { + background-color: $ion-primitives-violet-300; +} +.ion-primitives-violet-400 { + color: $ion-primitives-violet-400; +} +.ion-background-primitives-violet-400 { + background-color: $ion-primitives-violet-400; +} +.ion-primitives-violet-500 { + color: $ion-primitives-violet-500; +} +.ion-background-primitives-violet-500 { + background-color: $ion-primitives-violet-500; +} +.ion-primitives-violet-600 { + color: $ion-primitives-violet-600; +} +.ion-background-primitives-violet-600 { + background-color: $ion-primitives-violet-600; +} +.ion-primitives-violet-700 { + color: $ion-primitives-violet-700; +} +.ion-background-primitives-violet-700 { + background-color: $ion-primitives-violet-700; +} +.ion-primitives-violet-800 { + color: $ion-primitives-violet-800; +} +.ion-background-primitives-violet-800 { + background-color: $ion-primitives-violet-800; +} +.ion-primitives-violet-900 { + color: $ion-primitives-violet-900; +} +.ion-background-primitives-violet-900 { + background-color: $ion-primitives-violet-900; +} +.ion-primitives-violet-1000 { + color: $ion-primitives-violet-1000; +} +.ion-background-primitives-violet-1000 { + background-color: $ion-primitives-violet-1000; +} +.ion-primitives-violet-1100 { + color: $ion-primitives-violet-1100; +} +.ion-background-primitives-violet-1100 { + background-color: $ion-primitives-violet-1100; +} +.ion-primitives-violet-1200 { + color: $ion-primitives-violet-1200; +} +.ion-background-primitives-violet-1200 { + background-color: $ion-primitives-violet-1200; +} +.ion-primitives-purple-100 { + color: $ion-primitives-purple-100; +} +.ion-background-primitives-purple-100 { + background-color: $ion-primitives-purple-100; +} +.ion-primitives-purple-200 { + color: $ion-primitives-purple-200; +} +.ion-background-primitives-purple-200 { + background-color: $ion-primitives-purple-200; +} +.ion-primitives-purple-300 { + color: $ion-primitives-purple-300; +} +.ion-background-primitives-purple-300 { + background-color: $ion-primitives-purple-300; +} +.ion-primitives-purple-400 { + color: $ion-primitives-purple-400; +} +.ion-background-primitives-purple-400 { + background-color: $ion-primitives-purple-400; +} +.ion-primitives-purple-500 { + color: $ion-primitives-purple-500; +} +.ion-background-primitives-purple-500 { + background-color: $ion-primitives-purple-500; +} +.ion-primitives-purple-600 { + color: $ion-primitives-purple-600; +} +.ion-background-primitives-purple-600 { + background-color: $ion-primitives-purple-600; +} +.ion-primitives-purple-700 { + color: $ion-primitives-purple-700; +} +.ion-background-primitives-purple-700 { + background-color: $ion-primitives-purple-700; +} +.ion-primitives-purple-800 { + color: $ion-primitives-purple-800; +} +.ion-background-primitives-purple-800 { + background-color: $ion-primitives-purple-800; +} +.ion-primitives-purple-900 { + color: $ion-primitives-purple-900; +} +.ion-background-primitives-purple-900 { + background-color: $ion-primitives-purple-900; +} +.ion-primitives-purple-1000 { + color: $ion-primitives-purple-1000; +} +.ion-background-primitives-purple-1000 { + background-color: $ion-primitives-purple-1000; +} +.ion-primitives-purple-1100 { + color: $ion-primitives-purple-1100; +} +.ion-background-primitives-purple-1100 { + background-color: $ion-primitives-purple-1100; +} +.ion-primitives-purple-1200 { + color: $ion-primitives-purple-1200; +} +.ion-background-primitives-purple-1200 { + background-color: $ion-primitives-purple-1200; +} +.ion-primitives-magenta-100 { + color: $ion-primitives-magenta-100; +} +.ion-background-primitives-magenta-100 { + background-color: $ion-primitives-magenta-100; +} +.ion-primitives-magenta-200 { + color: $ion-primitives-magenta-200; +} +.ion-background-primitives-magenta-200 { + background-color: $ion-primitives-magenta-200; +} +.ion-primitives-magenta-300 { + color: $ion-primitives-magenta-300; +} +.ion-background-primitives-magenta-300 { + background-color: $ion-primitives-magenta-300; +} +.ion-primitives-magenta-400 { + color: $ion-primitives-magenta-400; +} +.ion-background-primitives-magenta-400 { + background-color: $ion-primitives-magenta-400; +} +.ion-primitives-magenta-500 { + color: $ion-primitives-magenta-500; +} +.ion-background-primitives-magenta-500 { + background-color: $ion-primitives-magenta-500; +} +.ion-primitives-magenta-600 { + color: $ion-primitives-magenta-600; +} +.ion-background-primitives-magenta-600 { + background-color: $ion-primitives-magenta-600; +} +.ion-primitives-magenta-700 { + color: $ion-primitives-magenta-700; +} +.ion-background-primitives-magenta-700 { + background-color: $ion-primitives-magenta-700; +} +.ion-primitives-magenta-800 { + color: $ion-primitives-magenta-800; +} +.ion-background-primitives-magenta-800 { + background-color: $ion-primitives-magenta-800; +} +.ion-primitives-magenta-900 { + color: $ion-primitives-magenta-900; +} +.ion-background-primitives-magenta-900 { + background-color: $ion-primitives-magenta-900; +} +.ion-primitives-magenta-1000 { + color: $ion-primitives-magenta-1000; +} +.ion-background-primitives-magenta-1000 { + background-color: $ion-primitives-magenta-1000; +} +.ion-primitives-magenta-1100 { + color: $ion-primitives-magenta-1100; +} +.ion-background-primitives-magenta-1100 { + background-color: $ion-primitives-magenta-1100; +} +.ion-primitives-magenta-1200 { + color: $ion-primitives-magenta-1200; +} +.ion-background-primitives-magenta-1200 { + background-color: $ion-primitives-magenta-1200; +} +.ion-primitives-pink-100 { + color: $ion-primitives-pink-100; +} +.ion-background-primitives-pink-100 { + background-color: $ion-primitives-pink-100; +} +.ion-primitives-pink-200 { + color: $ion-primitives-pink-200; +} +.ion-background-primitives-pink-200 { + background-color: $ion-primitives-pink-200; +} +.ion-primitives-pink-300 { + color: $ion-primitives-pink-300; +} +.ion-background-primitives-pink-300 { + background-color: $ion-primitives-pink-300; +} +.ion-primitives-pink-400 { + color: $ion-primitives-pink-400; +} +.ion-background-primitives-pink-400 { + background-color: $ion-primitives-pink-400; +} +.ion-primitives-pink-500 { + color: $ion-primitives-pink-500; +} +.ion-background-primitives-pink-500 { + background-color: $ion-primitives-pink-500; +} +.ion-primitives-pink-600 { + color: $ion-primitives-pink-600; +} +.ion-background-primitives-pink-600 { + background-color: $ion-primitives-pink-600; +} +.ion-primitives-pink-700 { + color: $ion-primitives-pink-700; +} +.ion-background-primitives-pink-700 { + background-color: $ion-primitives-pink-700; +} +.ion-primitives-pink-800 { + color: $ion-primitives-pink-800; +} +.ion-background-primitives-pink-800 { + background-color: $ion-primitives-pink-800; +} +.ion-primitives-pink-900 { + color: $ion-primitives-pink-900; +} +.ion-background-primitives-pink-900 { + background-color: $ion-primitives-pink-900; +} +.ion-primitives-pink-1000 { + color: $ion-primitives-pink-1000; +} +.ion-background-primitives-pink-1000 { + background-color: $ion-primitives-pink-1000; +} +.ion-primitives-pink-1100 { + color: $ion-primitives-pink-1100; +} +.ion-background-primitives-pink-1100 { + background-color: $ion-primitives-pink-1100; +} +.ion-primitives-pink-1200 { + color: $ion-primitives-pink-1200; +} +.ion-background-primitives-pink-1200 { + background-color: $ion-primitives-pink-1200; +} +.ion-state-disabled { + color: $ion-state-disabled; +} +.ion-background-state-disabled { + background-color: $ion-state-disabled; +} +.ion-state-press { + color: $ion-state-press; +} +.ion-background-state-press { + background-color: $ion-state-press; +} +.ion-elevation-1 { + box-shadow: $ion-elevation-1; +} +.ion-elevation-2 { + box-shadow: $ion-elevation-2; +} +.ion-elevation-3 { + box-shadow: $ion-elevation-3; +} +.ion-elevation-4 { + box-shadow: $ion-elevation-4; +} + +.ion-margin-space-0 { + --margin-top: #{$ion-space-0}; + --margin-end: #{$ion-space-0}; + --margin-bottom: #{$ion-space-0}; + --margin-start: #{$ion-space-0}; + + @include margin($ion-space-0); +} + +.ion-margin-top-space-0 { + --margin-top: #{$ion-space-0}; + + @include margin($ion-space-0, null, null, null); +} + +.ion-margin-end-space-0 { + --margin-end: #{$ion-space-0}; + + @include margin(null, $ion-space-0, null, null); +} + +.ion-margin-bottom-space-0 { + --margin-bottom: #{$ion-space-0}; + + @include margin(null, null, $ion-space-0, null); +} + +.ion-margin-start-space-0 { + --margin-start: #{$ion-space-0}; + + @include margin(null, null, null, $ion-space-0); +} + +.ion-padding-space-0 { + --padding-top: #{$ion-space-0}; + --padding-end: #{$ion-space-0}; + --padding-bottom: #{$ion-space-0}; + --padding-start: #{$ion-space-0}; + + @include padding($ion-space-0); +} + +.ion-padding-top-space-0 { + --padding-top: #{$ion-space-0}; + + @include padding($ion-space-0, null, null, null); +} + +.ion-padding-end-space-0 { + --padding-end: #{$ion-space-0}; + + @include padding(null, $ion-space-0, null, null); +} + +.ion-padding-bottom-space-0 { + --padding-bottom: #{$ion-space-0}; + + @include padding(null, null, $ion-space-0, null); +} + +.ion-padding-start-space-0 { + --padding-start: #{$ion-space-0}; + + @include padding(null, null, null, $ion-space-0); +} + +.ion-margin-space-100 { + --margin-top: #{$ion-space-100}; + --margin-end: #{$ion-space-100}; + --margin-bottom: #{$ion-space-100}; + --margin-start: #{$ion-space-100}; + + @include margin($ion-space-100); +} + +.ion-margin-top-space-100 { + --margin-top: #{$ion-space-100}; + + @include margin($ion-space-100, null, null, null); +} + +.ion-margin-end-space-100 { + --margin-end: #{$ion-space-100}; + + @include margin(null, $ion-space-100, null, null); +} + +.ion-margin-bottom-space-100 { + --margin-bottom: #{$ion-space-100}; + + @include margin(null, null, $ion-space-100, null); +} + +.ion-margin-start-space-100 { + --margin-start: #{$ion-space-100}; + + @include margin(null, null, null, $ion-space-100); +} + +.ion-padding-space-100 { + --padding-top: #{$ion-space-100}; + --padding-end: #{$ion-space-100}; + --padding-bottom: #{$ion-space-100}; + --padding-start: #{$ion-space-100}; + + @include padding($ion-space-100); +} + +.ion-padding-top-space-100 { + --padding-top: #{$ion-space-100}; + + @include padding($ion-space-100, null, null, null); +} + +.ion-padding-end-space-100 { + --padding-end: #{$ion-space-100}; + + @include padding(null, $ion-space-100, null, null); +} + +.ion-padding-bottom-space-100 { + --padding-bottom: #{$ion-space-100}; + + @include padding(null, null, $ion-space-100, null); +} + +.ion-padding-start-space-100 { + --padding-start: #{$ion-space-100}; + + @include padding(null, null, null, $ion-space-100); +} + +.ion-margin-space-150 { + --margin-top: #{$ion-space-150}; + --margin-end: #{$ion-space-150}; + --margin-bottom: #{$ion-space-150}; + --margin-start: #{$ion-space-150}; + + @include margin($ion-space-150); +} + +.ion-margin-top-space-150 { + --margin-top: #{$ion-space-150}; + + @include margin($ion-space-150, null, null, null); +} + +.ion-margin-end-space-150 { + --margin-end: #{$ion-space-150}; + + @include margin(null, $ion-space-150, null, null); +} + +.ion-margin-bottom-space-150 { + --margin-bottom: #{$ion-space-150}; + + @include margin(null, null, $ion-space-150, null); +} + +.ion-margin-start-space-150 { + --margin-start: #{$ion-space-150}; + + @include margin(null, null, null, $ion-space-150); +} + +.ion-padding-space-150 { + --padding-top: #{$ion-space-150}; + --padding-end: #{$ion-space-150}; + --padding-bottom: #{$ion-space-150}; + --padding-start: #{$ion-space-150}; + + @include padding($ion-space-150); +} + +.ion-padding-top-space-150 { + --padding-top: #{$ion-space-150}; + + @include padding($ion-space-150, null, null, null); +} + +.ion-padding-end-space-150 { + --padding-end: #{$ion-space-150}; + + @include padding(null, $ion-space-150, null, null); +} + +.ion-padding-bottom-space-150 { + --padding-bottom: #{$ion-space-150}; + + @include padding(null, null, $ion-space-150, null); +} + +.ion-padding-start-space-150 { + --padding-start: #{$ion-space-150}; + + @include padding(null, null, null, $ion-space-150); +} + +.ion-margin-space-200 { + --margin-top: #{$ion-space-200}; + --margin-end: #{$ion-space-200}; + --margin-bottom: #{$ion-space-200}; + --margin-start: #{$ion-space-200}; + + @include margin($ion-space-200); +} + +.ion-margin-top-space-200 { + --margin-top: #{$ion-space-200}; + + @include margin($ion-space-200, null, null, null); +} + +.ion-margin-end-space-200 { + --margin-end: #{$ion-space-200}; + + @include margin(null, $ion-space-200, null, null); +} + +.ion-margin-bottom-space-200 { + --margin-bottom: #{$ion-space-200}; + + @include margin(null, null, $ion-space-200, null); +} + +.ion-margin-start-space-200 { + --margin-start: #{$ion-space-200}; + + @include margin(null, null, null, $ion-space-200); +} + +.ion-padding-space-200 { + --padding-top: #{$ion-space-200}; + --padding-end: #{$ion-space-200}; + --padding-bottom: #{$ion-space-200}; + --padding-start: #{$ion-space-200}; + + @include padding($ion-space-200); +} + +.ion-padding-top-space-200 { + --padding-top: #{$ion-space-200}; + + @include padding($ion-space-200, null, null, null); +} + +.ion-padding-end-space-200 { + --padding-end: #{$ion-space-200}; + + @include padding(null, $ion-space-200, null, null); +} + +.ion-padding-bottom-space-200 { + --padding-bottom: #{$ion-space-200}; + + @include padding(null, null, $ion-space-200, null); +} + +.ion-padding-start-space-200 { + --padding-start: #{$ion-space-200}; + + @include padding(null, null, null, $ion-space-200); +} + +.ion-margin-space-250 { + --margin-top: #{$ion-space-250}; + --margin-end: #{$ion-space-250}; + --margin-bottom: #{$ion-space-250}; + --margin-start: #{$ion-space-250}; + + @include margin($ion-space-250); +} + +.ion-margin-top-space-250 { + --margin-top: #{$ion-space-250}; + + @include margin($ion-space-250, null, null, null); +} + +.ion-margin-end-space-250 { + --margin-end: #{$ion-space-250}; + + @include margin(null, $ion-space-250, null, null); +} + +.ion-margin-bottom-space-250 { + --margin-bottom: #{$ion-space-250}; + + @include margin(null, null, $ion-space-250, null); +} + +.ion-margin-start-space-250 { + --margin-start: #{$ion-space-250}; + + @include margin(null, null, null, $ion-space-250); +} + +.ion-padding-space-250 { + --padding-top: #{$ion-space-250}; + --padding-end: #{$ion-space-250}; + --padding-bottom: #{$ion-space-250}; + --padding-start: #{$ion-space-250}; + + @include padding($ion-space-250); +} + +.ion-padding-top-space-250 { + --padding-top: #{$ion-space-250}; + + @include padding($ion-space-250, null, null, null); +} + +.ion-padding-end-space-250 { + --padding-end: #{$ion-space-250}; + + @include padding(null, $ion-space-250, null, null); +} + +.ion-padding-bottom-space-250 { + --padding-bottom: #{$ion-space-250}; + + @include padding(null, null, $ion-space-250, null); +} + +.ion-padding-start-space-250 { + --padding-start: #{$ion-space-250}; + + @include padding(null, null, null, $ion-space-250); +} + +.ion-margin-space-300 { + --margin-top: #{$ion-space-300}; + --margin-end: #{$ion-space-300}; + --margin-bottom: #{$ion-space-300}; + --margin-start: #{$ion-space-300}; + + @include margin($ion-space-300); +} + +.ion-margin-top-space-300 { + --margin-top: #{$ion-space-300}; + + @include margin($ion-space-300, null, null, null); +} + +.ion-margin-end-space-300 { + --margin-end: #{$ion-space-300}; + + @include margin(null, $ion-space-300, null, null); +} + +.ion-margin-bottom-space-300 { + --margin-bottom: #{$ion-space-300}; + + @include margin(null, null, $ion-space-300, null); +} + +.ion-margin-start-space-300 { + --margin-start: #{$ion-space-300}; + + @include margin(null, null, null, $ion-space-300); +} + +.ion-padding-space-300 { + --padding-top: #{$ion-space-300}; + --padding-end: #{$ion-space-300}; + --padding-bottom: #{$ion-space-300}; + --padding-start: #{$ion-space-300}; + + @include padding($ion-space-300); +} + +.ion-padding-top-space-300 { + --padding-top: #{$ion-space-300}; + + @include padding($ion-space-300, null, null, null); +} + +.ion-padding-end-space-300 { + --padding-end: #{$ion-space-300}; + + @include padding(null, $ion-space-300, null, null); +} + +.ion-padding-bottom-space-300 { + --padding-bottom: #{$ion-space-300}; + + @include padding(null, null, $ion-space-300, null); +} + +.ion-padding-start-space-300 { + --padding-start: #{$ion-space-300}; + + @include padding(null, null, null, $ion-space-300); +} + +.ion-margin-space-400 { + --margin-top: #{$ion-space-400}; + --margin-end: #{$ion-space-400}; + --margin-bottom: #{$ion-space-400}; + --margin-start: #{$ion-space-400}; + + @include margin($ion-space-400); +} + +.ion-margin-top-space-400 { + --margin-top: #{$ion-space-400}; + + @include margin($ion-space-400, null, null, null); +} + +.ion-margin-end-space-400 { + --margin-end: #{$ion-space-400}; + + @include margin(null, $ion-space-400, null, null); +} + +.ion-margin-bottom-space-400 { + --margin-bottom: #{$ion-space-400}; + + @include margin(null, null, $ion-space-400, null); +} + +.ion-margin-start-space-400 { + --margin-start: #{$ion-space-400}; + + @include margin(null, null, null, $ion-space-400); +} + +.ion-padding-space-400 { + --padding-top: #{$ion-space-400}; + --padding-end: #{$ion-space-400}; + --padding-bottom: #{$ion-space-400}; + --padding-start: #{$ion-space-400}; + + @include padding($ion-space-400); +} + +.ion-padding-top-space-400 { + --padding-top: #{$ion-space-400}; + + @include padding($ion-space-400, null, null, null); +} + +.ion-padding-end-space-400 { + --padding-end: #{$ion-space-400}; + + @include padding(null, $ion-space-400, null, null); +} + +.ion-padding-bottom-space-400 { + --padding-bottom: #{$ion-space-400}; + + @include padding(null, null, $ion-space-400, null); +} + +.ion-padding-start-space-400 { + --padding-start: #{$ion-space-400}; + + @include padding(null, null, null, $ion-space-400); +} + +.ion-margin-space-500 { + --margin-top: #{$ion-space-500}; + --margin-end: #{$ion-space-500}; + --margin-bottom: #{$ion-space-500}; + --margin-start: #{$ion-space-500}; + + @include margin($ion-space-500); +} + +.ion-margin-top-space-500 { + --margin-top: #{$ion-space-500}; + + @include margin($ion-space-500, null, null, null); +} + +.ion-margin-end-space-500 { + --margin-end: #{$ion-space-500}; + + @include margin(null, $ion-space-500, null, null); +} + +.ion-margin-bottom-space-500 { + --margin-bottom: #{$ion-space-500}; + + @include margin(null, null, $ion-space-500, null); +} + +.ion-margin-start-space-500 { + --margin-start: #{$ion-space-500}; + + @include margin(null, null, null, $ion-space-500); +} + +.ion-padding-space-500 { + --padding-top: #{$ion-space-500}; + --padding-end: #{$ion-space-500}; + --padding-bottom: #{$ion-space-500}; + --padding-start: #{$ion-space-500}; + + @include padding($ion-space-500); +} + +.ion-padding-top-space-500 { + --padding-top: #{$ion-space-500}; + + @include padding($ion-space-500, null, null, null); +} + +.ion-padding-end-space-500 { + --padding-end: #{$ion-space-500}; + + @include padding(null, $ion-space-500, null, null); +} + +.ion-padding-bottom-space-500 { + --padding-bottom: #{$ion-space-500}; + + @include padding(null, null, $ion-space-500, null); +} + +.ion-padding-start-space-500 { + --padding-start: #{$ion-space-500}; + + @include padding(null, null, null, $ion-space-500); +} + +.ion-margin-space-600 { + --margin-top: #{$ion-space-600}; + --margin-end: #{$ion-space-600}; + --margin-bottom: #{$ion-space-600}; + --margin-start: #{$ion-space-600}; + + @include margin($ion-space-600); +} + +.ion-margin-top-space-600 { + --margin-top: #{$ion-space-600}; + + @include margin($ion-space-600, null, null, null); +} + +.ion-margin-end-space-600 { + --margin-end: #{$ion-space-600}; + + @include margin(null, $ion-space-600, null, null); +} + +.ion-margin-bottom-space-600 { + --margin-bottom: #{$ion-space-600}; + + @include margin(null, null, $ion-space-600, null); +} + +.ion-margin-start-space-600 { + --margin-start: #{$ion-space-600}; + + @include margin(null, null, null, $ion-space-600); +} + +.ion-padding-space-600 { + --padding-top: #{$ion-space-600}; + --padding-end: #{$ion-space-600}; + --padding-bottom: #{$ion-space-600}; + --padding-start: #{$ion-space-600}; + + @include padding($ion-space-600); +} + +.ion-padding-top-space-600 { + --padding-top: #{$ion-space-600}; + + @include padding($ion-space-600, null, null, null); +} + +.ion-padding-end-space-600 { + --padding-end: #{$ion-space-600}; + + @include padding(null, $ion-space-600, null, null); +} + +.ion-padding-bottom-space-600 { + --padding-bottom: #{$ion-space-600}; + + @include padding(null, null, $ion-space-600, null); +} + +.ion-padding-start-space-600 { + --padding-start: #{$ion-space-600}; + + @include padding(null, null, null, $ion-space-600); +} + +.ion-margin-space-700 { + --margin-top: #{$ion-space-700}; + --margin-end: #{$ion-space-700}; + --margin-bottom: #{$ion-space-700}; + --margin-start: #{$ion-space-700}; + + @include margin($ion-space-700); +} + +.ion-margin-top-space-700 { + --margin-top: #{$ion-space-700}; + + @include margin($ion-space-700, null, null, null); +} + +.ion-margin-end-space-700 { + --margin-end: #{$ion-space-700}; + + @include margin(null, $ion-space-700, null, null); +} + +.ion-margin-bottom-space-700 { + --margin-bottom: #{$ion-space-700}; + + @include margin(null, null, $ion-space-700, null); +} + +.ion-margin-start-space-700 { + --margin-start: #{$ion-space-700}; + + @include margin(null, null, null, $ion-space-700); +} + +.ion-padding-space-700 { + --padding-top: #{$ion-space-700}; + --padding-end: #{$ion-space-700}; + --padding-bottom: #{$ion-space-700}; + --padding-start: #{$ion-space-700}; + + @include padding($ion-space-700); +} + +.ion-padding-top-space-700 { + --padding-top: #{$ion-space-700}; + + @include padding($ion-space-700, null, null, null); +} + +.ion-padding-end-space-700 { + --padding-end: #{$ion-space-700}; + + @include padding(null, $ion-space-700, null, null); +} + +.ion-padding-bottom-space-700 { + --padding-bottom: #{$ion-space-700}; + + @include padding(null, null, $ion-space-700, null); +} + +.ion-padding-start-space-700 { + --padding-start: #{$ion-space-700}; + + @include padding(null, null, null, $ion-space-700); +} + +.ion-margin-space-800 { + --margin-top: #{$ion-space-800}; + --margin-end: #{$ion-space-800}; + --margin-bottom: #{$ion-space-800}; + --margin-start: #{$ion-space-800}; + + @include margin($ion-space-800); +} + +.ion-margin-top-space-800 { + --margin-top: #{$ion-space-800}; + + @include margin($ion-space-800, null, null, null); +} + +.ion-margin-end-space-800 { + --margin-end: #{$ion-space-800}; + + @include margin(null, $ion-space-800, null, null); +} + +.ion-margin-bottom-space-800 { + --margin-bottom: #{$ion-space-800}; + + @include margin(null, null, $ion-space-800, null); +} + +.ion-margin-start-space-800 { + --margin-start: #{$ion-space-800}; + + @include margin(null, null, null, $ion-space-800); +} + +.ion-padding-space-800 { + --padding-top: #{$ion-space-800}; + --padding-end: #{$ion-space-800}; + --padding-bottom: #{$ion-space-800}; + --padding-start: #{$ion-space-800}; + + @include padding($ion-space-800); +} + +.ion-padding-top-space-800 { + --padding-top: #{$ion-space-800}; + + @include padding($ion-space-800, null, null, null); +} + +.ion-padding-end-space-800 { + --padding-end: #{$ion-space-800}; + + @include padding(null, $ion-space-800, null, null); +} + +.ion-padding-bottom-space-800 { + --padding-bottom: #{$ion-space-800}; + + @include padding(null, null, $ion-space-800, null); +} + +.ion-padding-start-space-800 { + --padding-start: #{$ion-space-800}; + + @include padding(null, null, null, $ion-space-800); +} + +.ion-margin-space-900 { + --margin-top: #{$ion-space-900}; + --margin-end: #{$ion-space-900}; + --margin-bottom: #{$ion-space-900}; + --margin-start: #{$ion-space-900}; + + @include margin($ion-space-900); +} + +.ion-margin-top-space-900 { + --margin-top: #{$ion-space-900}; + + @include margin($ion-space-900, null, null, null); +} + +.ion-margin-end-space-900 { + --margin-end: #{$ion-space-900}; + + @include margin(null, $ion-space-900, null, null); +} + +.ion-margin-bottom-space-900 { + --margin-bottom: #{$ion-space-900}; + + @include margin(null, null, $ion-space-900, null); +} + +.ion-margin-start-space-900 { + --margin-start: #{$ion-space-900}; + + @include margin(null, null, null, $ion-space-900); +} + +.ion-padding-space-900 { + --padding-top: #{$ion-space-900}; + --padding-end: #{$ion-space-900}; + --padding-bottom: #{$ion-space-900}; + --padding-start: #{$ion-space-900}; + + @include padding($ion-space-900); +} + +.ion-padding-top-space-900 { + --padding-top: #{$ion-space-900}; + + @include padding($ion-space-900, null, null, null); +} + +.ion-padding-end-space-900 { + --padding-end: #{$ion-space-900}; + + @include padding(null, $ion-space-900, null, null); +} + +.ion-padding-bottom-space-900 { + --padding-bottom: #{$ion-space-900}; + + @include padding(null, null, $ion-space-900, null); +} + +.ion-padding-start-space-900 { + --padding-start: #{$ion-space-900}; + + @include padding(null, null, null, $ion-space-900); +} + +.ion-margin-space-1000 { + --margin-top: #{$ion-space-1000}; + --margin-end: #{$ion-space-1000}; + --margin-bottom: #{$ion-space-1000}; + --margin-start: #{$ion-space-1000}; + + @include margin($ion-space-1000); +} + +.ion-margin-top-space-1000 { + --margin-top: #{$ion-space-1000}; + + @include margin($ion-space-1000, null, null, null); +} + +.ion-margin-end-space-1000 { + --margin-end: #{$ion-space-1000}; + + @include margin(null, $ion-space-1000, null, null); +} + +.ion-margin-bottom-space-1000 { + --margin-bottom: #{$ion-space-1000}; + + @include margin(null, null, $ion-space-1000, null); +} + +.ion-margin-start-space-1000 { + --margin-start: #{$ion-space-1000}; + + @include margin(null, null, null, $ion-space-1000); +} + +.ion-padding-space-1000 { + --padding-top: #{$ion-space-1000}; + --padding-end: #{$ion-space-1000}; + --padding-bottom: #{$ion-space-1000}; + --padding-start: #{$ion-space-1000}; + + @include padding($ion-space-1000); +} + +.ion-padding-top-space-1000 { + --padding-top: #{$ion-space-1000}; + + @include padding($ion-space-1000, null, null, null); +} + +.ion-padding-end-space-1000 { + --padding-end: #{$ion-space-1000}; + + @include padding(null, $ion-space-1000, null, null); +} + +.ion-padding-bottom-space-1000 { + --padding-bottom: #{$ion-space-1000}; + + @include padding(null, null, $ion-space-1000, null); +} + +.ion-padding-start-space-1000 { + --padding-start: #{$ion-space-1000}; + + @include padding(null, null, null, $ion-space-1000); +} + +.ion-margin-space-1200 { + --margin-top: #{$ion-space-1200}; + --margin-end: #{$ion-space-1200}; + --margin-bottom: #{$ion-space-1200}; + --margin-start: #{$ion-space-1200}; + + @include margin($ion-space-1200); +} + +.ion-margin-top-space-1200 { + --margin-top: #{$ion-space-1200}; + + @include margin($ion-space-1200, null, null, null); +} + +.ion-margin-end-space-1200 { + --margin-end: #{$ion-space-1200}; + + @include margin(null, $ion-space-1200, null, null); +} + +.ion-margin-bottom-space-1200 { + --margin-bottom: #{$ion-space-1200}; + + @include margin(null, null, $ion-space-1200, null); +} + +.ion-margin-start-space-1200 { + --margin-start: #{$ion-space-1200}; + + @include margin(null, null, null, $ion-space-1200); +} + +.ion-padding-space-1200 { + --padding-top: #{$ion-space-1200}; + --padding-end: #{$ion-space-1200}; + --padding-bottom: #{$ion-space-1200}; + --padding-start: #{$ion-space-1200}; + + @include padding($ion-space-1200); +} + +.ion-padding-top-space-1200 { + --padding-top: #{$ion-space-1200}; + + @include padding($ion-space-1200, null, null, null); +} + +.ion-padding-end-space-1200 { + --padding-end: #{$ion-space-1200}; + + @include padding(null, $ion-space-1200, null, null); +} + +.ion-padding-bottom-space-1200 { + --padding-bottom: #{$ion-space-1200}; + + @include padding(null, null, $ion-space-1200, null); +} + +.ion-padding-start-space-1200 { + --padding-start: #{$ion-space-1200}; + + @include padding(null, null, null, $ion-space-1200); +} + +.ion-margin-space-050 { + --margin-top: #{$ion-space-050}; + --margin-end: #{$ion-space-050}; + --margin-bottom: #{$ion-space-050}; + --margin-start: #{$ion-space-050}; + + @include margin($ion-space-050); +} + +.ion-margin-top-space-050 { + --margin-top: #{$ion-space-050}; + + @include margin($ion-space-050, null, null, null); +} + +.ion-margin-end-space-050 { + --margin-end: #{$ion-space-050}; + + @include margin(null, $ion-space-050, null, null); +} + +.ion-margin-bottom-space-050 { + --margin-bottom: #{$ion-space-050}; + + @include margin(null, null, $ion-space-050, null); +} + +.ion-margin-start-space-050 { + --margin-start: #{$ion-space-050}; + + @include margin(null, null, null, $ion-space-050); +} + +.ion-padding-space-050 { + --padding-top: #{$ion-space-050}; + --padding-end: #{$ion-space-050}; + --padding-bottom: #{$ion-space-050}; + --padding-start: #{$ion-space-050}; + + @include padding($ion-space-050); +} + +.ion-padding-top-space-050 { + --padding-top: #{$ion-space-050}; + + @include padding($ion-space-050, null, null, null); +} + +.ion-padding-end-space-050 { + --padding-end: #{$ion-space-050}; + + @include padding(null, $ion-space-050, null, null); +} + +.ion-padding-bottom-space-050 { + --padding-bottom: #{$ion-space-050}; + + @include padding(null, null, $ion-space-050, null); +} + +.ion-padding-start-space-050 { + --padding-start: #{$ion-space-050}; + + @include padding(null, null, null, $ion-space-050); +} + +.ion-z-index-0 { + z-index: $ion-z-index-0; +} +.ion-z-index-100 { + z-index: $ion-z-index-100; +} +.ion-z-index-200 { + z-index: $ion-z-index-200; +} +.ion-z-index-300 { + z-index: $ion-z-index-300; +} +.ion-z-index-400 { + z-index: $ion-z-index-400; +} +.ion-z-index-500 { + z-index: $ion-z-index-500; +} +.ion-z-index-bottom { + z-index: $ion-z-index-bottom; +} +.ion-z-index-top { + z-index: $ion-z-index-top; +} +.ion-transition-curve-linear { + transition: $ion-transition-curve-linear; +} +.ion-transition-curve-quick { + transition: $ion-transition-curve-quick; +} +.ion-transition-curve-base { + transition: $ion-transition-curve-base; +} +.ion-transition-curve-expressive { + transition: $ion-transition-curve-expressive; +} +.ion-transition-curve-bounce { + transition: $ion-transition-curve-bounce; +} +.ion-transition-time-0 { + transition: $ion-transition-time-0; +} +.ion-transition-time-100 { + transition: $ion-transition-time-100; +} +.ion-transition-time-150 { + transition: $ion-transition-time-150; +} +.ion-transition-time-200 { + transition: $ion-transition-time-200; +} +.ion-transition-time-300 { + transition: $ion-transition-time-300; +} +.ion-transition-time-500 { + transition: $ion-transition-time-500; +} +.ion-transition-time-1000 { + transition: $ion-transition-time-1000; +} +.ion-transition-time-1500 { + transition: $ion-transition-time-1500; +} +.ion-font-weight-thin { + font-weight: $ion-font-weight-thin; +} +.ion-font-weight-extra-light { + font-weight: $ion-font-weight-extra-light; +} +.ion-font-weight-light { + font-weight: $ion-font-weight-light; +} +.ion-font-weight-regular { + font-weight: $ion-font-weight-regular; +} +.ion-font-weight-medium { + font-weight: $ion-font-weight-medium; +} +.ion-font-weight-semi-bold { + font-weight: $ion-font-weight-semi-bold; +} +.ion-font-weight-bold { + font-weight: $ion-font-weight-bold; +} +.ion-font-weight-extra-bold { + font-weight: $ion-font-weight-extra-bold; +} +.ion-font-weight-black { + font-weight: $ion-font-weight-black; +} +.ion-font-size-275 { + font-size: $ion-font-size-275; +} +.ion-font-size-300 { + font-size: $ion-font-size-300; +} +.ion-font-size-350 { + font-size: $ion-font-size-350; +} +.ion-font-size-400 { + font-size: $ion-font-size-400; +} +.ion-font-size-450 { + font-size: $ion-font-size-450; +} +.ion-font-size-500 { + font-size: $ion-font-size-500; +} +.ion-font-size-550 { + font-size: $ion-font-size-550; +} +.ion-font-size-600 { + font-size: $ion-font-size-600; +} +.ion-font-size-650 { + font-size: $ion-font-size-650; +} +.ion-font-size-700 { + font-size: $ion-font-size-700; +} +.ion-font-size-800 { + font-size: $ion-font-size-800; +} +.ion-font-size-900 { + font-size: $ion-font-size-900; +} +.ion-font-letter-spacing-0 { + letter-spacing: $ion-font-letter-spacing-0; +} +.ion-font-letter-spacing-1 { + letter-spacing: $ion-font-letter-spacing-1; +} +.ion-font-letter-spacing-2 { + letter-spacing: $ion-font-letter-spacing-2; +} +.ion-font-line-height-300 { + line-height: $ion-font-line-height-300; +} +.ion-font-line-height-400 { + line-height: $ion-font-line-height-400; +} +.ion-font-line-height-500 { + line-height: $ion-font-line-height-500; +} +.ion-font-line-height-600 { + line-height: $ion-font-line-height-600; +} +.ion-font-line-height-700 { + line-height: $ion-font-line-height-700; +} +.ion-font-line-height-800 { + line-height: $ion-font-line-height-800; +} +.ion-font-line-height-900 { + line-height: $ion-font-line-height-900; +} +.ion-font-line-height-1100 { + line-height: $ion-font-line-height-1100; +} +.ion-font-line-height-1200 { + line-height: $ion-font-line-height-1200; +} +.ion-font-line-height-full { + line-height: $ion-font-line-height-full; +} +.ion-rectangular-2xs { + border-radius: $ion-rectangular-2xs; +} +.ion-rectangular-xs { + border-radius: $ion-rectangular-xs; +} +.ion-rectangular-sm { + border-radius: $ion-rectangular-sm; +} +.ion-rectangular-md { + border-radius: $ion-rectangular-md; +} +.ion-rectangular-lg { + border-radius: $ion-rectangular-lg; +} +.ion-rectangular-xl { + border-radius: $ion-rectangular-xl; +} +.ion-rectangular-2xl { + border-radius: $ion-rectangular-2xl; +} +.ion-round-2xs { + border-radius: $ion-round-2xs; +} +.ion-round-xs { + border-radius: $ion-round-xs; +} +.ion-round-sm { + border-radius: $ion-round-sm; +} +.ion-round-md { + border-radius: $ion-round-md; +} +.ion-round-lg { + border-radius: $ion-round-lg; +} +.ion-round-xl { + border-radius: $ion-round-xl; +} +.ion-round-2xl { + border-radius: $ion-round-2xl; +} +.ion-soft-2xs { + border-radius: $ion-soft-2xs; +} +.ion-soft-xs { + border-radius: $ion-soft-xs; +} +.ion-soft-sm { + border-radius: $ion-soft-sm; +} +.ion-soft-md { + border-radius: $ion-soft-md; +} +.ion-soft-lg { + border-radius: $ion-soft-lg; +} +.ion-soft-xl { + border-radius: $ion-soft-xl; +} +.ion-soft-2xl { + border-radius: $ion-soft-2xl; } diff --git a/core/src/foundations/ionic.vars.scss b/core/src/foundations/ionic.vars.scss index 1003309f10..8b54b502fd 100644 --- a/core/src/foundations/ionic.vars.scss +++ b/core/src/foundations/ionic.vars.scss @@ -1,1199 +1,1268 @@ -/** - * This is an auto-generated file, please do not change it directly. - * Ionic Design System - */ - +/* +Do not edit directly, this file was auto-generated. +*/ @use "../themes/functions.sizes" as font; -$ionic-elevation-100: var( - --ionic-elevation-100, - 0px 3px 9px 0px rgba(0, 0, 0, 0.07), - 0px 0px 4px 0px rgba(0, 0, 0, 0.04) -); -$ionic-elevation-200: var( - --ionic-elevation-200, - 0px 8px 25px 0px rgba(0, 0, 0, 0.08), - 0px 1px 5px 0px rgba(0, 0, 0, 0.05) -); -$ionic-elevation-300: var( - --ionic-elevation-300, - 0px 6px 32px 0px rgba(0, 0, 0, 0.16), - 0px 2px 7px 0px rgba(0, 0, 0, 0.05) -); -$ionic-elevation-400: var( - --ionic-elevation-400, - 0px 15px 48px 0px rgba(0, 0, 0, 0.18), - 0px 3px 12px 0px rgba(0, 0, 0, 0.12) -); -$ionic-elevation-500: var( - --ionic-elevation-500, - 0px 3px 9px 0px rgba(6, 43, 99, 0.07), - 0px 0px 4px 0px rgba(6, 43, 99, 0.04) -); -$ionic-elevation-600: var( - --ionic-elevation-600, - 0px 8px 25px 0px rgba(6, 43, 99, 0.08), - 0px 1px 5px 0px rgba(6, 43, 99, 0.05) -); -$ionic-elevation-700: var( - --ionic-elevation-700, - 0px 15px 32px 0px rgba(6, 43, 99, 0.09), - 0px 2px 7px 0px rgba(6, 43, 99, 0.05) -); -$ionic-elevation-800: var( - --ionic-elevation-800, - 0px 20px 48px 0px rgba(6, 43, 99, 0.12), - 0px 3px 14px 0px rgba(6, 43, 99, 0.12) -); -$ionic-font-size-275: var(--ionic-font-size-275, font.px-to-rem(11)); -$ionic-font-size-300: var(--ionic-font-size-300, font.px-to-rem(12)); -$ionic-font-size-350: var(--ionic-font-size-350, font.px-to-rem(14)); -$ionic-font-size-400: var(--ionic-font-size-400, font.px-to-rem(16)); -$ionic-font-size-450: var(--ionic-font-size-450, font.px-to-rem(18)); -$ionic-font-size-500: var(--ionic-font-size-500, font.px-to-rem(20)); -$ionic-font-size-550: var(--ionic-font-size-550, font.px-to-rem(22)); -$ionic-font-size-600: var(--ionic-font-size-600, font.px-to-rem(24)); -$ionic-font-size-650: var(--ionic-font-size-650, font.px-to-rem(26)); -$ionic-font-size-700: var(--ionic-font-size-700, font.px-to-rem(28)); -$ionic-font-size-800: var(--ionic-font-size-800, font.px-to-rem(32)); -$ionic-font-size-900: var(--ionic-font-size-900, font.px-to-rem(36)); -$ionic-font-weight-thin: var(--ionic-font-weight-thin, 100); -$ionic-font-weight-extra-light: var(--ionic-font-weight-extra-light, 200); -$ionic-font-weight-light: var(--ionic-font-weight-light, 300); -$ionic-font-weight-regular: var(--ionic-font-weight-regular, 400); -$ionic-font-weight-medium: var(--ionic-font-weight-medium, 500); -$ionic-font-weight-semi-bold: var(--ionic-font-weight-semi-bold, 600); -$ionic-font-weight-bold: var(--ionic-font-weight-bold, 700); -$ionic-font-weight-extra-bold: var(--ionic-font-weight-extra-bold, 800); -$ionic-font-weight-black: var(--ionic-font-weight-black, 900); -$ionic-letter-spacing-0: var(--ionic-letter-spacing-0, 0); -$ionic-letter-spacing-1: var(--ionic-letter-spacing-1, 1%); -$ionic-letter-spacing-2: var(--ionic-letter-spacing-2, 1.5%); -$ionic-line-height-300: var(--ionic-line-height-300, 12px); -$ionic-line-height-400: var(--ionic-line-height-400, 16px); -$ionic-line-height-500: var(--ionic-line-height-500, 20px); -$ionic-line-height-600: var(--ionic-line-height-600, 24px); -$ionic-line-height-700: var(--ionic-line-height-700, 28px); -$ionic-line-height-800: var(--ionic-line-height-800, 32px); -$ionic-line-height-900: var(--ionic-line-height-900, 36px); -$ionic-line-height-1100: var(--ionic-line-height-1100, 44px); -$ionic-line-height-1200: var(--ionic-line-height-1200, 48px); -$ionic-line-height-full: var(--ionic-line-height-full, 100%); -$ionic-space-0: var(--ionic-space-0, 0px); -$ionic-space-100: var(--ionic-space-100, 4px); -$ionic-space-150: var(--ionic-space-150, 6px); -$ionic-space-200: var(--ionic-space-200, 8px); -$ionic-space-250: var(--ionic-space-250, 10px); -$ionic-space-300: var(--ionic-space-300, 12px); -$ionic-space-400: var(--ionic-space-400, 16px); -$ionic-space-500: var(--ionic-space-500, 20px); -$ionic-space-600: var(--ionic-space-600, 24px); -$ionic-space-700: var(--ionic-space-700, 28px); -$ionic-space-800: var(--ionic-space-800, 32px); -$ionic-space-850: var(--ionic-space-850, 34px); -$ionic-space-900: var(--ionic-space-900, 36px); -$ionic-space-1000: var(--ionic-space-1000, 40px); -$ionic-space-1200: var(--ionic-space-1200, 48px); -$ionic-space-050: var(--ionic-space-050, 2px); -$ionic-border-radius-0: var(--ionic-border-radius-0, 0px); -$ionic-border-radius-100: var(--ionic-border-radius-100, 4px); -$ionic-border-radius-200: var(--ionic-border-radius-200, 8px); -$ionic-border-radius-300: var(--ionic-border-radius-300, 12px); -$ionic-border-radius-400: var(--ionic-border-radius-400, 16px); -$ionic-border-radius-500: var(--ionic-border-radius-500, 20px); -$ionic-border-radius-800: var(--ionic-border-radius-800, 32px); -$ionic-border-radius-1000: var(--ionic-border-radius-1000, 40px); -$ionic-border-radius-050: var(--ionic-border-radius-050, 2px); -$ionic-border-radius-full: var(--ionic-border-radius-full, 999px); -$ionic-border-size-0: var(--ionic-border-size-0, 0px); -$ionic-border-size-025: var(--ionic-border-size-025, 1px); -$ionic-border-size-050: var(--ionic-border-size-050, 2px); -$ionic-border-size-075: var(--ionic-border-size-075, 3px); -$ionic-border-style-none: var(--ionic-border-style-none, none); -$ionic-border-style-solid: var(--ionic-border-style-solid, solid); -$ionic-border-style-dashed: var(--ionic-border-style-dashed, dashed); -$ionic-border-style-dotted: var(--ionic-border-style-dotted, dotted); -$ionic-color-base-white: var(--ionic-color-base-white, #ffffff); -$ionic-color-base-white-rgb: var(--ionic-color-base-white-rgb, 255, 255, 255); -$ionic-color-base-black: var(--ionic-color-base-black, #111111); -$ionic-color-base-black-rgb: var(--ionic-color-base-black-rgb, 17, 17, 17); -$ionic-color-neutral-100: var(--ionic-color-neutral-100, #f1f1f1); -$ionic-color-neutral-100-rgb: var(--ionic-color-neutral-100-rgb, 241, 241, 241); -$ionic-color-neutral-200: var(--ionic-color-neutral-200, #e7e7e7); -$ionic-color-neutral-200-rgb: var(--ionic-color-neutral-200-rgb, 231, 231, 231); -$ionic-color-neutral-300: var(--ionic-color-neutral-300, #cfcfcf); -$ionic-color-neutral-300-rgb: var(--ionic-color-neutral-300-rgb, 207, 207, 207); -$ionic-color-neutral-400: var(--ionic-color-neutral-400, #b9b9b9); -$ionic-color-neutral-400-rgb: var(--ionic-color-neutral-400-rgb, 185, 185, 185); -$ionic-color-neutral-500: var(--ionic-color-neutral-500, #a2a2a2); -$ionic-color-neutral-500-rgb: var(--ionic-color-neutral-500-rgb, 162, 162, 162); -$ionic-color-neutral-600: var(--ionic-color-neutral-600, #8c8c8c); -$ionic-color-neutral-600-rgb: var(--ionic-color-neutral-600-rgb, 140, 140, 140); -$ionic-color-neutral-700: var(--ionic-color-neutral-700, #777777); -$ionic-color-neutral-700-rgb: var(--ionic-color-neutral-700-rgb, 119, 119, 119); -$ionic-color-neutral-800: var(--ionic-color-neutral-800, #626262); -$ionic-color-neutral-800-rgb: var(--ionic-color-neutral-800-rgb, 98, 98, 98); -$ionic-color-neutral-900: var(--ionic-color-neutral-900, #4e4e4e); -$ionic-color-neutral-900-rgb: var(--ionic-color-neutral-900-rgb, 78, 78, 78); -$ionic-color-neutral-1000: var(--ionic-color-neutral-1000, #3b3b3b); -$ionic-color-neutral-1000-rgb: var(--ionic-color-neutral-1000-rgb, 59, 59, 59); -$ionic-color-neutral-1100: var(--ionic-color-neutral-1100, #292929); -$ionic-color-neutral-1100-rgb: var(--ionic-color-neutral-1100-rgb, 41, 41, 41); -$ionic-color-neutral-1200: var(--ionic-color-neutral-1200, #242424); -$ionic-color-neutral-1200-rgb: var(--ionic-color-neutral-1200-rgb, 36, 36, 36); -$ionic-color-red-100: var(--ionic-color-red-100, #feeded); -$ionic-color-red-100-rgb: var(--ionic-color-red-100-rgb, 254, 237, 237); -$ionic-color-red-200: var(--ionic-color-red-200, #fde1e1); -$ionic-color-red-200-rgb: var(--ionic-color-red-200-rgb, 253, 225, 225); -$ionic-color-red-300: var(--ionic-color-red-300, #fcc1c1); -$ionic-color-red-300-rgb: var(--ionic-color-red-300-rgb, 252, 193, 193); -$ionic-color-red-400: var(--ionic-color-red-400, #faa1a1); -$ionic-color-red-400-rgb: var(--ionic-color-red-400-rgb, 250, 161, 161); -$ionic-color-red-500: var(--ionic-color-red-500, #f97d7d); -$ionic-color-red-500-rgb: var(--ionic-color-red-500-rgb, 249, 125, 125); -$ionic-color-red-600: var(--ionic-color-red-600, #f85151); -$ionic-color-red-600-rgb: var(--ionic-color-red-600-rgb, 248, 81, 81); -$ionic-color-red-700: var(--ionic-color-red-700, #e52929); -$ionic-color-red-700-rgb: var(--ionic-color-red-700-rgb, 229, 41, 41); -$ionic-color-red-800: var(--ionic-color-red-800, #bf2222); -$ionic-color-red-800-rgb: var(--ionic-color-red-800-rgb, 191, 34, 34); -$ionic-color-red-900: var(--ionic-color-red-900, #991b1b); -$ionic-color-red-900-rgb: var(--ionic-color-red-900-rgb, 153, 27, 27); -$ionic-color-red-1000: var(--ionic-color-red-1000, #761515); -$ionic-color-red-1000-rgb: var(--ionic-color-red-1000-rgb, 118, 21, 21); -$ionic-color-red-1100: var(--ionic-color-red-1100, #540f0f); -$ionic-color-red-1100-rgb: var(--ionic-color-red-1100-rgb, 84, 15, 15); -$ionic-color-red-1200: var(--ionic-color-red-1200, #330909); -$ionic-color-red-1200-rgb: var(--ionic-color-red-1200-rgb, 51, 9, 9); -$ionic-color-pumpkin-100: var(--ionic-color-pumpkin-100, #feedea); -$ionic-color-pumpkin-100-rgb: var(--ionic-color-pumpkin-100-rgb, 254, 237, 234); -$ionic-color-pumpkin-200: var(--ionic-color-pumpkin-200, #fde0db); -$ionic-color-pumpkin-200-rgb: var(--ionic-color-pumpkin-200-rgb, 253, 224, 219); -$ionic-color-pumpkin-300: var(--ionic-color-pumpkin-300, #fbbdb1); -$ionic-color-pumpkin-300-rgb: var(--ionic-color-pumpkin-300-rgb, 251, 189, 177); -$ionic-color-pumpkin-400: var(--ionic-color-pumpkin-400, #f9947c); -$ionic-color-pumpkin-400-rgb: var(--ionic-color-pumpkin-400-rgb, 249, 148, 124); -$ionic-color-pumpkin-500: var(--ionic-color-pumpkin-500, #f75d07); -$ionic-color-pumpkin-500-rgb: var(--ionic-color-pumpkin-500-rgb, 247, 93, 7); -$ionic-color-pumpkin-600: var(--ionic-color-pumpkin-600, #da5206); -$ionic-color-pumpkin-600-rgb: var(--ionic-color-pumpkin-600-rgb, 218, 82, 6); -$ionic-color-pumpkin-700: var(--ionic-color-pumpkin-700, #bd4705); -$ionic-color-pumpkin-700-rgb: var(--ionic-color-pumpkin-700-rgb, 189, 71, 5); -$ionic-color-pumpkin-800: var(--ionic-color-pumpkin-800, #9f3c05); -$ionic-color-pumpkin-800-rgb: var(--ionic-color-pumpkin-800-rgb, 159, 60, 5); -$ionic-color-pumpkin-900: var(--ionic-color-pumpkin-900, #803004); -$ionic-color-pumpkin-900-rgb: var(--ionic-color-pumpkin-900-rgb, 128, 48, 4); -$ionic-color-pumpkin-1000: var(--ionic-color-pumpkin-1000, #602403); -$ionic-color-pumpkin-1000-rgb: var(--ionic-color-pumpkin-1000-rgb, 96, 36, 3); -$ionic-color-pumpkin-1100: var(--ionic-color-pumpkin-1100, #401802); -$ionic-color-pumpkin-1100-rgb: var(--ionic-color-pumpkin-1100-rgb, 64, 24, 2); -$ionic-color-pumpkin-1200: var(--ionic-color-pumpkin-1200, #210c01); -$ionic-color-pumpkin-1200-rgb: var(--ionic-color-pumpkin-1200-rgb, 33, 12, 1); -$ionic-color-orange-100: var(--ionic-color-orange-100, #fff1ea); -$ionic-color-orange-100-rgb: var(--ionic-color-orange-100-rgb, 255, 241, 234); -$ionic-color-orange-200: var(--ionic-color-orange-200, #ffe8db); -$ionic-color-orange-200-rgb: var(--ionic-color-orange-200-rgb, 255, 232, 219); -$ionic-color-orange-300: var(--ionic-color-orange-300, #ffcfb1); -$ionic-color-orange-300-rgb: var(--ionic-color-orange-300-rgb, 255, 207, 177); -$ionic-color-orange-400: var(--ionic-color-orange-400, #ffb37b); -$ionic-color-orange-400-rgb: var(--ionic-color-orange-400-rgb, 255, 179, 123); -$ionic-color-orange-500: var(--ionic-color-orange-500, #ff9400); -$ionic-color-orange-500-rgb: var(--ionic-color-orange-500-rgb, 255, 148, 0); -$ionic-color-orange-600: var(--ionic-color-orange-600, #e18300); -$ionic-color-orange-600-rgb: var(--ionic-color-orange-600-rgb, 225, 131, 0); -$ionic-color-orange-700: var(--ionic-color-orange-700, #c37100); -$ionic-color-orange-700-rgb: var(--ionic-color-orange-700-rgb, 195, 113, 0); -$ionic-color-orange-800: var(--ionic-color-orange-800, #a45f00); -$ionic-color-orange-800-rgb: var(--ionic-color-orange-800-rgb, 164, 95, 0); -$ionic-color-orange-900: var(--ionic-color-orange-900, #844d00); -$ionic-color-orange-900-rgb: var(--ionic-color-orange-900-rgb, 132, 77, 0); -$ionic-color-orange-1000: var(--ionic-color-orange-1000, #633a00); -$ionic-color-orange-1000-rgb: var(--ionic-color-orange-1000-rgb, 99, 58, 0); -$ionic-color-orange-1100: var(--ionic-color-orange-1100, #422700); -$ionic-color-orange-1100-rgb: var(--ionic-color-orange-1100-rgb, 66, 39, 0); -$ionic-color-orange-1200: var(--ionic-color-orange-1200, #221400); -$ionic-color-orange-1200-rgb: var(--ionic-color-orange-1200-rgb, 34, 20, 0); -$ionic-color-yellow-100: var(--ionic-color-yellow-100, #fff9ea); -$ionic-color-yellow-100-rgb: var(--ionic-color-yellow-100-rgb, 255, 249, 234); -$ionic-color-yellow-200: var(--ionic-color-yellow-200, #fff5db); -$ionic-color-yellow-200-rgb: var(--ionic-color-yellow-200-rgb, 255, 245, 219); -$ionic-color-yellow-300: var(--ionic-color-yellow-300, #ffebb1); -$ionic-color-yellow-300-rgb: var(--ionic-color-yellow-300-rgb, 255, 235, 177); -$ionic-color-yellow-400: var(--ionic-color-yellow-400, #ffe07b); -$ionic-color-yellow-400-rgb: var(--ionic-color-yellow-400-rgb, 255, 224, 123); -$ionic-color-yellow-500: var(--ionic-color-yellow-500, #ffd600); -$ionic-color-yellow-500-rgb: var(--ionic-color-yellow-500-rgb, 255, 214, 0); -$ionic-color-yellow-600: var(--ionic-color-yellow-600, #e1bd00); -$ionic-color-yellow-600-rgb: var(--ionic-color-yellow-600-rgb, 225, 189, 0); -$ionic-color-yellow-700: var(--ionic-color-yellow-700, #c3a400); -$ionic-color-yellow-700-rgb: var(--ionic-color-yellow-700-rgb, 195, 164, 0); -$ionic-color-yellow-800: var(--ionic-color-yellow-800, #a48a00); -$ionic-color-yellow-800-rgb: var(--ionic-color-yellow-800-rgb, 164, 138, 0); -$ionic-color-yellow-900: var(--ionic-color-yellow-900, #846f00); -$ionic-color-yellow-900-rgb: var(--ionic-color-yellow-900-rgb, 132, 111, 0); -$ionic-color-yellow-1000: var(--ionic-color-yellow-1000, #635300); -$ionic-color-yellow-1000-rgb: var(--ionic-color-yellow-1000-rgb, 99, 83, 0); -$ionic-color-yellow-1100: var(--ionic-color-yellow-1100, #423800); -$ionic-color-yellow-1100-rgb: var(--ionic-color-yellow-1100-rgb, 66, 56, 0); -$ionic-color-yellow-1200: var(--ionic-color-yellow-1200, #221d00); -$ionic-color-yellow-1200-rgb: var(--ionic-color-yellow-1200-rgb, 34, 29, 0); -$ionic-color-lime-100: var(--ionic-color-lime-100, #f3faea); -$ionic-color-lime-100-rgb: var(--ionic-color-lime-100-rgb, 243, 250, 234); -$ionic-color-lime-200: var(--ionic-color-lime-200, #eaf7db); -$ionic-color-lime-200-rgb: var(--ionic-color-lime-200-rgb, 234, 247, 219); -$ionic-color-lime-300: var(--ionic-color-lime-300, #d3efb2); -$ionic-color-lime-300-rgb: var(--ionic-color-lime-300-rgb, 211, 239, 178); -$ionic-color-lime-400: var(--ionic-color-lime-400, #bbe77d); -$ionic-color-lime-400-rgb: var(--ionic-color-lime-400-rgb, 187, 231, 125); -$ionic-color-lime-500: var(--ionic-color-lime-500, #a0df18); -$ionic-color-lime-500-rgb: var(--ionic-color-lime-500-rgb, 160, 223, 24); -$ionic-color-lime-600: var(--ionic-color-lime-600, #8dc515); -$ionic-color-lime-600-rgb: var(--ionic-color-lime-600-rgb, 141, 197, 21); -$ionic-color-lime-700: var(--ionic-color-lime-700, #7aab12); -$ionic-color-lime-700-rgb: var(--ionic-color-lime-700-rgb, 122, 171, 18); -$ionic-color-lime-800: var(--ionic-color-lime-800, #678f0f); -$ionic-color-lime-800-rgb: var(--ionic-color-lime-800-rgb, 103, 143, 15); -$ionic-color-lime-900: var(--ionic-color-lime-900, #53730c); -$ionic-color-lime-900-rgb: var(--ionic-color-lime-900-rgb, 83, 115, 12); -$ionic-color-lime-1000: var(--ionic-color-lime-1000, #3e5709); -$ionic-color-lime-1000-rgb: var(--ionic-color-lime-1000-rgb, 62, 87, 9); -$ionic-color-lime-1100: var(--ionic-color-lime-1100, #2a3a06); -$ionic-color-lime-1100-rgb: var(--ionic-color-lime-1100-rgb, 42, 58, 6); -$ionic-color-lime-1200: var(--ionic-color-lime-1200, #151e03); -$ionic-color-lime-1200-rgb: var(--ionic-color-lime-1200-rgb, 21, 30, 3); -$ionic-color-green-100: var(--ionic-color-green-100, #ebf9ec); -$ionic-color-green-100-rgb: var(--ionic-color-green-100-rgb, 235, 249, 236); -$ionic-color-green-200: var(--ionic-color-green-200, #dcf5de); -$ionic-color-green-200-rgb: var(--ionic-color-green-200-rgb, 220, 245, 222); -$ionic-color-green-300: var(--ionic-color-green-300, #b3ebb7); -$ionic-color-green-300-rgb: var(--ionic-color-green-300-rgb, 179, 235, 183); -$ionic-color-green-400: var(--ionic-color-green-400, #7fe089); -$ionic-color-green-400-rgb: var(--ionic-color-green-400-rgb, 127, 224, 137); -$ionic-color-green-500: var(--ionic-color-green-500, #23d643); -$ionic-color-green-500-rgb: var(--ionic-color-green-500-rgb, 35, 214, 67); -$ionic-color-green-600: var(--ionic-color-green-600, #1fbd3b); -$ionic-color-green-600-rgb: var(--ionic-color-green-600-rgb, 31, 189, 59); -$ionic-color-green-700: var(--ionic-color-green-700, #1ba433); -$ionic-color-green-700-rgb: var(--ionic-color-green-700-rgb, 27, 164, 51); -$ionic-color-green-800: var(--ionic-color-green-800, #178a2b); -$ionic-color-green-800-rgb: var(--ionic-color-green-800-rgb, 23, 138, 43); -$ionic-color-green-900: var(--ionic-color-green-900, #126f23); -$ionic-color-green-900-rgb: var(--ionic-color-green-900-rgb, 18, 111, 35); -$ionic-color-green-1000: var(--ionic-color-green-1000, #0e531a); -$ionic-color-green-1000-rgb: var(--ionic-color-green-1000-rgb, 14, 83, 26); -$ionic-color-green-1100: var(--ionic-color-green-1100, #093811); -$ionic-color-green-1100-rgb: var(--ionic-color-green-1100-rgb, 9, 56, 17); -$ionic-color-green-1200: var(--ionic-color-green-1200, #051d09); -$ionic-color-green-1200-rgb: var(--ionic-color-green-1200-rgb, 5, 29, 9); -$ionic-color-teal-100: var(--ionic-color-teal-100, #eaf8f5); -$ionic-color-teal-100-rgb: var(--ionic-color-teal-100-rgb, 234, 248, 245); -$ionic-color-teal-200: var(--ionic-color-teal-200, #dbf3ee); -$ionic-color-teal-200-rgb: var(--ionic-color-teal-200-rgb, 219, 243, 238); -$ionic-color-teal-300: var(--ionic-color-teal-300, #b1e7dd); -$ionic-color-teal-300-rgb: var(--ionic-color-teal-300-rgb, 177, 231, 221); -$ionic-color-teal-400: var(--ionic-color-teal-400, #7bdbca); -$ionic-color-teal-400-rgb: var(--ionic-color-teal-400-rgb, 123, 219, 202); -$ionic-color-teal-500: var(--ionic-color-teal-500, #00cfb7); -$ionic-color-teal-500-rgb: var(--ionic-color-teal-500-rgb, 0, 207, 183); -$ionic-color-teal-600: var(--ionic-color-teal-600, #00b7a2); -$ionic-color-teal-600-rgb: var(--ionic-color-teal-600-rgb, 0, 183, 162); -$ionic-color-teal-700: var(--ionic-color-teal-700, #009e8c); -$ionic-color-teal-700-rgb: var(--ionic-color-teal-700-rgb, 0, 158, 140); -$ionic-color-teal-800: var(--ionic-color-teal-800, #008576); -$ionic-color-teal-800-rgb: var(--ionic-color-teal-800-rgb, 0, 133, 118); -$ionic-color-teal-900: var(--ionic-color-teal-900, #006b5f); -$ionic-color-teal-900-rgb: var(--ionic-color-teal-900-rgb, 0, 107, 95); -$ionic-color-teal-1000: var(--ionic-color-teal-1000, #005147); -$ionic-color-teal-1000-rgb: var(--ionic-color-teal-1000-rgb, 0, 81, 71); -$ionic-color-teal-1100: var(--ionic-color-teal-1100, #003630); -$ionic-color-teal-1100-rgb: var(--ionic-color-teal-1100-rgb, 0, 54, 48); -$ionic-color-teal-1200: var(--ionic-color-teal-1200, #001c19); -$ionic-color-teal-1200-rgb: var(--ionic-color-teal-1200-rgb, 0, 28, 25); -$ionic-color-aqua-100: var(--ionic-color-aqua-100, #ebf9fe); -$ionic-color-aqua-100-rgb: var(--ionic-color-aqua-100-rgb, 235, 249, 254); -$ionic-color-aqua-200: var(--ionic-color-aqua-200, #dcf4fd); -$ionic-color-aqua-200-rgb: var(--ionic-color-aqua-200-rgb, 220, 244, 253); -$ionic-color-aqua-300: var(--ionic-color-aqua-300, #b3e9fc); -$ionic-color-aqua-300-rgb: var(--ionic-color-aqua-300-rgb, 179, 233, 252); -$ionic-color-aqua-400: var(--ionic-color-aqua-400, #80defa); -$ionic-color-aqua-400-rgb: var(--ionic-color-aqua-400-rgb, 128, 222, 250); -$ionic-color-aqua-500: var(--ionic-color-aqua-500, #27d3f9); -$ionic-color-aqua-500-rgb: var(--ionic-color-aqua-500-rgb, 39, 211, 249); -$ionic-color-aqua-600: var(--ionic-color-aqua-600, #22bbdc); -$ionic-color-aqua-600-rgb: var(--ionic-color-aqua-600-rgb, 34, 187, 220); -$ionic-color-aqua-700: var(--ionic-color-aqua-700, #1ea2bf); -$ionic-color-aqua-700-rgb: var(--ionic-color-aqua-700-rgb, 30, 162, 191); -$ionic-color-aqua-800: var(--ionic-color-aqua-800, #1988a0); -$ionic-color-aqua-800-rgb: var(--ionic-color-aqua-800-rgb, 25, 136, 160); -$ionic-color-aqua-900: var(--ionic-color-aqua-900, #146d81); -$ionic-color-aqua-900-rgb: var(--ionic-color-aqua-900-rgb, 20, 109, 129); -$ionic-color-aqua-1000: var(--ionic-color-aqua-1000, #0f5261); -$ionic-color-aqua-1000-rgb: var(--ionic-color-aqua-1000-rgb, 15, 82, 97); -$ionic-color-aqua-1100: var(--ionic-color-aqua-1100, #0a3741); -$ionic-color-aqua-1100-rgb: var(--ionic-color-aqua-1100-rgb, 10, 55, 65); -$ionic-color-aqua-1200: var(--ionic-color-aqua-1200, #051c21); -$ionic-color-aqua-1200-rgb: var(--ionic-color-aqua-1200-rgb, 5, 28, 33); -$ionic-color-blue-100: var(--ionic-color-blue-100, #f2f4fd); -$ionic-color-blue-100-rgb: var(--ionic-color-blue-100-rgb, 242, 244, 253); -$ionic-color-blue-200: var(--ionic-color-blue-200, #e9ecfc); -$ionic-color-blue-200-rgb: var(--ionic-color-blue-200-rgb, 233, 236, 252); -$ionic-color-blue-300: var(--ionic-color-blue-300, #d0d7fa); -$ionic-color-blue-300-rgb: var(--ionic-color-blue-300-rgb, 208, 215, 250); -$ionic-color-blue-400: var(--ionic-color-blue-400, #b5c0f7); -$ionic-color-blue-400-rgb: var(--ionic-color-blue-400-rgb, 181, 192, 247); -$ionic-color-blue-500: var(--ionic-color-blue-500, #94a5f4); -$ionic-color-blue-500-rgb: var(--ionic-color-blue-500-rgb, 148, 165, 244); -$ionic-color-blue-600: var(--ionic-color-blue-600, #6986f2); -$ionic-color-blue-600-rgb: var(--ionic-color-blue-600-rgb, 105, 134, 242); -$ionic-color-blue-700: var(--ionic-color-blue-700, #105cef); -$ionic-color-blue-700-rgb: var(--ionic-color-blue-700-rgb, 16, 92, 239); -$ionic-color-blue-800: var(--ionic-color-blue-800, #0f54da); -$ionic-color-blue-800-rgb: var(--ionic-color-blue-800-rgb, 15, 84, 218); -$ionic-color-blue-900: var(--ionic-color-blue-900, #0d4bc3); -$ionic-color-blue-900-rgb: var(--ionic-color-blue-900-rgb, 13, 75, 195); -$ionic-color-blue-1000: var(--ionic-color-blue-1000, #0b41a9); -$ionic-color-blue-1000-rgb: var(--ionic-color-blue-1000-rgb, 11, 65, 169); -$ionic-color-blue-1100: var(--ionic-color-blue-1100, #09358a); -$ionic-color-blue-1100-rgb: var(--ionic-color-blue-1100-rgb, 9, 53, 138); -$ionic-color-blue-1200: var(--ionic-color-blue-1200, #072561); -$ionic-color-blue-1200-rgb: var(--ionic-color-blue-1200-rgb, 7, 37, 97); -$ionic-color-indigo-100: var(--ionic-color-indigo-100, #f3f2fb); -$ionic-color-indigo-100-rgb: var(--ionic-color-indigo-100-rgb, 243, 242, 251); -$ionic-color-indigo-200: var(--ionic-color-indigo-200, #eae9f9); -$ionic-color-indigo-200-rgb: var(--ionic-color-indigo-200-rgb, 234, 233, 249); -$ionic-color-indigo-300: var(--ionic-color-indigo-300, #d3d1f2); -$ionic-color-indigo-300-rgb: var(--ionic-color-indigo-300-rgb, 211, 209, 242); -$ionic-color-indigo-400: var(--ionic-color-indigo-400, #bab5eb); -$ionic-color-indigo-400-rgb: var(--ionic-color-indigo-400-rgb, 186, 181, 235); -$ionic-color-indigo-500: var(--ionic-color-indigo-500, #9d95e4); -$ionic-color-indigo-500-rgb: var(--ionic-color-indigo-500-rgb, 157, 149, 228); -$ionic-color-indigo-600: var(--ionic-color-indigo-600, #786bdd); -$ionic-color-indigo-600-rgb: var(--ionic-color-indigo-600-rgb, 120, 107, 221); -$ionic-color-indigo-700: var(--ionic-color-indigo-700, #411bd5); -$ionic-color-indigo-700-rgb: var(--ionic-color-indigo-700-rgb, 65, 27, 213); -$ionic-color-indigo-800: var(--ionic-color-indigo-800, #3b19c3); -$ionic-color-indigo-800-rgb: var(--ionic-color-indigo-800-rgb, 59, 25, 195); -$ionic-color-indigo-900: var(--ionic-color-indigo-900, #3516ae); -$ionic-color-indigo-900-rgb: var(--ionic-color-indigo-900-rgb, 53, 22, 174); -$ionic-color-indigo-1000: var(--ionic-color-indigo-1000, #2e1397); -$ionic-color-indigo-1000-rgb: var(--ionic-color-indigo-1000-rgb, 46, 19, 151); -$ionic-color-indigo-1100: var(--ionic-color-indigo-1100, #26107b); -$ionic-color-indigo-1100-rgb: var(--ionic-color-indigo-1100-rgb, 38, 16, 123); -$ionic-color-indigo-1200: var(--ionic-color-indigo-1200, #1a0b57); -$ionic-color-indigo-1200-rgb: var(--ionic-color-indigo-1200-rgb, 26, 11, 87); -$ionic-color-violet-100: var(--ionic-color-violet-100, #f5f2fe); -$ionic-color-violet-100-rgb: var(--ionic-color-violet-100-rgb, 245, 242, 254); -$ionic-color-violet-200: var(--ionic-color-violet-200, #eee9fd); -$ionic-color-violet-200-rgb: var(--ionic-color-violet-200-rgb, 238, 233, 253); -$ionic-color-violet-300: var(--ionic-color-violet-300, #dcd1fb); -$ionic-color-violet-300-rgb: var(--ionic-color-violet-300-rgb, 220, 209, 251); -$ionic-color-violet-400: var(--ionic-color-violet-400, #c9b6f9); -$ionic-color-violet-400-rgb: var(--ionic-color-violet-400-rgb, 201, 182, 249); -$ionic-color-violet-500: var(--ionic-color-violet-500, #b396f6); -$ionic-color-violet-500-rgb: var(--ionic-color-violet-500-rgb, 179, 150, 246); -$ionic-color-violet-600: var(--ionic-color-violet-600, #9a6cf4); -$ionic-color-violet-600-rgb: var(--ionic-color-violet-600-rgb, 154, 108, 244); -$ionic-color-violet-700: var(--ionic-color-violet-700, #7c20f2); -$ionic-color-violet-700-rgb: var(--ionic-color-violet-700-rgb, 124, 32, 242); -$ionic-color-violet-800: var(--ionic-color-violet-800, #711ddd); -$ionic-color-violet-800-rgb: var(--ionic-color-violet-800-rgb, 113, 29, 221); -$ionic-color-violet-900: var(--ionic-color-violet-900, #651ac5); -$ionic-color-violet-900-rgb: var(--ionic-color-violet-900-rgb, 101, 26, 197); -$ionic-color-violet-1000: var(--ionic-color-violet-1000, #5817ab); -$ionic-color-violet-1000-rgb: var(--ionic-color-violet-1000-rgb, 88, 23, 171); -$ionic-color-violet-1100: var(--ionic-color-violet-1100, #48128c); -$ionic-color-violet-1100-rgb: var(--ionic-color-violet-1100-rgb, 72, 18, 140); -$ionic-color-violet-1200: var(--ionic-color-violet-1200, #330d63); -$ionic-color-violet-1200-rgb: var(--ionic-color-violet-1200-rgb, 51, 13, 99); -$ionic-color-purple-100: var(--ionic-color-purple-100, #f9f3fe); -$ionic-color-purple-100-rgb: var(--ionic-color-purple-100-rgb, 249, 243, 254); -$ionic-color-purple-200: var(--ionic-color-purple-200, #f5eafd); -$ionic-color-purple-200-rgb: var(--ionic-color-purple-200-rgb, 245, 234, 253); -$ionic-color-purple-300: var(--ionic-color-purple-300, #e9d3fa); -$ionic-color-purple-300-rgb: var(--ionic-color-purple-300-rgb, 233, 211, 250); -$ionic-color-purple-400: var(--ionic-color-purple-400, #deb9f8); -$ionic-color-purple-400-rgb: var(--ionic-color-purple-400-rgb, 222, 185, 248); -$ionic-color-purple-500: var(--ionic-color-purple-500, #d29bf6); -$ionic-color-purple-500-rgb: var(--ionic-color-purple-500-rgb, 210, 155, 246); -$ionic-color-purple-600: var(--ionic-color-purple-600, #c575f3); -$ionic-color-purple-600-rgb: var(--ionic-color-purple-600-rgb, 197, 117, 243); -$ionic-color-purple-700: var(--ionic-color-purple-700, #b73cf1); -$ionic-color-purple-700-rgb: var(--ionic-color-purple-700-rgb, 183, 60, 241); -$ionic-color-purple-800: var(--ionic-color-purple-800, #a737dc); -$ionic-color-purple-800-rgb: var(--ionic-color-purple-800-rgb, 167, 55, 220); -$ionic-color-purple-900: var(--ionic-color-purple-900, #9531c5); -$ionic-color-purple-900-rgb: var(--ionic-color-purple-900-rgb, 149, 49, 197); -$ionic-color-purple-1000: var(--ionic-color-purple-1000, #812aaa); -$ionic-color-purple-1000-rgb: var(--ionic-color-purple-1000-rgb, 129, 42, 170); -$ionic-color-purple-1100: var(--ionic-color-purple-1100, #6a238b); -$ionic-color-purple-1100-rgb: var(--ionic-color-purple-1100-rgb, 106, 35, 139); -$ionic-color-purple-1200: var(--ionic-color-purple-1200, #4b1862); -$ionic-color-purple-1200-rgb: var(--ionic-color-purple-1200-rgb, 75, 24, 98); -$ionic-color-magenta-100: var(--ionic-color-magenta-100, #fdf3fb); -$ionic-color-magenta-100-rgb: var(--ionic-color-magenta-100-rgb, 253, 243, 251); -$ionic-color-magenta-200: var(--ionic-color-magenta-200, #fcebf8); -$ionic-color-magenta-200-rgb: var(--ionic-color-magenta-200-rgb, 252, 235, 248); -$ionic-color-magenta-300: var(--ionic-color-magenta-300, #f9d4f1); -$ionic-color-magenta-300-rgb: var(--ionic-color-magenta-300-rgb, 249, 212, 241); -$ionic-color-magenta-400: var(--ionic-color-magenta-400, #f6bcea); -$ionic-color-magenta-400-rgb: var(--ionic-color-magenta-400-rgb, 246, 188, 234); -$ionic-color-magenta-500: var(--ionic-color-magenta-500, #f39fe3); -$ionic-color-magenta-500-rgb: var(--ionic-color-magenta-500-rgb, 243, 159, 227); -$ionic-color-magenta-600: var(--ionic-color-magenta-600, #f07cdb); -$ionic-color-magenta-600-rgb: var(--ionic-color-magenta-600-rgb, 240, 124, 219); -$ionic-color-magenta-700: var(--ionic-color-magenta-700, #ed4ad3); -$ionic-color-magenta-700-rgb: var(--ionic-color-magenta-700-rgb, 237, 74, 211); -$ionic-color-magenta-800: var(--ionic-color-magenta-800, #d844c1); -$ionic-color-magenta-800-rgb: var(--ionic-color-magenta-800-rgb, 216, 68, 193); -$ionic-color-magenta-900: var(--ionic-color-magenta-900, #c13cac); -$ionic-color-magenta-900-rgb: var(--ionic-color-magenta-900-rgb, 193, 60, 172); -$ionic-color-magenta-1000: var(--ionic-color-magenta-1000, #a83495); -$ionic-color-magenta-1000-rgb: var(--ionic-color-magenta-1000-rgb, 168, 52, 149); -$ionic-color-magenta-1100: var(--ionic-color-magenta-1100, #892b7a); -$ionic-color-magenta-1100-rgb: var(--ionic-color-magenta-1100-rgb, 137, 43, 122); -$ionic-color-magenta-1200: var(--ionic-color-magenta-1200, #611e56); -$ionic-color-magenta-1200-rgb: var(--ionic-color-magenta-1200-rgb, 97, 30, 86); -$ionic-color-pink-100: var(--ionic-color-pink-100, #fef3f5); -$ionic-color-pink-100-rgb: var(--ionic-color-pink-100-rgb, 254, 243, 245); -$ionic-color-pink-200: var(--ionic-color-pink-200, #fdeaee); -$ionic-color-pink-200-rgb: var(--ionic-color-pink-200-rgb, 253, 234, 238); -$ionic-color-pink-300: var(--ionic-color-pink-300, #fad3dc); -$ionic-color-pink-300-rgb: var(--ionic-color-pink-300-rgb, 250, 211, 220); -$ionic-color-pink-400: var(--ionic-color-pink-400, #f8b9c9); -$ionic-color-pink-400-rgb: var(--ionic-color-pink-400-rgb, 248, 185, 201); -$ionic-color-pink-500: var(--ionic-color-pink-500, #f69bb3); -$ionic-color-pink-500-rgb: var(--ionic-color-pink-500-rgb, 246, 155, 179); -$ionic-color-pink-600: var(--ionic-color-pink-600, #f3759a); -$ionic-color-pink-600-rgb: var(--ionic-color-pink-600-rgb, 243, 117, 154); -$ionic-color-pink-700: var(--ionic-color-pink-700, #f13b7d); -$ionic-color-pink-700-rgb: var(--ionic-color-pink-700-rgb, 241, 59, 125); -$ionic-color-pink-800: var(--ionic-color-pink-800, #dc3672); -$ionic-color-pink-800-rgb: var(--ionic-color-pink-800-rgb, 220, 54, 114); -$ionic-color-pink-900: var(--ionic-color-pink-900, #c53066); -$ionic-color-pink-900-rgb: var(--ionic-color-pink-900-rgb, 197, 48, 102); -$ionic-color-pink-1000: var(--ionic-color-pink-1000, #aa2a58); -$ionic-color-pink-1000-rgb: var(--ionic-color-pink-1000-rgb, 170, 42, 88); -$ionic-color-pink-1100: var(--ionic-color-pink-1100, #8b2248); -$ionic-color-pink-1100-rgb: var(--ionic-color-pink-1100-rgb, 139, 34, 72); -$ionic-color-pink-1200: var(--ionic-color-pink-1200, #621833); -$ionic-color-pink-1200-rgb: var(--ionic-color-pink-1200-rgb, 98, 24, 51); -$ionic-color-primary-100: var(--ionic-color-primary-100, #f2f4fd); -$ionic-color-primary-100-rgb: var(--ionic-color-primary-100-rgb, 242, 244, 253); -$ionic-color-primary-200: var(--ionic-color-primary-200, #e9ecfc); -$ionic-color-primary-200-rgb: var(--ionic-color-primary-200-rgb, 233, 236, 252); -$ionic-color-primary-300: var(--ionic-color-primary-300, #d0d7fa); -$ionic-color-primary-300-rgb: var(--ionic-color-primary-300-rgb, 208, 215, 250); -$ionic-color-primary-400: var(--ionic-color-primary-400, #b5c0f7); -$ionic-color-primary-400-rgb: var(--ionic-color-primary-400-rgb, 181, 192, 247); -$ionic-color-primary-500: var(--ionic-color-primary-500, #94a5f4); -$ionic-color-primary-500-rgb: var(--ionic-color-primary-500-rgb, 148, 165, 244); -$ionic-color-primary-600: var(--ionic-color-primary-600, #6986f2); -$ionic-color-primary-600-rgb: var(--ionic-color-primary-600-rgb, 105, 134, 242); -$ionic-color-primary-700: var(--ionic-color-primary-700, #105cef); -$ionic-color-primary-700-rgb: var(--ionic-color-primary-700-rgb, 16, 92, 239); -$ionic-color-primary-800: var(--ionic-color-primary-800, #0f54da); -$ionic-color-primary-800-rgb: var(--ionic-color-primary-800-rgb, 15, 84, 218); -$ionic-color-primary-900: var(--ionic-color-primary-900, #0d4bc3); -$ionic-color-primary-900-rgb: var(--ionic-color-primary-900-rgb, 13, 75, 195); -$ionic-color-primary-1000: var(--ionic-color-primary-1000, #0b41a9); -$ionic-color-primary-1000-rgb: var(--ionic-color-primary-1000-rgb, 11, 65, 169); -$ionic-color-primary-1100: var(--ionic-color-primary-1100, #09358a); -$ionic-color-primary-1100-rgb: var(--ionic-color-primary-1100-rgb, 9, 53, 138); -$ionic-color-primary-1200: var(--ionic-color-primary-1200, #072561); -$ionic-color-primary-1200-rgb: var(--ionic-color-primary-1200-rgb, 7, 37, 97); -$ionic-color-primary-base: var(--ionic-color-primary-base, #105cef); -$ionic-color-primary-base-rgb: var(--ionic-color-primary-base-rgb, 16, 92, 239); -$ionic-color-info-100: var(--ionic-color-info-100, #ebf9fe); -$ionic-color-info-100-rgb: var(--ionic-color-info-100-rgb, 235, 249, 254); -$ionic-color-info-200: var(--ionic-color-info-200, #dcf4fd); -$ionic-color-info-200-rgb: var(--ionic-color-info-200-rgb, 220, 244, 253); -$ionic-color-info-300: var(--ionic-color-info-300, #b3e9fc); -$ionic-color-info-300-rgb: var(--ionic-color-info-300-rgb, 179, 233, 252); -$ionic-color-info-400: var(--ionic-color-info-400, #80defa); -$ionic-color-info-400-rgb: var(--ionic-color-info-400-rgb, 128, 222, 250); -$ionic-color-info-500: var(--ionic-color-info-500, #27d3f9); -$ionic-color-info-500-rgb: var(--ionic-color-info-500-rgb, 39, 211, 249); -$ionic-color-info-600: var(--ionic-color-info-600, #22bbdc); -$ionic-color-info-600-rgb: var(--ionic-color-info-600-rgb, 34, 187, 220); -$ionic-color-info-700: var(--ionic-color-info-700, #1ea2bf); -$ionic-color-info-700-rgb: var(--ionic-color-info-700-rgb, 30, 162, 191); -$ionic-color-info-800: var(--ionic-color-info-800, #1988a0); -$ionic-color-info-800-rgb: var(--ionic-color-info-800-rgb, 25, 136, 160); -$ionic-color-info-900: var(--ionic-color-info-900, #146d81); -$ionic-color-info-900-rgb: var(--ionic-color-info-900-rgb, 20, 109, 129); -$ionic-color-info-1000: var(--ionic-color-info-1000, #0f5261); -$ionic-color-info-1000-rgb: var(--ionic-color-info-1000-rgb, 15, 82, 97); -$ionic-color-info-1100: var(--ionic-color-info-1100, #0a3741); -$ionic-color-info-1100-rgb: var(--ionic-color-info-1100-rgb, 10, 55, 65); -$ionic-color-info-1200: var(--ionic-color-info-1200, #051c21); -$ionic-color-info-1200-rgb: var(--ionic-color-info-1200-rgb, 5, 28, 33); -$ionic-color-info-base: var(--ionic-color-info-base, #1ea2bf); -$ionic-color-info-base-rgb: var(--ionic-color-info-base-rgb, 30, 162, 191); -$ionic-color-warning-100: var(--ionic-color-warning-100, #fff1ea); -$ionic-color-warning-100-rgb: var(--ionic-color-warning-100-rgb, 255, 241, 234); -$ionic-color-warning-200: var(--ionic-color-warning-200, #ffe8db); -$ionic-color-warning-200-rgb: var(--ionic-color-warning-200-rgb, 255, 232, 219); -$ionic-color-warning-300: var(--ionic-color-warning-300, #ffcfb1); -$ionic-color-warning-300-rgb: var(--ionic-color-warning-300-rgb, 255, 207, 177); -$ionic-color-warning-400: var(--ionic-color-warning-400, #ffb37b); -$ionic-color-warning-400-rgb: var(--ionic-color-warning-400-rgb, 255, 179, 123); -$ionic-color-warning-500: var(--ionic-color-warning-500, #ff9400); -$ionic-color-warning-500-rgb: var(--ionic-color-warning-500-rgb, 255, 148, 0); -$ionic-color-warning-600: var(--ionic-color-warning-600, #e18300); -$ionic-color-warning-600-rgb: var(--ionic-color-warning-600-rgb, 225, 131, 0); -$ionic-color-warning-700: var(--ionic-color-warning-700, #c37100); -$ionic-color-warning-700-rgb: var(--ionic-color-warning-700-rgb, 195, 113, 0); -$ionic-color-warning-800: var(--ionic-color-warning-800, #a45f00); -$ionic-color-warning-800-rgb: var(--ionic-color-warning-800-rgb, 164, 95, 0); -$ionic-color-warning-900: var(--ionic-color-warning-900, #844d00); -$ionic-color-warning-900-rgb: var(--ionic-color-warning-900-rgb, 132, 77, 0); -$ionic-color-warning-1000: var(--ionic-color-warning-1000, #633a00); -$ionic-color-warning-1000-rgb: var(--ionic-color-warning-1000-rgb, 99, 58, 0); -$ionic-color-warning-1100: var(--ionic-color-warning-1100, #422700); -$ionic-color-warning-1100-rgb: var(--ionic-color-warning-1100-rgb, 66, 39, 0); -$ionic-color-warning-1200: var(--ionic-color-warning-1200, #221400); -$ionic-color-warning-1200-rgb: var(--ionic-color-warning-1200-rgb, 34, 20, 0); -$ionic-color-warning-base: var(--ionic-color-warning-base, #c37100); -$ionic-color-warning-base-rgb: var(--ionic-color-warning-base-rgb, 195, 113, 0); -$ionic-color-danger-100: var(--ionic-color-danger-100, #feeded); -$ionic-color-danger-100-rgb: var(--ionic-color-danger-100-rgb, 254, 237, 237); -$ionic-color-danger-200: var(--ionic-color-danger-200, #fde1e1); -$ionic-color-danger-200-rgb: var(--ionic-color-danger-200-rgb, 253, 225, 225); -$ionic-color-danger-300: var(--ionic-color-danger-300, #fcc1c1); -$ionic-color-danger-300-rgb: var(--ionic-color-danger-300-rgb, 252, 193, 193); -$ionic-color-danger-400: var(--ionic-color-danger-400, #faa1a1); -$ionic-color-danger-400-rgb: var(--ionic-color-danger-400-rgb, 250, 161, 161); -$ionic-color-danger-500: var(--ionic-color-danger-500, #f97d7d); -$ionic-color-danger-500-rgb: var(--ionic-color-danger-500-rgb, 249, 125, 125); -$ionic-color-danger-600: var(--ionic-color-danger-600, #f85151); -$ionic-color-danger-600-rgb: var(--ionic-color-danger-600-rgb, 248, 81, 81); -$ionic-color-danger-700: var(--ionic-color-danger-700, #e52929); -$ionic-color-danger-700-rgb: var(--ionic-color-danger-700-rgb, 229, 41, 41); -$ionic-color-danger-800: var(--ionic-color-danger-800, #bf2222); -$ionic-color-danger-800-rgb: var(--ionic-color-danger-800-rgb, 191, 34, 34); -$ionic-color-danger-900: var(--ionic-color-danger-900, #991b1b); -$ionic-color-danger-900-rgb: var(--ionic-color-danger-900-rgb, 153, 27, 27); -$ionic-color-danger-1000: var(--ionic-color-danger-1000, #761515); -$ionic-color-danger-1000-rgb: var(--ionic-color-danger-1000-rgb, 118, 21, 21); -$ionic-color-danger-1100: var(--ionic-color-danger-1100, #540f0f); -$ionic-color-danger-1100-rgb: var(--ionic-color-danger-1100-rgb, 84, 15, 15); -$ionic-color-danger-1200: var(--ionic-color-danger-1200, #330909); -$ionic-color-danger-1200-rgb: var(--ionic-color-danger-1200-rgb, 51, 9, 9); -$ionic-color-danger-base: var(--ionic-color-danger-base, #e52929); -$ionic-color-danger-base-rgb: var(--ionic-color-danger-base-rgb, 229, 41, 41); -$ionic-color-success-100: var(--ionic-color-success-100, #ebf9ec); -$ionic-color-success-100-rgb: var(--ionic-color-success-100-rgb, 235, 249, 236); -$ionic-color-success-200: var(--ionic-color-success-200, #dcf5de); -$ionic-color-success-200-rgb: var(--ionic-color-success-200-rgb, 220, 245, 222); -$ionic-color-success-300: var(--ionic-color-success-300, #b3ebb7); -$ionic-color-success-300-rgb: var(--ionic-color-success-300-rgb, 179, 235, 183); -$ionic-color-success-400: var(--ionic-color-success-400, #7fe089); -$ionic-color-success-400-rgb: var(--ionic-color-success-400-rgb, 127, 224, 137); -$ionic-color-success-500: var(--ionic-color-success-500, #23d643); -$ionic-color-success-500-rgb: var(--ionic-color-success-500-rgb, 35, 214, 67); -$ionic-color-success-600: var(--ionic-color-success-600, #1fbd3b); -$ionic-color-success-600-rgb: var(--ionic-color-success-600-rgb, 31, 189, 59); -$ionic-color-success-700: var(--ionic-color-success-700, #1ba433); -$ionic-color-success-700-rgb: var(--ionic-color-success-700-rgb, 27, 164, 51); -$ionic-color-success-800: var(--ionic-color-success-800, #178a2b); -$ionic-color-success-800-rgb: var(--ionic-color-success-800-rgb, 23, 138, 43); -$ionic-color-success-900: var(--ionic-color-success-900, #126f23); -$ionic-color-success-900-rgb: var(--ionic-color-success-900-rgb, 18, 111, 35); -$ionic-color-success-1000: var(--ionic-color-success-1000, #0e531a); -$ionic-color-success-1000-rgb: var(--ionic-color-success-1000-rgb, 14, 83, 26); -$ionic-color-success-1100: var(--ionic-color-success-1100, #093811); -$ionic-color-success-1100-rgb: var(--ionic-color-success-1100-rgb, 9, 56, 17); -$ionic-color-success-1200: var(--ionic-color-success-1200, #051d09); -$ionic-color-success-1200-rgb: var(--ionic-color-success-1200-rgb, 5, 29, 9); -$ionic-color-success-base: var(--ionic-color-success-base, #1ba433); -$ionic-color-success-base-rgb: var(--ionic-color-success-base-rgb, 27, 164, 51); -$ionic-z-index-0: var(--ionic-z-index-0, 0); -$ionic-z-index-1: var(--ionic-z-index-1, 100); -$ionic-z-index-2: var(--ionic-z-index-2, 200); -$ionic-z-index-3: var(--ionic-z-index-3, 300); -$ionic-z-index-4: var(--ionic-z-index-4, 400); -$ionic-z-index-500: var(--ionic-z-index-500, 500); -$ionic-z-index-bottom: var(--ionic-z-index-bottom, -99999); -$ionic-z-index-top: var(--ionic-z-index-top, 99999); -$ionic-scale-0: var(--ionic-scale-0, 0px); -$ionic-scale-100: var(--ionic-scale-100, 4px); -$ionic-scale-150: var(--ionic-scale-150, 6px); -$ionic-scale-200: var(--ionic-scale-200, 8px); -$ionic-scale-250: var(--ionic-scale-250, 10px); -$ionic-scale-300: var(--ionic-scale-300, 12px); -$ionic-scale-400: var(--ionic-scale-400, 16px); -$ionic-scale-500: var(--ionic-scale-500, 20px); -$ionic-scale-600: var(--ionic-scale-600, 24px); -$ionic-scale-700: var(--ionic-scale-700, 28px); -$ionic-scale-800: var(--ionic-scale-800, 32px); -$ionic-scale-850: var(--ionic-scale-850, 34px); -$ionic-scale-900: var(--ionic-scale-900, 36px); -$ionic-scale-1000: var(--ionic-scale-1000, 40px); -$ionic-scale-1100: var(--ionic-scale-1100, 44px); -$ionic-scale-1200: var(--ionic-scale-1200, 48px); -$ionic-scale-1400: var(--ionic-scale-1400, 56px); -$ionic-scale-1600: var(--ionic-scale-1600, 64px); -$ionic-scale-1800: var(--ionic-scale-1800, 72px); -$ionic-scale-2000: var(--ionic-scale-2000, 80px); -$ionic-scale-2400: var(--ionic-scale-2400, 96px); -$ionic-scale-2800: var(--ionic-scale-2800, 112px); -$ionic-scale-3200: var(--ionic-scale-3200, 128px); -$ionic-scale-3400: var(--ionic-scale-3400, 136px); -$ionic-scale-3600: var(--ionic-scale-3600, 144px); -$ionic-scale-4000: var(--ionic-scale-4000, 160px); -$ionic-scale-5000: var(--ionic-scale-5000, 200px); -$ionic-scale-6200: var(--ionic-scale-6200, 248px); -$ionic-scale-7400: var(--ionic-scale-7400, 296px); -$ionic-scale-9000: var(--ionic-scale-9000, 360px); -$ionic-scale-025: var(--ionic-scale-025, 1px); -$ionic-scale-050: var(--ionic-scale-050, 2px); -$ionic-scale-075: var(--ionic-scale-075, 3px); -$ionic-font-family: var(--ionic-font-family, "Inter", sans-serif); -$ionic-state-focus-0: var(--ionic-state-focus-0, none); -$ionic-state-focus-1: var(--ionic-state-focus-1, #9ec4fd); -$ionic-state-focus-1-rgb: var(--ionic-state-focus-1-rgb, 158, 196, 253); -$ionic-state-focus-2: var(--ionic-state-focus-2, #ffafaf); -$ionic-state-focus-2-rgb: var(--ionic-state-focus-2-rgb, 255, 175, 175); -$ionic-state-disabled: var(--ionic-state-disabled, rgba(255, 255, 255, 0.6)); -$ionic-state-hover: var(--ionic-state-hover, rgba(36, 36, 36, 0.04)); -$ionic-state-pressed: var(--ionic-state-pressed, rgba(36, 36, 36, 0.08)); +$ion-semantics-primary-100: var(--ion-semantics-primary-100, #f2f4fd); +$ion-semantics-primary-100-rgb: var(--ion-semantics-primary-100-rgb, 242, 244, 253); +$ion-semantics-primary-200: var(--ion-semantics-primary-200, #e9ecfc); +$ion-semantics-primary-200-rgb: var(--ion-semantics-primary-200-rgb, 233, 236, 252); +$ion-semantics-primary-300: var(--ion-semantics-primary-300, #d0d7fa); +$ion-semantics-primary-300-rgb: var(--ion-semantics-primary-300-rgb, 208, 215, 250); +$ion-semantics-primary-400: var(--ion-semantics-primary-400, #b5c0f7); +$ion-semantics-primary-400-rgb: var(--ion-semantics-primary-400-rgb, 181, 192, 247); +$ion-semantics-primary-500: var(--ion-semantics-primary-500, #94a5f4); +$ion-semantics-primary-500-rgb: var(--ion-semantics-primary-500-rgb, 148, 165, 244); +$ion-semantics-primary-600: var(--ion-semantics-primary-600, #6986f2); +$ion-semantics-primary-600-rgb: var(--ion-semantics-primary-600-rgb, 105, 134, 242); +$ion-semantics-primary-700: var(--ion-semantics-primary-700, #105cef); +$ion-semantics-primary-700-rgb: var(--ion-semantics-primary-700-rgb, 16, 92, 239); +$ion-semantics-primary-800: var(--ion-semantics-primary-800, #0f54da); +$ion-semantics-primary-800-rgb: var(--ion-semantics-primary-800-rgb, 15, 84, 218); +$ion-semantics-primary-900: var(--ion-semantics-primary-900, #0d4bc3); +$ion-semantics-primary-900-rgb: var(--ion-semantics-primary-900-rgb, 13, 75, 195); +$ion-semantics-primary-1000: var(--ion-semantics-primary-1000, #0b41a9); +$ion-semantics-primary-1000-rgb: var(--ion-semantics-primary-1000-rgb, 11, 65, 169); +$ion-semantics-primary-1100: var(--ion-semantics-primary-1100, #09358a); +$ion-semantics-primary-1100-rgb: var(--ion-semantics-primary-1100-rgb, 9, 53, 138); +$ion-semantics-primary-1200: var(--ion-semantics-primary-1200, #072561); +$ion-semantics-primary-1200-rgb: var(--ion-semantics-primary-1200-rgb, 7, 37, 97); +$ion-semantics-primary-base: var(--ion-semantics-primary-base, #105cef); +$ion-semantics-primary-base-rgb: var(--ion-semantics-primary-base-rgb, 16, 92, 239); +$ion-semantics-info-100: var(--ion-semantics-info-100, #ebf9fe); +$ion-semantics-info-100-rgb: var(--ion-semantics-info-100-rgb, 235, 249, 254); +$ion-semantics-info-200: var(--ion-semantics-info-200, #dcf4fd); +$ion-semantics-info-200-rgb: var(--ion-semantics-info-200-rgb, 220, 244, 253); +$ion-semantics-info-300: var(--ion-semantics-info-300, #b3e9fc); +$ion-semantics-info-300-rgb: var(--ion-semantics-info-300-rgb, 179, 233, 252); +$ion-semantics-info-400: var(--ion-semantics-info-400, #80defa); +$ion-semantics-info-400-rgb: var(--ion-semantics-info-400-rgb, 128, 222, 250); +$ion-semantics-info-500: var(--ion-semantics-info-500, #27d3f9); +$ion-semantics-info-500-rgb: var(--ion-semantics-info-500-rgb, 39, 211, 249); +$ion-semantics-info-600: var(--ion-semantics-info-600, #22bbdc); +$ion-semantics-info-600-rgb: var(--ion-semantics-info-600-rgb, 34, 187, 220); +$ion-semantics-info-700: var(--ion-semantics-info-700, #1ea2bf); +$ion-semantics-info-700-rgb: var(--ion-semantics-info-700-rgb, 30, 162, 191); +$ion-semantics-info-800: var(--ion-semantics-info-800, #1988a0); +$ion-semantics-info-800-rgb: var(--ion-semantics-info-800-rgb, 25, 136, 160); +$ion-semantics-info-900: var(--ion-semantics-info-900, #146d81); +$ion-semantics-info-900-rgb: var(--ion-semantics-info-900-rgb, 20, 109, 129); +$ion-semantics-info-1000: var(--ion-semantics-info-1000, #0f5261); +$ion-semantics-info-1000-rgb: var(--ion-semantics-info-1000-rgb, 15, 82, 97); +$ion-semantics-info-1100: var(--ion-semantics-info-1100, #0a3741); +$ion-semantics-info-1100-rgb: var(--ion-semantics-info-1100-rgb, 10, 55, 65); +$ion-semantics-info-1200: var(--ion-semantics-info-1200, #051c21); +$ion-semantics-info-1200-rgb: var(--ion-semantics-info-1200-rgb, 5, 28, 33); +$ion-semantics-info-base: var(--ion-semantics-info-base, #1ea2bf); +$ion-semantics-info-base-rgb: var(--ion-semantics-info-base-rgb, 30, 162, 191); +$ion-semantics-success-100: var(--ion-semantics-success-100, #ebf9ec); +$ion-semantics-success-100-rgb: var(--ion-semantics-success-100-rgb, 235, 249, 236); +$ion-semantics-success-200: var(--ion-semantics-success-200, #dcf5de); +$ion-semantics-success-200-rgb: var(--ion-semantics-success-200-rgb, 220, 245, 222); +$ion-semantics-success-300: var(--ion-semantics-success-300, #b3ebb7); +$ion-semantics-success-300-rgb: var(--ion-semantics-success-300-rgb, 179, 235, 183); +$ion-semantics-success-400: var(--ion-semantics-success-400, #7fe089); +$ion-semantics-success-400-rgb: var(--ion-semantics-success-400-rgb, 127, 224, 137); +$ion-semantics-success-500: var(--ion-semantics-success-500, #23d643); +$ion-semantics-success-500-rgb: var(--ion-semantics-success-500-rgb, 35, 214, 67); +$ion-semantics-success-600: var(--ion-semantics-success-600, #1fbd3b); +$ion-semantics-success-600-rgb: var(--ion-semantics-success-600-rgb, 31, 189, 59); +$ion-semantics-success-700: var(--ion-semantics-success-700, #1ba433); +$ion-semantics-success-700-rgb: var(--ion-semantics-success-700-rgb, 27, 164, 51); +$ion-semantics-success-800: var(--ion-semantics-success-800, #178a2b); +$ion-semantics-success-800-rgb: var(--ion-semantics-success-800-rgb, 23, 138, 43); +$ion-semantics-success-900: var(--ion-semantics-success-900, #126f23); +$ion-semantics-success-900-rgb: var(--ion-semantics-success-900-rgb, 18, 111, 35); +$ion-semantics-success-1000: var(--ion-semantics-success-1000, #0e531a); +$ion-semantics-success-1000-rgb: var(--ion-semantics-success-1000-rgb, 14, 83, 26); +$ion-semantics-success-1100: var(--ion-semantics-success-1100, #093811); +$ion-semantics-success-1100-rgb: var(--ion-semantics-success-1100-rgb, 9, 56, 17); +$ion-semantics-success-1200: var(--ion-semantics-success-1200, #051d09); +$ion-semantics-success-1200-rgb: var(--ion-semantics-success-1200-rgb, 5, 29, 9); +$ion-semantics-success-base: var(--ion-semantics-success-base, #1ba433); +$ion-semantics-success-base-rgb: var(--ion-semantics-success-base-rgb, 27, 164, 51); +$ion-semantics-danger-100: var(--ion-semantics-danger-100, #feeded); +$ion-semantics-danger-100-rgb: var(--ion-semantics-danger-100-rgb, 254, 237, 237); +$ion-semantics-danger-200: var(--ion-semantics-danger-200, #fde1e1); +$ion-semantics-danger-200-rgb: var(--ion-semantics-danger-200-rgb, 253, 225, 225); +$ion-semantics-danger-300: var(--ion-semantics-danger-300, #fcc1c1); +$ion-semantics-danger-300-rgb: var(--ion-semantics-danger-300-rgb, 252, 193, 193); +$ion-semantics-danger-400: var(--ion-semantics-danger-400, #faa1a1); +$ion-semantics-danger-400-rgb: var(--ion-semantics-danger-400-rgb, 250, 161, 161); +$ion-semantics-danger-500: var(--ion-semantics-danger-500, #f97d7d); +$ion-semantics-danger-500-rgb: var(--ion-semantics-danger-500-rgb, 249, 125, 125); +$ion-semantics-danger-600: var(--ion-semantics-danger-600, #f85151); +$ion-semantics-danger-600-rgb: var(--ion-semantics-danger-600-rgb, 248, 81, 81); +$ion-semantics-danger-700: var(--ion-semantics-danger-700, #e52929); +$ion-semantics-danger-700-rgb: var(--ion-semantics-danger-700-rgb, 229, 41, 41); +$ion-semantics-danger-800: var(--ion-semantics-danger-800, #bf2222); +$ion-semantics-danger-800-rgb: var(--ion-semantics-danger-800-rgb, 191, 34, 34); +$ion-semantics-danger-900: var(--ion-semantics-danger-900, #991b1b); +$ion-semantics-danger-900-rgb: var(--ion-semantics-danger-900-rgb, 153, 27, 27); +$ion-semantics-danger-1000: var(--ion-semantics-danger-1000, #761515); +$ion-semantics-danger-1000-rgb: var(--ion-semantics-danger-1000-rgb, 118, 21, 21); +$ion-semantics-danger-1100: var(--ion-semantics-danger-1100, #540f0f); +$ion-semantics-danger-1100-rgb: var(--ion-semantics-danger-1100-rgb, 84, 15, 15); +$ion-semantics-danger-1200: var(--ion-semantics-danger-1200, #330909); +$ion-semantics-danger-1200-rgb: var(--ion-semantics-danger-1200-rgb, 51, 9, 9); +$ion-semantics-danger-base: var(--ion-semantics-danger-base, #e52929); +$ion-semantics-danger-base-rgb: var(--ion-semantics-danger-base-rgb, 229, 41, 41); +$ion-semantics-warning-100: var(--ion-semantics-warning-100, #fff1ea); +$ion-semantics-warning-100-rgb: var(--ion-semantics-warning-100-rgb, 255, 241, 234); +$ion-semantics-warning-200: var(--ion-semantics-warning-200, #ffe8db); +$ion-semantics-warning-200-rgb: var(--ion-semantics-warning-200-rgb, 255, 232, 219); +$ion-semantics-warning-300: var(--ion-semantics-warning-300, #ffcfb1); +$ion-semantics-warning-300-rgb: var(--ion-semantics-warning-300-rgb, 255, 207, 177); +$ion-semantics-warning-400: var(--ion-semantics-warning-400, #ffb37b); +$ion-semantics-warning-400-rgb: var(--ion-semantics-warning-400-rgb, 255, 179, 123); +$ion-semantics-warning-500: var(--ion-semantics-warning-500, #ff9400); +$ion-semantics-warning-500-rgb: var(--ion-semantics-warning-500-rgb, 255, 148, 0); +$ion-semantics-warning-600: var(--ion-semantics-warning-600, #e18300); +$ion-semantics-warning-600-rgb: var(--ion-semantics-warning-600-rgb, 225, 131, 0); +$ion-semantics-warning-700: var(--ion-semantics-warning-700, #c37100); +$ion-semantics-warning-700-rgb: var(--ion-semantics-warning-700-rgb, 195, 113, 0); +$ion-semantics-warning-800: var(--ion-semantics-warning-800, #a45f00); +$ion-semantics-warning-800-rgb: var(--ion-semantics-warning-800-rgb, 164, 95, 0); +$ion-semantics-warning-900: var(--ion-semantics-warning-900, #844d00); +$ion-semantics-warning-900-rgb: var(--ion-semantics-warning-900-rgb, 132, 77, 0); +$ion-semantics-warning-1000: var(--ion-semantics-warning-1000, #633a00); +$ion-semantics-warning-1000-rgb: var(--ion-semantics-warning-1000-rgb, 99, 58, 0); +$ion-semantics-warning-1100: var(--ion-semantics-warning-1100, #422700); +$ion-semantics-warning-1100-rgb: var(--ion-semantics-warning-1100-rgb, 66, 39, 0); +$ion-semantics-warning-1200: var(--ion-semantics-warning-1200, #221400); +$ion-semantics-warning-1200-rgb: var(--ion-semantics-warning-1200-rgb, 34, 20, 0); +$ion-semantics-warning-base: var(--ion-semantics-warning-base, #c37100); +$ion-semantics-warning-base-rgb: var(--ion-semantics-warning-base-rgb, 195, 113, 0); +$ion-bg-primary-base-default: var(--ion-bg-primary-base-default, #105cef); +$ion-bg-primary-base-default-rgb: var(--ion-bg-primary-base-default-rgb, 16, 92, 239); +$ion-bg-primary-base-press: var(--ion-bg-primary-base-press, #0d4bc3); +$ion-bg-primary-base-press-rgb: var(--ion-bg-primary-base-press-rgb, 13, 75, 195); +$ion-bg-primary-subtle-default: var(--ion-bg-primary-subtle-default, #f2f4fd); +$ion-bg-primary-subtle-default-rgb: var(--ion-bg-primary-subtle-default-rgb, 242, 244, 253); +$ion-bg-primary-subtle-press: var(--ion-bg-primary-subtle-press, #d0d7fa); +$ion-bg-primary-subtle-press-rgb: var(--ion-bg-primary-subtle-press-rgb, 208, 215, 250); +$ion-bg-danger-base-default: var(--ion-bg-danger-base-default, #bf2222); +$ion-bg-danger-base-default-rgb: var(--ion-bg-danger-base-default-rgb, 191, 34, 34); +$ion-bg-danger-base-press: var(--ion-bg-danger-base-press, #761515); +$ion-bg-danger-base-press-rgb: var(--ion-bg-danger-base-press-rgb, 118, 21, 21); +$ion-bg-danger-subtle-default: var(--ion-bg-danger-subtle-default, #feeded); +$ion-bg-danger-subtle-default-rgb: var(--ion-bg-danger-subtle-default-rgb, 254, 237, 237); +$ion-bg-danger-subtle-press: var(--ion-bg-danger-subtle-press, #fcc1c1); +$ion-bg-danger-subtle-press-rgb: var(--ion-bg-danger-subtle-press-rgb, 252, 193, 193); +$ion-bg-success-base-default: var(--ion-bg-success-base-default, #126f23); +$ion-bg-success-base-default-rgb: var(--ion-bg-success-base-default-rgb, 18, 111, 35); +$ion-bg-success-base-press: var(--ion-bg-success-base-press, #093811); +$ion-bg-success-base-press-rgb: var(--ion-bg-success-base-press-rgb, 9, 56, 17); +$ion-bg-success-subtle-default: var(--ion-bg-success-subtle-default, #ebf9ec); +$ion-bg-success-subtle-default-rgb: var(--ion-bg-success-subtle-default-rgb, 235, 249, 236); +$ion-bg-success-subtle-press: var(--ion-bg-success-subtle-press, #b3ebb7); +$ion-bg-success-subtle-press-rgb: var(--ion-bg-success-subtle-press-rgb, 179, 235, 183); +$ion-bg-info-base-default: var(--ion-bg-info-base-default, #146d81); +$ion-bg-info-base-default-rgb: var(--ion-bg-info-base-default-rgb, 20, 109, 129); +$ion-bg-info-base-press: var(--ion-bg-info-base-press, #0a3741); +$ion-bg-info-base-press-rgb: var(--ion-bg-info-base-press-rgb, 10, 55, 65); +$ion-bg-info-subtle-default: var(--ion-bg-info-subtle-default, #ebf9fe); +$ion-bg-info-subtle-default-rgb: var(--ion-bg-info-subtle-default-rgb, 235, 249, 254); +$ion-bg-info-subtle-press: var(--ion-bg-info-subtle-press, #b3e9fc); +$ion-bg-info-subtle-press-rgb: var(--ion-bg-info-subtle-press-rgb, 179, 233, 252); +$ion-bg-warning-base-default: var(--ion-bg-warning-base-default, #a45f00); +$ion-bg-warning-base-default-rgb: var(--ion-bg-warning-base-default-rgb, 164, 95, 0); +$ion-bg-warning-base-press: var(--ion-bg-warning-base-press, #633a00); +$ion-bg-warning-base-press-rgb: var(--ion-bg-warning-base-press-rgb, 99, 58, 0); +$ion-bg-warning-subtle-default: var(--ion-bg-warning-subtle-default, #fff1ea); +$ion-bg-warning-subtle-default-rgb: var(--ion-bg-warning-subtle-default-rgb, 255, 241, 234); +$ion-bg-warning-subtle-press: var(--ion-bg-warning-subtle-press, #ffcfb1); +$ion-bg-warning-subtle-press-rgb: var(--ion-bg-warning-subtle-press-rgb, 255, 207, 177); +$ion-bg-body: var(--ion-bg-body, #f5f5f5); +$ion-bg-body-rgb: var(--ion-bg-body-rgb, 245, 245, 245); +$ion-bg-neutral-subtle-default: var(--ion-bg-neutral-subtle-default, #f5f5f5); +$ion-bg-neutral-subtle-default-rgb: var(--ion-bg-neutral-subtle-default-rgb, 245, 245, 245); +$ion-bg-neutral-subtle-press: var(--ion-bg-neutral-subtle-press, #cfcfcf); +$ion-bg-neutral-subtle-press-rgb: var(--ion-bg-neutral-subtle-press-rgb, 207, 207, 207); +$ion-bg-neutral-base-default: var(--ion-bg-neutral-base-default, #626262); +$ion-bg-neutral-base-default-rgb: var(--ion-bg-neutral-base-default-rgb, 98, 98, 98); +$ion-bg-neutral-base-press: var(--ion-bg-neutral-base-press, #3b3b3b); +$ion-bg-neutral-base-press-rgb: var(--ion-bg-neutral-base-press-rgb, 59, 59, 59); +$ion-bg-neutral-subtlest-default: var(--ion-bg-neutral-subtlest-default, #ffffff); +$ion-bg-neutral-subtlest-default-rgb: var(--ion-bg-neutral-subtlest-default-rgb, 255, 255, 255); +$ion-bg-neutral-subtlest-press: var(--ion-bg-neutral-subtlest-press, #e7e7e7); +$ion-bg-neutral-subtlest-press-rgb: var(--ion-bg-neutral-subtlest-press-rgb, 231, 231, 231); +$ion-bg-surface-default: var(--ion-bg-surface-default, #ffffff); +$ion-bg-surface-default-rgb: var(--ion-bg-surface-default-rgb, 255, 255, 255); +$ion-bg-input-default: var(--ion-bg-input-default, #ffffff); +$ion-bg-input-default-rgb: var(--ion-bg-input-default-rgb, 255, 255, 255); +$ion-bg-input-read-only: var(--ion-bg-input-read-only, #f5f5f5); +$ion-bg-input-read-only-rgb: var(--ion-bg-input-read-only-rgb, 245, 245, 245); +$ion-text-default: var(--ion-text-default, #242424); +$ion-text-default-rgb: var(--ion-text-default-rgb, 36, 36, 36); +$ion-text-subtle: var(--ion-text-subtle, #3b3b3b); +$ion-text-subtle-rgb: var(--ion-text-subtle-rgb, 59, 59, 59); +$ion-text-subtlest: var(--ion-text-subtlest, #626262); +$ion-text-subtlest-rgb: var(--ion-text-subtlest-rgb, 98, 98, 98); +$ion-text-primary: var(--ion-text-primary, #105cef); +$ion-text-primary-rgb: var(--ion-text-primary-rgb, 16, 92, 239); +$ion-text-disabled: var(--ion-text-disabled, #a2a2a2); +$ion-text-disabled-rgb: var(--ion-text-disabled-rgb, 162, 162, 162); +$ion-text-danger: var(--ion-text-danger, #bf2222); +$ion-text-danger-rgb: var(--ion-text-danger-rgb, 191, 34, 34); +$ion-text-info: var(--ion-text-info, #146d81); +$ion-text-info-rgb: var(--ion-text-info-rgb, 20, 109, 129); +$ion-text-warning: var(--ion-text-warning, #a45f00); +$ion-text-warning-rgb: var(--ion-text-warning-rgb, 164, 95, 0); +$ion-text-success: var(--ion-text-success, #126f23); +$ion-text-success-rgb: var(--ion-text-success-rgb, 18, 111, 35); +$ion-text-link-default: var(--ion-text-link-default, #105cef); +$ion-text-link-default-rgb: var(--ion-text-link-default-rgb, 16, 92, 239); +$ion-text-link-press: var(--ion-text-link-press, #0f54da); +$ion-text-link-press-rgb: var(--ion-text-link-press-rgb, 15, 84, 218); +$ion-text-link-visited: var(--ion-text-link-visited, #0d4bc3); +$ion-text-link-visited-rgb: var(--ion-text-link-visited-rgb, 13, 75, 195); +$ion-text-inverse: var(--ion-text-inverse, #ffffff); +$ion-text-inverse-rgb: var(--ion-text-inverse-rgb, 255, 255, 255); +$ion-text-select: var(--ion-text-select, #105cef); +$ion-text-select-rgb: var(--ion-text-select-rgb, 16, 92, 239); +$ion-border-default: var(--ion-border-default, #cfcfcf); +$ion-border-default-rgb: var(--ion-border-default-rgb, 207, 207, 207); +$ion-border-focus-0: var(--ion-border-focus-0, none); +$ion-border-focus-default: var(--ion-border-focus-default, #b5c0f7); +$ion-border-focus-default-rgb: var(--ion-border-focus-default-rgb, 181, 192, 247); +$ion-border-focus-error: var(--ion-border-focus-error, #faa1a1); +$ion-border-focus-error-rgb: var(--ion-border-focus-error-rgb, 250, 161, 161); +$ion-border-primary: var(--ion-border-primary, #105cef); +$ion-border-primary-rgb: var(--ion-border-primary-rgb, 16, 92, 239); +$ion-border-success: var(--ion-border-success, #126f23); +$ion-border-success-rgb: var(--ion-border-success-rgb, 18, 111, 35); +$ion-border-warning: var(--ion-border-warning, #a45f00); +$ion-border-warning-rgb: var(--ion-border-warning-rgb, 164, 95, 0); +$ion-border-danger: var(--ion-border-danger, #bf2222); +$ion-border-danger-rgb: var(--ion-border-danger-rgb, 191, 34, 34); +$ion-border-subtle: var(--ion-border-subtle, #cfcfcf); +$ion-border-subtle-rgb: var(--ion-border-subtle-rgb, 207, 207, 207); +$ion-border-input-default: var(--ion-border-input-default, #a2a2a2); +$ion-border-input-default-rgb: var(--ion-border-input-default-rgb, 162, 162, 162); +$ion-border-input-press: var(--ion-border-input-press, #777777); +$ion-border-input-press-rgb: var(--ion-border-input-press-rgb, 119, 119, 119); +$ion-border-input-read-only: var(--ion-border-input-read-only, #a2a2a2); +$ion-border-input-read-only-rgb: var(--ion-border-input-read-only-rgb, 162, 162, 162); +$ion-border-style-none: var(--ion-border-style-none, none); +$ion-border-style-solid: var(--ion-border-style-solid, solid); +$ion-border-style-dashed: var(--ion-border-style-dashed, dashed); +$ion-border-style-dotted: var(--ion-border-style-dotted, dotted); +$ion-border-size-0: var(--ion-border-size-0, 0px); +$ion-border-size-025: var(--ion-border-size-025, 1px); +$ion-border-size-050: var(--ion-border-size-050, 2px); +$ion-border-size-075: var(--ion-border-size-075, 3px); +$ion-border-radius-0: var(--ion-border-radius-0, 0px); +$ion-border-radius-100: var(--ion-border-radius-100, 4px); +$ion-border-radius-200: var(--ion-border-radius-200, 8px); +$ion-border-radius-300: var(--ion-border-radius-300, 12px); +$ion-border-radius-400: var(--ion-border-radius-400, 16px); +$ion-border-radius-500: var(--ion-border-radius-500, 20px); +$ion-border-radius-800: var(--ion-border-radius-800, 32px); +$ion-border-radius-1000: var(--ion-border-radius-1000, 40px); +$ion-border-radius-full: var(--ion-border-radius-full, 999px); +$ion-border-radius-025: var(--ion-border-radius-025, 2px); +$ion-shadow-1: var(--ion-shadow-1, rgba(0, 0, 0, 0.04)); +$ion-shadow-2: var(--ion-shadow-2, rgba(0, 0, 0, 0.05)); +$ion-shadow-3: var(--ion-shadow-3, rgba(0, 0, 0, 0.07)); +$ion-shadow-4: var(--ion-shadow-4, rgba(0, 0, 0, 0.08)); +$ion-shadow-5: var(--ion-shadow-5, rgba(0, 0, 0, 0.12)); +$ion-shadow-6: var(--ion-shadow-6, rgba(0, 0, 0, 0.16)); +$ion-shadow-7: var(--ion-shadow-7, rgba(0, 0, 0, 0.18)); +$ion-icon-subtlest: var(--ion-icon-subtlest, #626262); +$ion-icon-subtlest-rgb: var(--ion-icon-subtlest-rgb, 98, 98, 98); +$ion-icon-info: var(--ion-icon-info, #146d81); +$ion-icon-info-rgb: var(--ion-icon-info-rgb, 20, 109, 129); +$ion-icon-success: var(--ion-icon-success, #126f23); +$ion-icon-success-rgb: var(--ion-icon-success-rgb, 18, 111, 35); +$ion-icon-danger: var(--ion-icon-danger, #bf2222); +$ion-icon-danger-rgb: var(--ion-icon-danger-rgb, 191, 34, 34); +$ion-icon-warning: var(--ion-icon-warning, #a45f00); +$ion-icon-warning-rgb: var(--ion-icon-warning-rgb, 164, 95, 0); +$ion-icon-inverse: var(--ion-icon-inverse, #ffffff); +$ion-icon-inverse-rgb: var(--ion-icon-inverse-rgb, 255, 255, 255); +$ion-icon-primary: var(--ion-icon-primary, #105cef); +$ion-icon-primary-rgb: var(--ion-icon-primary-rgb, 16, 92, 239); +$ion-icon-default: var(--ion-icon-default, #242424); +$ion-icon-default-rgb: var(--ion-icon-default-rgb, 36, 36, 36); +$ion-icon-disabled: var(--ion-icon-disabled, #a2a2a2); +$ion-icon-disabled-rgb: var(--ion-icon-disabled-rgb, 162, 162, 162); +$ion-icon-subtle: var(--ion-icon-subtle, #3b3b3b); +$ion-icon-subtle-rgb: var(--ion-icon-subtle-rgb, 59, 59, 59); +$ion-icon-select: var(--ion-icon-select, #105cef); +$ion-icon-select-rgb: var(--ion-icon-select-rgb, 16, 92, 239); +$ion-primitives-neutral-100: var(--ion-primitives-neutral-100, #f5f5f5); +$ion-primitives-neutral-100-rgb: var(--ion-primitives-neutral-100-rgb, 245, 245, 245); +$ion-primitives-neutral-200: var(--ion-primitives-neutral-200, #e7e7e7); +$ion-primitives-neutral-200-rgb: var(--ion-primitives-neutral-200-rgb, 231, 231, 231); +$ion-primitives-neutral-300: var(--ion-primitives-neutral-300, #cfcfcf); +$ion-primitives-neutral-300-rgb: var(--ion-primitives-neutral-300-rgb, 207, 207, 207); +$ion-primitives-neutral-400: var(--ion-primitives-neutral-400, #b9b9b9); +$ion-primitives-neutral-400-rgb: var(--ion-primitives-neutral-400-rgb, 185, 185, 185); +$ion-primitives-neutral-500: var(--ion-primitives-neutral-500, #a2a2a2); +$ion-primitives-neutral-500-rgb: var(--ion-primitives-neutral-500-rgb, 162, 162, 162); +$ion-primitives-neutral-600: var(--ion-primitives-neutral-600, #8c8c8c); +$ion-primitives-neutral-600-rgb: var(--ion-primitives-neutral-600-rgb, 140, 140, 140); +$ion-primitives-neutral-700: var(--ion-primitives-neutral-700, #777777); +$ion-primitives-neutral-700-rgb: var(--ion-primitives-neutral-700-rgb, 119, 119, 119); +$ion-primitives-neutral-800: var(--ion-primitives-neutral-800, #626262); +$ion-primitives-neutral-800-rgb: var(--ion-primitives-neutral-800-rgb, 98, 98, 98); +$ion-primitives-neutral-900: var(--ion-primitives-neutral-900, #4e4e4e); +$ion-primitives-neutral-900-rgb: var(--ion-primitives-neutral-900-rgb, 78, 78, 78); +$ion-primitives-neutral-1000: var(--ion-primitives-neutral-1000, #3b3b3b); +$ion-primitives-neutral-1000-rgb: var(--ion-primitives-neutral-1000-rgb, 59, 59, 59); +$ion-primitives-neutral-1100: var(--ion-primitives-neutral-1100, #292929); +$ion-primitives-neutral-1100-rgb: var(--ion-primitives-neutral-1100-rgb, 41, 41, 41); +$ion-primitives-neutral-1200: var(--ion-primitives-neutral-1200, #242424); +$ion-primitives-neutral-1200-rgb: var(--ion-primitives-neutral-1200-rgb, 36, 36, 36); +$ion-primitives-base-white: var(--ion-primitives-base-white, #ffffff); +$ion-primitives-base-white-rgb: var(--ion-primitives-base-white-rgb, 255, 255, 255); +$ion-primitives-base-black: var(--ion-primitives-base-black, #111111); +$ion-primitives-base-black-rgb: var(--ion-primitives-base-black-rgb, 17, 17, 17); +$ion-primitives-red-100: var(--ion-primitives-red-100, #feeded); +$ion-primitives-red-100-rgb: var(--ion-primitives-red-100-rgb, 254, 237, 237); +$ion-primitives-red-200: var(--ion-primitives-red-200, #fde1e1); +$ion-primitives-red-200-rgb: var(--ion-primitives-red-200-rgb, 253, 225, 225); +$ion-primitives-red-300: var(--ion-primitives-red-300, #fcc1c1); +$ion-primitives-red-300-rgb: var(--ion-primitives-red-300-rgb, 252, 193, 193); +$ion-primitives-red-400: var(--ion-primitives-red-400, #faa1a1); +$ion-primitives-red-400-rgb: var(--ion-primitives-red-400-rgb, 250, 161, 161); +$ion-primitives-red-500: var(--ion-primitives-red-500, #f97d7d); +$ion-primitives-red-500-rgb: var(--ion-primitives-red-500-rgb, 249, 125, 125); +$ion-primitives-red-600: var(--ion-primitives-red-600, #f85151); +$ion-primitives-red-600-rgb: var(--ion-primitives-red-600-rgb, 248, 81, 81); +$ion-primitives-red-700: var(--ion-primitives-red-700, #e52929); +$ion-primitives-red-700-rgb: var(--ion-primitives-red-700-rgb, 229, 41, 41); +$ion-primitives-red-800: var(--ion-primitives-red-800, #bf2222); +$ion-primitives-red-800-rgb: var(--ion-primitives-red-800-rgb, 191, 34, 34); +$ion-primitives-red-900: var(--ion-primitives-red-900, #991b1b); +$ion-primitives-red-900-rgb: var(--ion-primitives-red-900-rgb, 153, 27, 27); +$ion-primitives-red-1000: var(--ion-primitives-red-1000, #761515); +$ion-primitives-red-1000-rgb: var(--ion-primitives-red-1000-rgb, 118, 21, 21); +$ion-primitives-red-1100: var(--ion-primitives-red-1100, #540f0f); +$ion-primitives-red-1100-rgb: var(--ion-primitives-red-1100-rgb, 84, 15, 15); +$ion-primitives-red-1200: var(--ion-primitives-red-1200, #330909); +$ion-primitives-red-1200-rgb: var(--ion-primitives-red-1200-rgb, 51, 9, 9); +$ion-primitives-pumpkin-100: var(--ion-primitives-pumpkin-100, #feedea); +$ion-primitives-pumpkin-100-rgb: var(--ion-primitives-pumpkin-100-rgb, 254, 237, 234); +$ion-primitives-pumpkin-200: var(--ion-primitives-pumpkin-200, #fde0db); +$ion-primitives-pumpkin-200-rgb: var(--ion-primitives-pumpkin-200-rgb, 253, 224, 219); +$ion-primitives-pumpkin-300: var(--ion-primitives-pumpkin-300, #fbbdb1); +$ion-primitives-pumpkin-300-rgb: var(--ion-primitives-pumpkin-300-rgb, 251, 189, 177); +$ion-primitives-pumpkin-400: var(--ion-primitives-pumpkin-400, #f9947c); +$ion-primitives-pumpkin-400-rgb: var(--ion-primitives-pumpkin-400-rgb, 249, 148, 124); +$ion-primitives-pumpkin-500: var(--ion-primitives-pumpkin-500, #f75d07); +$ion-primitives-pumpkin-500-rgb: var(--ion-primitives-pumpkin-500-rgb, 247, 93, 7); +$ion-primitives-pumpkin-600: var(--ion-primitives-pumpkin-600, #da5206); +$ion-primitives-pumpkin-600-rgb: var(--ion-primitives-pumpkin-600-rgb, 218, 82, 6); +$ion-primitives-pumpkin-700: var(--ion-primitives-pumpkin-700, #bd4705); +$ion-primitives-pumpkin-700-rgb: var(--ion-primitives-pumpkin-700-rgb, 189, 71, 5); +$ion-primitives-pumpkin-800: var(--ion-primitives-pumpkin-800, #9f3c05); +$ion-primitives-pumpkin-800-rgb: var(--ion-primitives-pumpkin-800-rgb, 159, 60, 5); +$ion-primitives-pumpkin-900: var(--ion-primitives-pumpkin-900, #803004); +$ion-primitives-pumpkin-900-rgb: var(--ion-primitives-pumpkin-900-rgb, 128, 48, 4); +$ion-primitives-pumpkin-1000: var(--ion-primitives-pumpkin-1000, #602403); +$ion-primitives-pumpkin-1000-rgb: var(--ion-primitives-pumpkin-1000-rgb, 96, 36, 3); +$ion-primitives-pumpkin-1100: var(--ion-primitives-pumpkin-1100, #401802); +$ion-primitives-pumpkin-1100-rgb: var(--ion-primitives-pumpkin-1100-rgb, 64, 24, 2); +$ion-primitives-pumpkin-1200: var(--ion-primitives-pumpkin-1200, #210c01); +$ion-primitives-pumpkin-1200-rgb: var(--ion-primitives-pumpkin-1200-rgb, 33, 12, 1); +$ion-primitives-orange-100: var(--ion-primitives-orange-100, #fff1ea); +$ion-primitives-orange-100-rgb: var(--ion-primitives-orange-100-rgb, 255, 241, 234); +$ion-primitives-orange-200: var(--ion-primitives-orange-200, #ffe8db); +$ion-primitives-orange-200-rgb: var(--ion-primitives-orange-200-rgb, 255, 232, 219); +$ion-primitives-orange-300: var(--ion-primitives-orange-300, #ffcfb1); +$ion-primitives-orange-300-rgb: var(--ion-primitives-orange-300-rgb, 255, 207, 177); +$ion-primitives-orange-400: var(--ion-primitives-orange-400, #ffb37b); +$ion-primitives-orange-400-rgb: var(--ion-primitives-orange-400-rgb, 255, 179, 123); +$ion-primitives-orange-500: var(--ion-primitives-orange-500, #ff9400); +$ion-primitives-orange-500-rgb: var(--ion-primitives-orange-500-rgb, 255, 148, 0); +$ion-primitives-orange-600: var(--ion-primitives-orange-600, #e18300); +$ion-primitives-orange-600-rgb: var(--ion-primitives-orange-600-rgb, 225, 131, 0); +$ion-primitives-orange-700: var(--ion-primitives-orange-700, #c37100); +$ion-primitives-orange-700-rgb: var(--ion-primitives-orange-700-rgb, 195, 113, 0); +$ion-primitives-orange-800: var(--ion-primitives-orange-800, #a45f00); +$ion-primitives-orange-800-rgb: var(--ion-primitives-orange-800-rgb, 164, 95, 0); +$ion-primitives-orange-900: var(--ion-primitives-orange-900, #844d00); +$ion-primitives-orange-900-rgb: var(--ion-primitives-orange-900-rgb, 132, 77, 0); +$ion-primitives-orange-1000: var(--ion-primitives-orange-1000, #633a00); +$ion-primitives-orange-1000-rgb: var(--ion-primitives-orange-1000-rgb, 99, 58, 0); +$ion-primitives-orange-1100: var(--ion-primitives-orange-1100, #422700); +$ion-primitives-orange-1100-rgb: var(--ion-primitives-orange-1100-rgb, 66, 39, 0); +$ion-primitives-orange-1200: var(--ion-primitives-orange-1200, #221400); +$ion-primitives-orange-1200-rgb: var(--ion-primitives-orange-1200-rgb, 34, 20, 0); +$ion-primitives-yellow-100: var(--ion-primitives-yellow-100, #fff9ea); +$ion-primitives-yellow-100-rgb: var(--ion-primitives-yellow-100-rgb, 255, 249, 234); +$ion-primitives-yellow-200: var(--ion-primitives-yellow-200, #fff5db); +$ion-primitives-yellow-200-rgb: var(--ion-primitives-yellow-200-rgb, 255, 245, 219); +$ion-primitives-yellow-300: var(--ion-primitives-yellow-300, #ffebb1); +$ion-primitives-yellow-300-rgb: var(--ion-primitives-yellow-300-rgb, 255, 235, 177); +$ion-primitives-yellow-400: var(--ion-primitives-yellow-400, #ffe07b); +$ion-primitives-yellow-400-rgb: var(--ion-primitives-yellow-400-rgb, 255, 224, 123); +$ion-primitives-yellow-500: var(--ion-primitives-yellow-500, #ffd600); +$ion-primitives-yellow-500-rgb: var(--ion-primitives-yellow-500-rgb, 255, 214, 0); +$ion-primitives-yellow-600: var(--ion-primitives-yellow-600, #e1bd00); +$ion-primitives-yellow-600-rgb: var(--ion-primitives-yellow-600-rgb, 225, 189, 0); +$ion-primitives-yellow-700: var(--ion-primitives-yellow-700, #c3a400); +$ion-primitives-yellow-700-rgb: var(--ion-primitives-yellow-700-rgb, 195, 164, 0); +$ion-primitives-yellow-800: var(--ion-primitives-yellow-800, #a48a00); +$ion-primitives-yellow-800-rgb: var(--ion-primitives-yellow-800-rgb, 164, 138, 0); +$ion-primitives-yellow-900: var(--ion-primitives-yellow-900, #846f00); +$ion-primitives-yellow-900-rgb: var(--ion-primitives-yellow-900-rgb, 132, 111, 0); +$ion-primitives-yellow-1000: var(--ion-primitives-yellow-1000, #635300); +$ion-primitives-yellow-1000-rgb: var(--ion-primitives-yellow-1000-rgb, 99, 83, 0); +$ion-primitives-yellow-1100: var(--ion-primitives-yellow-1100, #423800); +$ion-primitives-yellow-1100-rgb: var(--ion-primitives-yellow-1100-rgb, 66, 56, 0); +$ion-primitives-yellow-1200: var(--ion-primitives-yellow-1200, #221d00); +$ion-primitives-yellow-1200-rgb: var(--ion-primitives-yellow-1200-rgb, 34, 29, 0); +$ion-primitives-lime-100: var(--ion-primitives-lime-100, #f3faea); +$ion-primitives-lime-100-rgb: var(--ion-primitives-lime-100-rgb, 243, 250, 234); +$ion-primitives-lime-200: var(--ion-primitives-lime-200, #eaf7db); +$ion-primitives-lime-200-rgb: var(--ion-primitives-lime-200-rgb, 234, 247, 219); +$ion-primitives-lime-300: var(--ion-primitives-lime-300, #d3efb2); +$ion-primitives-lime-300-rgb: var(--ion-primitives-lime-300-rgb, 211, 239, 178); +$ion-primitives-lime-400: var(--ion-primitives-lime-400, #bbe77d); +$ion-primitives-lime-400-rgb: var(--ion-primitives-lime-400-rgb, 187, 231, 125); +$ion-primitives-lime-500: var(--ion-primitives-lime-500, #a0df18); +$ion-primitives-lime-500-rgb: var(--ion-primitives-lime-500-rgb, 160, 223, 24); +$ion-primitives-lime-600: var(--ion-primitives-lime-600, #8dc515); +$ion-primitives-lime-600-rgb: var(--ion-primitives-lime-600-rgb, 141, 197, 21); +$ion-primitives-lime-700: var(--ion-primitives-lime-700, #7aab12); +$ion-primitives-lime-700-rgb: var(--ion-primitives-lime-700-rgb, 122, 171, 18); +$ion-primitives-lime-800: var(--ion-primitives-lime-800, #678f0f); +$ion-primitives-lime-800-rgb: var(--ion-primitives-lime-800-rgb, 103, 143, 15); +$ion-primitives-lime-900: var(--ion-primitives-lime-900, #53730c); +$ion-primitives-lime-900-rgb: var(--ion-primitives-lime-900-rgb, 83, 115, 12); +$ion-primitives-lime-1000: var(--ion-primitives-lime-1000, #3e5709); +$ion-primitives-lime-1000-rgb: var(--ion-primitives-lime-1000-rgb, 62, 87, 9); +$ion-primitives-lime-1100: var(--ion-primitives-lime-1100, #2a3a06); +$ion-primitives-lime-1100-rgb: var(--ion-primitives-lime-1100-rgb, 42, 58, 6); +$ion-primitives-lime-1200: var(--ion-primitives-lime-1200, #151e03); +$ion-primitives-lime-1200-rgb: var(--ion-primitives-lime-1200-rgb, 21, 30, 3); +$ion-primitives-green-100: var(--ion-primitives-green-100, #ebf9ec); +$ion-primitives-green-100-rgb: var(--ion-primitives-green-100-rgb, 235, 249, 236); +$ion-primitives-green-200: var(--ion-primitives-green-200, #dcf5de); +$ion-primitives-green-200-rgb: var(--ion-primitives-green-200-rgb, 220, 245, 222); +$ion-primitives-green-300: var(--ion-primitives-green-300, #b3ebb7); +$ion-primitives-green-300-rgb: var(--ion-primitives-green-300-rgb, 179, 235, 183); +$ion-primitives-green-400: var(--ion-primitives-green-400, #7fe089); +$ion-primitives-green-400-rgb: var(--ion-primitives-green-400-rgb, 127, 224, 137); +$ion-primitives-green-500: var(--ion-primitives-green-500, #23d643); +$ion-primitives-green-500-rgb: var(--ion-primitives-green-500-rgb, 35, 214, 67); +$ion-primitives-green-600: var(--ion-primitives-green-600, #1fbd3b); +$ion-primitives-green-600-rgb: var(--ion-primitives-green-600-rgb, 31, 189, 59); +$ion-primitives-green-700: var(--ion-primitives-green-700, #1ba433); +$ion-primitives-green-700-rgb: var(--ion-primitives-green-700-rgb, 27, 164, 51); +$ion-primitives-green-800: var(--ion-primitives-green-800, #178a2b); +$ion-primitives-green-800-rgb: var(--ion-primitives-green-800-rgb, 23, 138, 43); +$ion-primitives-green-900: var(--ion-primitives-green-900, #126f23); +$ion-primitives-green-900-rgb: var(--ion-primitives-green-900-rgb, 18, 111, 35); +$ion-primitives-green-1000: var(--ion-primitives-green-1000, #0e531a); +$ion-primitives-green-1000-rgb: var(--ion-primitives-green-1000-rgb, 14, 83, 26); +$ion-primitives-green-1100: var(--ion-primitives-green-1100, #093811); +$ion-primitives-green-1100-rgb: var(--ion-primitives-green-1100-rgb, 9, 56, 17); +$ion-primitives-green-1200: var(--ion-primitives-green-1200, #051d09); +$ion-primitives-green-1200-rgb: var(--ion-primitives-green-1200-rgb, 5, 29, 9); +$ion-primitives-teal-100: var(--ion-primitives-teal-100, #eaf8f5); +$ion-primitives-teal-100-rgb: var(--ion-primitives-teal-100-rgb, 234, 248, 245); +$ion-primitives-teal-200: var(--ion-primitives-teal-200, #dbf3ee); +$ion-primitives-teal-200-rgb: var(--ion-primitives-teal-200-rgb, 219, 243, 238); +$ion-primitives-teal-300: var(--ion-primitives-teal-300, #b1e7dd); +$ion-primitives-teal-300-rgb: var(--ion-primitives-teal-300-rgb, 177, 231, 221); +$ion-primitives-teal-400: var(--ion-primitives-teal-400, #7bdbca); +$ion-primitives-teal-400-rgb: var(--ion-primitives-teal-400-rgb, 123, 219, 202); +$ion-primitives-teal-500: var(--ion-primitives-teal-500, #00cfb7); +$ion-primitives-teal-500-rgb: var(--ion-primitives-teal-500-rgb, 0, 207, 183); +$ion-primitives-teal-600: var(--ion-primitives-teal-600, #00b7a2); +$ion-primitives-teal-600-rgb: var(--ion-primitives-teal-600-rgb, 0, 183, 162); +$ion-primitives-teal-700: var(--ion-primitives-teal-700, #009e8c); +$ion-primitives-teal-700-rgb: var(--ion-primitives-teal-700-rgb, 0, 158, 140); +$ion-primitives-teal-800: var(--ion-primitives-teal-800, #008576); +$ion-primitives-teal-800-rgb: var(--ion-primitives-teal-800-rgb, 0, 133, 118); +$ion-primitives-teal-900: var(--ion-primitives-teal-900, #006b5f); +$ion-primitives-teal-900-rgb: var(--ion-primitives-teal-900-rgb, 0, 107, 95); +$ion-primitives-teal-1000: var(--ion-primitives-teal-1000, #005147); +$ion-primitives-teal-1000-rgb: var(--ion-primitives-teal-1000-rgb, 0, 81, 71); +$ion-primitives-teal-1100: var(--ion-primitives-teal-1100, #003630); +$ion-primitives-teal-1100-rgb: var(--ion-primitives-teal-1100-rgb, 0, 54, 48); +$ion-primitives-teal-1200: var(--ion-primitives-teal-1200, #001c19); +$ion-primitives-teal-1200-rgb: var(--ion-primitives-teal-1200-rgb, 0, 28, 25); +$ion-primitives-aqua-100: var(--ion-primitives-aqua-100, #ebf9fe); +$ion-primitives-aqua-100-rgb: var(--ion-primitives-aqua-100-rgb, 235, 249, 254); +$ion-primitives-aqua-200: var(--ion-primitives-aqua-200, #dcf4fd); +$ion-primitives-aqua-200-rgb: var(--ion-primitives-aqua-200-rgb, 220, 244, 253); +$ion-primitives-aqua-300: var(--ion-primitives-aqua-300, #b3e9fc); +$ion-primitives-aqua-300-rgb: var(--ion-primitives-aqua-300-rgb, 179, 233, 252); +$ion-primitives-aqua-400: var(--ion-primitives-aqua-400, #80defa); +$ion-primitives-aqua-400-rgb: var(--ion-primitives-aqua-400-rgb, 128, 222, 250); +$ion-primitives-aqua-500: var(--ion-primitives-aqua-500, #27d3f9); +$ion-primitives-aqua-500-rgb: var(--ion-primitives-aqua-500-rgb, 39, 211, 249); +$ion-primitives-aqua-600: var(--ion-primitives-aqua-600, #22bbdc); +$ion-primitives-aqua-600-rgb: var(--ion-primitives-aqua-600-rgb, 34, 187, 220); +$ion-primitives-aqua-700: var(--ion-primitives-aqua-700, #1ea2bf); +$ion-primitives-aqua-700-rgb: var(--ion-primitives-aqua-700-rgb, 30, 162, 191); +$ion-primitives-aqua-800: var(--ion-primitives-aqua-800, #1988a0); +$ion-primitives-aqua-800-rgb: var(--ion-primitives-aqua-800-rgb, 25, 136, 160); +$ion-primitives-aqua-900: var(--ion-primitives-aqua-900, #146d81); +$ion-primitives-aqua-900-rgb: var(--ion-primitives-aqua-900-rgb, 20, 109, 129); +$ion-primitives-aqua-1000: var(--ion-primitives-aqua-1000, #0f5261); +$ion-primitives-aqua-1000-rgb: var(--ion-primitives-aqua-1000-rgb, 15, 82, 97); +$ion-primitives-aqua-1100: var(--ion-primitives-aqua-1100, #0a3741); +$ion-primitives-aqua-1100-rgb: var(--ion-primitives-aqua-1100-rgb, 10, 55, 65); +$ion-primitives-aqua-1200: var(--ion-primitives-aqua-1200, #051c21); +$ion-primitives-aqua-1200-rgb: var(--ion-primitives-aqua-1200-rgb, 5, 28, 33); +$ion-primitives-blue-100: var(--ion-primitives-blue-100, #f2f4fd); +$ion-primitives-blue-100-rgb: var(--ion-primitives-blue-100-rgb, 242, 244, 253); +$ion-primitives-blue-200: var(--ion-primitives-blue-200, #e9ecfc); +$ion-primitives-blue-200-rgb: var(--ion-primitives-blue-200-rgb, 233, 236, 252); +$ion-primitives-blue-300: var(--ion-primitives-blue-300, #d0d7fa); +$ion-primitives-blue-300-rgb: var(--ion-primitives-blue-300-rgb, 208, 215, 250); +$ion-primitives-blue-400: var(--ion-primitives-blue-400, #b5c0f7); +$ion-primitives-blue-400-rgb: var(--ion-primitives-blue-400-rgb, 181, 192, 247); +$ion-primitives-blue-500: var(--ion-primitives-blue-500, #94a5f4); +$ion-primitives-blue-500-rgb: var(--ion-primitives-blue-500-rgb, 148, 165, 244); +$ion-primitives-blue-600: var(--ion-primitives-blue-600, #6986f2); +$ion-primitives-blue-600-rgb: var(--ion-primitives-blue-600-rgb, 105, 134, 242); +$ion-primitives-blue-700: var(--ion-primitives-blue-700, #105cef); +$ion-primitives-blue-700-rgb: var(--ion-primitives-blue-700-rgb, 16, 92, 239); +$ion-primitives-blue-800: var(--ion-primitives-blue-800, #0f54da); +$ion-primitives-blue-800-rgb: var(--ion-primitives-blue-800-rgb, 15, 84, 218); +$ion-primitives-blue-900: var(--ion-primitives-blue-900, #0d4bc3); +$ion-primitives-blue-900-rgb: var(--ion-primitives-blue-900-rgb, 13, 75, 195); +$ion-primitives-blue-1000: var(--ion-primitives-blue-1000, #0b41a9); +$ion-primitives-blue-1000-rgb: var(--ion-primitives-blue-1000-rgb, 11, 65, 169); +$ion-primitives-blue-1100: var(--ion-primitives-blue-1100, #09358a); +$ion-primitives-blue-1100-rgb: var(--ion-primitives-blue-1100-rgb, 9, 53, 138); +$ion-primitives-blue-1200: var(--ion-primitives-blue-1200, #072561); +$ion-primitives-blue-1200-rgb: var(--ion-primitives-blue-1200-rgb, 7, 37, 97); +$ion-primitives-indigo-100: var(--ion-primitives-indigo-100, #f3f2fb); +$ion-primitives-indigo-100-rgb: var(--ion-primitives-indigo-100-rgb, 243, 242, 251); +$ion-primitives-indigo-200: var(--ion-primitives-indigo-200, #eae9f9); +$ion-primitives-indigo-200-rgb: var(--ion-primitives-indigo-200-rgb, 234, 233, 249); +$ion-primitives-indigo-300: var(--ion-primitives-indigo-300, #d3d1f2); +$ion-primitives-indigo-300-rgb: var(--ion-primitives-indigo-300-rgb, 211, 209, 242); +$ion-primitives-indigo-400: var(--ion-primitives-indigo-400, #bab5eb); +$ion-primitives-indigo-400-rgb: var(--ion-primitives-indigo-400-rgb, 186, 181, 235); +$ion-primitives-indigo-500: var(--ion-primitives-indigo-500, #9d95e4); +$ion-primitives-indigo-500-rgb: var(--ion-primitives-indigo-500-rgb, 157, 149, 228); +$ion-primitives-indigo-600: var(--ion-primitives-indigo-600, #786bdd); +$ion-primitives-indigo-600-rgb: var(--ion-primitives-indigo-600-rgb, 120, 107, 221); +$ion-primitives-indigo-700: var(--ion-primitives-indigo-700, #411bd5); +$ion-primitives-indigo-700-rgb: var(--ion-primitives-indigo-700-rgb, 65, 27, 213); +$ion-primitives-indigo-800: var(--ion-primitives-indigo-800, #3b19c3); +$ion-primitives-indigo-800-rgb: var(--ion-primitives-indigo-800-rgb, 59, 25, 195); +$ion-primitives-indigo-900: var(--ion-primitives-indigo-900, #3516ae); +$ion-primitives-indigo-900-rgb: var(--ion-primitives-indigo-900-rgb, 53, 22, 174); +$ion-primitives-indigo-1000: var(--ion-primitives-indigo-1000, #2e1397); +$ion-primitives-indigo-1000-rgb: var(--ion-primitives-indigo-1000-rgb, 46, 19, 151); +$ion-primitives-indigo-1100: var(--ion-primitives-indigo-1100, #26107b); +$ion-primitives-indigo-1100-rgb: var(--ion-primitives-indigo-1100-rgb, 38, 16, 123); +$ion-primitives-indigo-1200: var(--ion-primitives-indigo-1200, #1a0b57); +$ion-primitives-indigo-1200-rgb: var(--ion-primitives-indigo-1200-rgb, 26, 11, 87); +$ion-primitives-violet-100: var(--ion-primitives-violet-100, #f5f2fe); +$ion-primitives-violet-100-rgb: var(--ion-primitives-violet-100-rgb, 245, 242, 254); +$ion-primitives-violet-200: var(--ion-primitives-violet-200, #eee9fd); +$ion-primitives-violet-200-rgb: var(--ion-primitives-violet-200-rgb, 238, 233, 253); +$ion-primitives-violet-300: var(--ion-primitives-violet-300, #dcd1fb); +$ion-primitives-violet-300-rgb: var(--ion-primitives-violet-300-rgb, 220, 209, 251); +$ion-primitives-violet-400: var(--ion-primitives-violet-400, #c9b6f9); +$ion-primitives-violet-400-rgb: var(--ion-primitives-violet-400-rgb, 201, 182, 249); +$ion-primitives-violet-500: var(--ion-primitives-violet-500, #b396f6); +$ion-primitives-violet-500-rgb: var(--ion-primitives-violet-500-rgb, 179, 150, 246); +$ion-primitives-violet-600: var(--ion-primitives-violet-600, #9a6cf4); +$ion-primitives-violet-600-rgb: var(--ion-primitives-violet-600-rgb, 154, 108, 244); +$ion-primitives-violet-700: var(--ion-primitives-violet-700, #7c20f2); +$ion-primitives-violet-700-rgb: var(--ion-primitives-violet-700-rgb, 124, 32, 242); +$ion-primitives-violet-800: var(--ion-primitives-violet-800, #711ddd); +$ion-primitives-violet-800-rgb: var(--ion-primitives-violet-800-rgb, 113, 29, 221); +$ion-primitives-violet-900: var(--ion-primitives-violet-900, #651ac5); +$ion-primitives-violet-900-rgb: var(--ion-primitives-violet-900-rgb, 101, 26, 197); +$ion-primitives-violet-1000: var(--ion-primitives-violet-1000, #5817ab); +$ion-primitives-violet-1000-rgb: var(--ion-primitives-violet-1000-rgb, 88, 23, 171); +$ion-primitives-violet-1100: var(--ion-primitives-violet-1100, #48128c); +$ion-primitives-violet-1100-rgb: var(--ion-primitives-violet-1100-rgb, 72, 18, 140); +$ion-primitives-violet-1200: var(--ion-primitives-violet-1200, #330d63); +$ion-primitives-violet-1200-rgb: var(--ion-primitives-violet-1200-rgb, 51, 13, 99); +$ion-primitives-purple-100: var(--ion-primitives-purple-100, #f9f3fe); +$ion-primitives-purple-100-rgb: var(--ion-primitives-purple-100-rgb, 249, 243, 254); +$ion-primitives-purple-200: var(--ion-primitives-purple-200, #f5eafd); +$ion-primitives-purple-200-rgb: var(--ion-primitives-purple-200-rgb, 245, 234, 253); +$ion-primitives-purple-300: var(--ion-primitives-purple-300, #e9d3fa); +$ion-primitives-purple-300-rgb: var(--ion-primitives-purple-300-rgb, 233, 211, 250); +$ion-primitives-purple-400: var(--ion-primitives-purple-400, #deb9f8); +$ion-primitives-purple-400-rgb: var(--ion-primitives-purple-400-rgb, 222, 185, 248); +$ion-primitives-purple-500: var(--ion-primitives-purple-500, #d29bf6); +$ion-primitives-purple-500-rgb: var(--ion-primitives-purple-500-rgb, 210, 155, 246); +$ion-primitives-purple-600: var(--ion-primitives-purple-600, #c575f3); +$ion-primitives-purple-600-rgb: var(--ion-primitives-purple-600-rgb, 197, 117, 243); +$ion-primitives-purple-700: var(--ion-primitives-purple-700, #b73cf1); +$ion-primitives-purple-700-rgb: var(--ion-primitives-purple-700-rgb, 183, 60, 241); +$ion-primitives-purple-800: var(--ion-primitives-purple-800, #a737dc); +$ion-primitives-purple-800-rgb: var(--ion-primitives-purple-800-rgb, 167, 55, 220); +$ion-primitives-purple-900: var(--ion-primitives-purple-900, #9531c5); +$ion-primitives-purple-900-rgb: var(--ion-primitives-purple-900-rgb, 149, 49, 197); +$ion-primitives-purple-1000: var(--ion-primitives-purple-1000, #812aaa); +$ion-primitives-purple-1000-rgb: var(--ion-primitives-purple-1000-rgb, 129, 42, 170); +$ion-primitives-purple-1100: var(--ion-primitives-purple-1100, #6a238b); +$ion-primitives-purple-1100-rgb: var(--ion-primitives-purple-1100-rgb, 106, 35, 139); +$ion-primitives-purple-1200: var(--ion-primitives-purple-1200, #4b1862); +$ion-primitives-purple-1200-rgb: var(--ion-primitives-purple-1200-rgb, 75, 24, 98); +$ion-primitives-magenta-100: var(--ion-primitives-magenta-100, #fdf3fb); +$ion-primitives-magenta-100-rgb: var(--ion-primitives-magenta-100-rgb, 253, 243, 251); +$ion-primitives-magenta-200: var(--ion-primitives-magenta-200, #fcebf8); +$ion-primitives-magenta-200-rgb: var(--ion-primitives-magenta-200-rgb, 252, 235, 248); +$ion-primitives-magenta-300: var(--ion-primitives-magenta-300, #f9d4f1); +$ion-primitives-magenta-300-rgb: var(--ion-primitives-magenta-300-rgb, 249, 212, 241); +$ion-primitives-magenta-400: var(--ion-primitives-magenta-400, #f6bcea); +$ion-primitives-magenta-400-rgb: var(--ion-primitives-magenta-400-rgb, 246, 188, 234); +$ion-primitives-magenta-500: var(--ion-primitives-magenta-500, #f39fe3); +$ion-primitives-magenta-500-rgb: var(--ion-primitives-magenta-500-rgb, 243, 159, 227); +$ion-primitives-magenta-600: var(--ion-primitives-magenta-600, #f07cdb); +$ion-primitives-magenta-600-rgb: var(--ion-primitives-magenta-600-rgb, 240, 124, 219); +$ion-primitives-magenta-700: var(--ion-primitives-magenta-700, #ed4ad3); +$ion-primitives-magenta-700-rgb: var(--ion-primitives-magenta-700-rgb, 237, 74, 211); +$ion-primitives-magenta-800: var(--ion-primitives-magenta-800, #d844c1); +$ion-primitives-magenta-800-rgb: var(--ion-primitives-magenta-800-rgb, 216, 68, 193); +$ion-primitives-magenta-900: var(--ion-primitives-magenta-900, #c13cac); +$ion-primitives-magenta-900-rgb: var(--ion-primitives-magenta-900-rgb, 193, 60, 172); +$ion-primitives-magenta-1000: var(--ion-primitives-magenta-1000, #a83495); +$ion-primitives-magenta-1000-rgb: var(--ion-primitives-magenta-1000-rgb, 168, 52, 149); +$ion-primitives-magenta-1100: var(--ion-primitives-magenta-1100, #892b7a); +$ion-primitives-magenta-1100-rgb: var(--ion-primitives-magenta-1100-rgb, 137, 43, 122); +$ion-primitives-magenta-1200: var(--ion-primitives-magenta-1200, #611e56); +$ion-primitives-magenta-1200-rgb: var(--ion-primitives-magenta-1200-rgb, 97, 30, 86); +$ion-primitives-pink-100: var(--ion-primitives-pink-100, #fef3f5); +$ion-primitives-pink-100-rgb: var(--ion-primitives-pink-100-rgb, 254, 243, 245); +$ion-primitives-pink-200: var(--ion-primitives-pink-200, #fdeaee); +$ion-primitives-pink-200-rgb: var(--ion-primitives-pink-200-rgb, 253, 234, 238); +$ion-primitives-pink-300: var(--ion-primitives-pink-300, #fad3dc); +$ion-primitives-pink-300-rgb: var(--ion-primitives-pink-300-rgb, 250, 211, 220); +$ion-primitives-pink-400: var(--ion-primitives-pink-400, #f8b9c9); +$ion-primitives-pink-400-rgb: var(--ion-primitives-pink-400-rgb, 248, 185, 201); +$ion-primitives-pink-500: var(--ion-primitives-pink-500, #f69bb3); +$ion-primitives-pink-500-rgb: var(--ion-primitives-pink-500-rgb, 246, 155, 179); +$ion-primitives-pink-600: var(--ion-primitives-pink-600, #f3759a); +$ion-primitives-pink-600-rgb: var(--ion-primitives-pink-600-rgb, 243, 117, 154); +$ion-primitives-pink-700: var(--ion-primitives-pink-700, #f13b7d); +$ion-primitives-pink-700-rgb: var(--ion-primitives-pink-700-rgb, 241, 59, 125); +$ion-primitives-pink-800: var(--ion-primitives-pink-800, #dc3672); +$ion-primitives-pink-800-rgb: var(--ion-primitives-pink-800-rgb, 220, 54, 114); +$ion-primitives-pink-900: var(--ion-primitives-pink-900, #c53066); +$ion-primitives-pink-900-rgb: var(--ion-primitives-pink-900-rgb, 197, 48, 102); +$ion-primitives-pink-1000: var(--ion-primitives-pink-1000, #aa2a58); +$ion-primitives-pink-1000-rgb: var(--ion-primitives-pink-1000-rgb, 170, 42, 88); +$ion-primitives-pink-1100: var(--ion-primitives-pink-1100, #8b2248); +$ion-primitives-pink-1100-rgb: var(--ion-primitives-pink-1100-rgb, 139, 34, 72); +$ion-primitives-pink-1200: var(--ion-primitives-pink-1200, #621833); +$ion-primitives-pink-1200-rgb: var(--ion-primitives-pink-1200-rgb, 98, 24, 51); +$ion-state-disabled: var(--ion-state-disabled, rgba(255, 255, 255, 0.6)); +$ion-state-press: var(--ion-state-press, rgba(36, 36, 36, 0.08)); +$ion-elevation-1: var(--ion-elevation-1, 0px 0px 4px 0px rgba(0, 0, 0, 0.04), 0px 3px 9px 0px rgba(0, 0, 0, 0.07)); +$ion-elevation-2: var(--ion-elevation-2, 0px 1px 5px 0px rgba(0, 0, 0, 0.05), 0px 8px 25px 0px rgba(0, 0, 0, 0.08)); +$ion-elevation-3: var(--ion-elevation-3, 0px 2px 7px 0px rgba(0, 0, 0, 0.05), 0px 6px 32px 0px rgba(0, 0, 0, 0.16)); +$ion-elevation-4: var(--ion-elevation-4, 0px 3px 12px 0px rgba(0, 0, 0, 0.12), 0px 15px 48px 0px rgba(0, 0, 0, 0.18)); +$ion-backdrop: var(--ion-backdrop, [object Object]); +$ion-scale-0: var(--ion-scale-0, 0px); +$ion-scale-100: var(--ion-scale-100, 4px); +$ion-scale-150: var(--ion-scale-150, 6px); +$ion-scale-200: var(--ion-scale-200, 8px); +$ion-scale-250: var(--ion-scale-250, 10px); +$ion-scale-300: var(--ion-scale-300, 12px); +$ion-scale-400: var(--ion-scale-400, 16px); +$ion-scale-500: var(--ion-scale-500, 20px); +$ion-scale-600: var(--ion-scale-600, 24px); +$ion-scale-700: var(--ion-scale-700, 28px); +$ion-scale-800: var(--ion-scale-800, 32px); +$ion-scale-900: var(--ion-scale-900, 36px); +$ion-scale-1000: var(--ion-scale-1000, 40px); +$ion-scale-1100: var(--ion-scale-1100, 44px); +$ion-scale-1200: var(--ion-scale-1200, 48px); +$ion-scale-1400: var(--ion-scale-1400, 56px); +$ion-scale-1600: var(--ion-scale-1600, 64px); +$ion-scale-1800: var(--ion-scale-1800, 72px); +$ion-scale-2000: var(--ion-scale-2000, 80px); +$ion-scale-2400: var(--ion-scale-2400, 96px); +$ion-scale-2800: var(--ion-scale-2800, 112px); +$ion-scale-3200: var(--ion-scale-3200, 128px); +$ion-scale-3400: var(--ion-scale-3400, 136px); +$ion-scale-3600: var(--ion-scale-3600, 144px); +$ion-scale-4000: var(--ion-scale-4000, 160px); +$ion-scale-5000: var(--ion-scale-5000, 200px); +$ion-scale-6200: var(--ion-scale-6200, 248px); +$ion-scale-7400: var(--ion-scale-7400, 296px); +$ion-scale-9000: var(--ion-scale-9000, 360px); +$ion-scale-025: var(--ion-scale-025, 1px); +$ion-scale-050: var(--ion-scale-050, 2px); +$ion-scale-075: var(--ion-scale-075, 3px); +$ion-space-0: var(--ion-space-0, 0px); +$ion-space-100: var(--ion-space-100, 4px); +$ion-space-150: var(--ion-space-150, 6px); +$ion-space-200: var(--ion-space-200, 8px); +$ion-space-250: var(--ion-space-250, 10px); +$ion-space-300: var(--ion-space-300, 12px); +$ion-space-400: var(--ion-space-400, 16px); +$ion-space-500: var(--ion-space-500, 20px); +$ion-space-600: var(--ion-space-600, 24px); +$ion-space-700: var(--ion-space-700, 28px); +$ion-space-800: var(--ion-space-800, 32px); +$ion-space-900: var(--ion-space-900, 36px); +$ion-space-1000: var(--ion-space-1000, 40px); +$ion-space-1200: var(--ion-space-1200, 48px); +$ion-space-050: var(--ion-space-050, 2px); +$ion-z-index-0: var(--ion-z-index-0, 0px); +$ion-z-index-100: var(--ion-z-index-100, 100px); +$ion-z-index-200: var(--ion-z-index-200, 200px); +$ion-z-index-300: var(--ion-z-index-300, 300px); +$ion-z-index-400: var(--ion-z-index-400, 400px); +$ion-z-index-500: var(--ion-z-index-500, 500px); +$ion-z-index-bottom: var(--ion-z-index-bottom, -99999px); +$ion-z-index-top: var(--ion-z-index-top, 99999px); +$ion-transition-curve-linear: var(--ion-transition-curve-linear, linear); +$ion-transition-curve-quick: var(--ion-transition-curve-quick, cubic-bezier(0, 0, 0.2, 1)); +$ion-transition-curve-base: var(--ion-transition-curve-base, cubic-bezier(0.4, 0, 1, 1)); +$ion-transition-curve-expressive: var(--ion-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1)); +$ion-transition-curve-bounce: var(--ion-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38)); +$ion-transition-time-0: var(--ion-transition-time-0, 0); +$ion-transition-time-100: var(--ion-transition-time-100, 100); +$ion-transition-time-150: var(--ion-transition-time-150, 150); +$ion-transition-time-200: var(--ion-transition-time-200, 200); +$ion-transition-time-300: var(--ion-transition-time-300, 300); +$ion-transition-time-500: var(--ion-transition-time-500, 500); +$ion-transition-time-1000: var(--ion-transition-time-1000, 1000); +$ion-transition-time-1500: var(--ion-transition-time-1500, 1500); +$ion-font-family: var(--ion-font-family, "Inter", sans-serif); +$ion-font-weight-thin: var(--ion-font-weight-thin, 100); +$ion-font-weight-extra-light: var(--ion-font-weight-extra-light, 200); +$ion-font-weight-light: var(--ion-font-weight-light, 300); +$ion-font-weight-regular: var(--ion-font-weight-regular, 400); +$ion-font-weight-medium: var(--ion-font-weight-medium, 500); +$ion-font-weight-semi-bold: var(--ion-font-weight-semi-bold, 600); +$ion-font-weight-bold: var(--ion-font-weight-bold, 700); +$ion-font-weight-extra-bold: var(--ion-font-weight-extra-bold, 800); +$ion-font-weight-black: var(--ion-font-weight-black, 900); +$ion-font-size-275: var(--ion-font-size-275, font.px-to-rem(11)); +$ion-font-size-300: var(--ion-font-size-300, font.px-to-rem(12)); +$ion-font-size-350: var(--ion-font-size-350, font.px-to-rem(14)); +$ion-font-size-400: var(--ion-font-size-400, font.px-to-rem(16)); +$ion-font-size-450: var(--ion-font-size-450, font.px-to-rem(18)); +$ion-font-size-500: var(--ion-font-size-500, font.px-to-rem(20)); +$ion-font-size-550: var(--ion-font-size-550, font.px-to-rem(22)); +$ion-font-size-600: var(--ion-font-size-600, font.px-to-rem(24)); +$ion-font-size-650: var(--ion-font-size-650, font.px-to-rem(26)); +$ion-font-size-700: var(--ion-font-size-700, font.px-to-rem(28)); +$ion-font-size-800: var(--ion-font-size-800, font.px-to-rem(32)); +$ion-font-size-900: var(--ion-font-size-900, font.px-to-rem(36)); +$ion-font-letter-spacing-0: var(--ion-font-letter-spacing-0, 0%); +$ion-font-letter-spacing-1: var(--ion-font-letter-spacing-1, 1%); +$ion-font-letter-spacing-2: var(--ion-font-letter-spacing-2, 1.5%); +$ion-font-line-height-300: var(--ion-font-line-height-300, 12px); +$ion-font-line-height-400: var(--ion-font-line-height-400, 16px); +$ion-font-line-height-500: var(--ion-font-line-height-500, 20px); +$ion-font-line-height-600: var(--ion-font-line-height-600, 24px); +$ion-font-line-height-700: var(--ion-font-line-height-700, 28px); +$ion-font-line-height-800: var(--ion-font-line-height-800, 32px); +$ion-font-line-height-900: var(--ion-font-line-height-900, 36px); +$ion-font-line-height-1100: var(--ion-font-line-height-1100, 44px); +$ion-font-line-height-1200: var(--ion-font-line-height-1200, 48px); +$ion-font-line-height-full: var(--ion-font-line-height-full, 100%); +$ion-rectangular-2xs: var(--ion-rectangular-2xs, 0px); +$ion-rectangular-xs: var(--ion-rectangular-xs, 0px); +$ion-rectangular-sm: var(--ion-rectangular-sm, 0px); +$ion-rectangular-md: var(--ion-rectangular-md, 0px); +$ion-rectangular-lg: var(--ion-rectangular-lg, 0px); +$ion-rectangular-xl: var(--ion-rectangular-xl, 0px); +$ion-rectangular-2xl: var(--ion-rectangular-2xl, 0px); +$ion-round-2xs: var(--ion-round-2xs, 999px); +$ion-round-xs: var(--ion-round-xs, 999px); +$ion-round-sm: var(--ion-round-sm, 999px); +$ion-round-md: var(--ion-round-md, 999px); +$ion-round-lg: var(--ion-round-lg, 12px); +$ion-round-xl: var(--ion-round-xl, 16px); +$ion-round-2xl: var(--ion-round-2xl, 40px); +$ion-soft-2xs: var(--ion-soft-2xs, 4px); +$ion-soft-xs: var(--ion-soft-xs, 8px); +$ion-soft-sm: var(--ion-soft-sm, 12px); +$ion-soft-md: var(--ion-soft-md, 16px); +$ion-soft-lg: var(--ion-soft-lg, 8px); +$ion-soft-xl: var(--ion-soft-xl, 8px); +$ion-soft-2xl: var(--ion-soft-2xl, 16px); -$ionic-display-sm-regular: ( - font-size: $ionic-font-size-800, +$ion-display-sm-regular: ( + font-size: $ion-font-size-800, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-1100, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-1100, text-transform: none, text-decoration: none, ); -$ionic-display-sm-light: ( - font-size: $ionic-font-size-800, +$ion-display-sm-light: ( + font-size: $ion-font-size-800, font-style: normal, - font-weight: $ionic-font-weight-light, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-1100, + font-weight: $ion-font-weight-light, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-1100, text-transform: none, text-decoration: none, ); -$ionic-display-lg-regular: ( - font-size: $ionic-font-size-900, +$ion-display-lg-regular: ( + font-size: $ion-font-size-900, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-1200, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-1200, text-transform: none, text-decoration: none, ); -$ionic-display-lg-light: ( - font-size: $ionic-font-size-900, +$ion-display-lg-light: ( + font-size: $ion-font-size-900, font-style: normal, - font-weight: $ionic-font-weight-light, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-1200, + font-weight: $ion-font-weight-light, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-1200, text-transform: none, text-decoration: none, ); -$ionic-heading-h1-regular: ( - font-size: $ionic-font-size-700, +$ion-heading-h1-regular: ( + font-size: $ion-font-size-700, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h1-medium: ( - font-size: $ionic-font-size-700, +$ion-heading-h1-medium: ( + font-size: $ion-font-size-700, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h1-semi-bold: ( - font-size: $ionic-font-size-600, +$ion-heading-h1-semi-bold: ( + font-size: $ion-font-size-700, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h1-bold: ( - font-size: $ionic-font-size-700, +$ion-heading-h1-bold: ( + font-size: $ion-font-size-700, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h2-regular: ( - font-size: $ionic-font-size-650, +$ion-heading-h2-regular: ( + font-size: $ion-font-size-650, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h2-medium: ( - font-size: $ionic-font-size-650, +$ion-heading-h2-medium: ( + font-size: $ion-font-size-650, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h2-semi-bold: ( - font-size: $ionic-font-size-650, +$ion-heading-h2-semi-bold: ( + font-size: $ion-font-size-650, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h2-bold: ( - font-size: $ionic-font-size-650, +$ion-heading-h2-bold: ( + font-size: $ion-font-size-650, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-900, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-900, text-transform: none, text-decoration: none, ); -$ionic-heading-h3-regular: ( - font-size: $ionic-font-size-600, +$ion-heading-h3-regular: ( + font-size: $ion-font-size-600, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-800, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-800, text-transform: none, text-decoration: none, ); -$ionic-heading-h3-medium: ( - font-size: $ionic-font-size-600, +$ion-heading-h3-medium: ( + font-size: $ion-font-size-600, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-800, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-800, text-transform: none, text-decoration: none, ); -$ionic-heading-h3-semi-bold: ( - font-size: $ionic-font-size-600, +$ion-heading-h3-semi-bold: ( + font-size: $ion-font-size-600, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-800, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-800, text-transform: none, text-decoration: none, ); -$ionic-heading-h3-bold: ( - font-size: $ionic-font-size-600, +$ion-heading-h3-bold: ( + font-size: $ion-font-size-600, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-800, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-800, text-transform: none, text-decoration: none, ); -$ionic-heading-h4-regular: ( - font-size: $ionic-font-size-550, +$ion-heading-h4-regular: ( + font-size: $ion-font-size-550, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h4-medium: ( - font-size: $ionic-font-size-550, +$ion-heading-h4-medium: ( + font-size: $ion-font-size-550, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h4-semi-bold: ( - font-size: $ionic-font-size-550, +$ion-heading-h4-semi-bold: ( + font-size: $ion-font-size-550, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h4-bold: ( - font-size: $ionic-font-size-550, +$ion-heading-h4-bold: ( + font-size: $ion-font-size-550, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h5-regular: ( - font-size: $ionic-font-size-500, +$ion-heading-h5-regular: ( + font-size: $ion-font-size-500, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h5-medium: ( - font-size: $ionic-font-size-500, +$ion-heading-h5-medium: ( + font-size: $ion-font-size-500, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h5-semi-bold: ( - font-size: $ionic-font-size-500, +$ion-heading-h5-semi-bold: ( + font-size: $ion-font-size-500, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h5-bold: ( - font-size: $ionic-font-size-500, +$ion-heading-h5-bold: ( + font-size: $ion-font-size-500, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h6-regular: ( - font-size: $ionic-font-size-450, +$ion-heading-h6-regular: ( + font-size: $ion-font-size-450, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h6-medium: ( - font-size: $ionic-font-size-450, +$ion-heading-h6-medium: ( + font-size: $ion-font-size-450, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h6-semi-bold: ( - font-size: $ionic-font-size-450, +$ion-heading-h6-semi-bold: ( + font-size: $ion-font-size-450, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-heading-h6-bold: ( - font-size: $ionic-font-size-450, +$ion-heading-h6-bold: ( + font-size: $ion-font-size-450, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-700, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-700, text-transform: none, text-decoration: none, ); -$ionic-body-lg-regular: ( - font-size: $ionic-font-size-400, +$ion-body-action-xl: ( + font-size: $ion-font-size-500, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-1, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-lg-medium: ( - font-size: $ionic-font-size-400, +$ion-body-action-lg: ( + font-size: $ion-font-size-400, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-1, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-lg-semi-bold: ( - font-size: $ionic-font-size-400, +$ion-body-action-md: ( + font-size: $ion-font-size-350, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-1, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-body-lg-bold: ( - font-size: $ionic-font-size-400, +$ion-body-action-sm: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-1, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-body-lg-link: ( - font-size: $ionic-font-size-400, +$ion-body-lg-regular: ( + font-size: $ion-font-size-400, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, - text-transform: none, - text-decoration: underline, -); - -$ionic-body-lg-italic: ( - font-size: $ionic-font-size-400, - font-style: italic, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-md-regular: ( - font-size: $ionic-font-size-350, +$ion-body-lg-medium: ( + font-size: $ion-font-size-400, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-md-medium: ( - font-size: $ionic-font-size-350, +$ion-body-lg-semi-bold: ( + font-size: $ion-font-size-400, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-md-semi-bold: ( - font-size: $ionic-font-size-350, +$ion-body-lg-bold: ( + font-size: $ion-font-size-400, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-md-bold: ( - font-size: $ionic-font-size-350, +$ion-body-md-regular: ( + font-size: $ion-font-size-350, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-md-link: ( - font-size: $ionic-font-size-350, +$ion-body-md-medium: ( + font-size: $ion-font-size-350, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, - text-transform: none, - text-decoration: underline, -); - -$ionic-body-md-italic: ( - font-size: $ionic-font-size-350, - font-style: italic, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-sm-regular: ( - font-size: $ionic-font-size-300, +$ion-body-md-semi-bold: ( + font-size: $ion-font-size-350, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-sm-medium: ( - font-size: $ionic-font-size-300, +$ion-body-md-bold: ( + font-size: $ion-font-size-350, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-600, text-transform: none, text-decoration: none, ); -$ionic-body-sm-semi-bold: ( - font-size: $ionic-font-size-300, +$ion-body-sm-regular: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-body-sm-bold: ( - font-size: $ionic-font-size-300, +$ion-body-sm-medium: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-body-sm-link: ( - font-size: $ionic-font-size-300, +$ion-body-sm-semi-bold: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, - text-transform: none, - text-decoration: underline, -); - -$ionic-body-sm-italic: ( - font-size: $ionic-font-size-300, - font-style: italic, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-0, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-action-xl: ( - font-size: $ionic-font-size-500, +$ion-body-sm-bold: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-1, - line-height: $ionic-line-height-600, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-0, + line-height: $ion-font-line-height-500, text-transform: none, text-decoration: none, ); -$ionic-action-lg: ( - font-size: $ionic-font-size-400, +$ion-overline-regular: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-1, - line-height: $ionic-line-height-600, - text-transform: none, - text-decoration: none, -); - -$ionic-action-md: ( - font-size: $ionic-font-size-350, - font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-1, - line-height: $ionic-line-height-500, - text-transform: none, - text-decoration: none, -); - -$ionic-action-sm: ( - font-size: $ionic-font-size-300, - font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-1, - line-height: $ionic-line-height-500, - text-transform: none, - text-decoration: none, -); - -$ionic-overline-regular: ( - font-size: $ionic-font-size-300, - font-style: normal, - font-weight: $ionic-font-weight-regular, - letter-spacing: $ionic-letter-spacing-2, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-regular, + letter-spacing: $ion-font-letter-spacing-2, + line-height: $ion-font-line-height-500, text-transform: uppercase, text-decoration: none, ); -$ionic-overline-medium: ( - font-size: $ionic-font-size-300, +$ion-overline-medium: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-medium, - letter-spacing: $ionic-letter-spacing-2, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-medium, + letter-spacing: $ion-font-letter-spacing-2, + line-height: $ion-font-line-height-500, text-transform: uppercase, text-decoration: none, ); -$ionic-overline-semi-bold: ( - font-size: $ionic-font-size-300, +$ion-overline-semi-bold: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-semi-bold, - letter-spacing: $ionic-letter-spacing-2, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-semi-bold, + letter-spacing: $ion-font-letter-spacing-2, + line-height: $ion-font-line-height-500, text-transform: uppercase, text-decoration: none, ); -$ionic-overline-bold: ( - font-size: $ionic-font-size-300, +$ion-overline-bold: ( + font-size: $ion-font-size-300, font-style: normal, - font-weight: $ionic-font-weight-bold, - letter-spacing: $ionic-letter-spacing-2, - line-height: $ionic-line-height-500, + font-weight: $ion-font-weight-bold, + letter-spacing: $ion-font-letter-spacing-2, + line-height: $ion-font-line-height-500, text-transform: uppercase, text-decoration: none, ); diff --git a/core/src/foundations/tokens.preview.html b/core/src/foundations/tokens.preview.html deleted file mode 100644 index acaf82b1b3..0000000000 --- a/core/src/foundations/tokens.preview.html +++ /dev/null @@ -1,1749 +0,0 @@ - - - - - - Design Tokens - - - - - - - - - - Design Tokens - Preview - - - -

Color Tokens

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ColorHexToken Name
#ffffff-color-base-white
#111111-color-base-black
#f1f1f1-color-neutral-100
#e7e7e7-color-neutral-200
#cfcfcf-color-neutral-300
#b9b9b9-color-neutral-400
#a2a2a2-color-neutral-500
#8c8c8c-color-neutral-600
#777777-color-neutral-700
#626262-color-neutral-800
#4e4e4e-color-neutral-900
#3b3b3b-color-neutral-1000
#292929-color-neutral-1100
#242424-color-neutral-1200
#feeded-color-red-100
#fde1e1-color-red-200
#fcc1c1-color-red-300
#faa1a1-color-red-400
#f97d7d-color-red-500
#f85151-color-red-600
#e52929-color-red-700
#bf2222-color-red-800
#991b1b-color-red-900
#761515-color-red-1000
#540f0f-color-red-1100
#330909-color-red-1200
#feedea-color-pumpkin-100
#fde0db-color-pumpkin-200
#fbbdb1-color-pumpkin-300
#f9947c-color-pumpkin-400
#f75d07-color-pumpkin-500
#da5206-color-pumpkin-600
#bd4705-color-pumpkin-700
#9f3c05-color-pumpkin-800
#803004-color-pumpkin-900
#602403-color-pumpkin-1000
#401802-color-pumpkin-1100
#210c01-color-pumpkin-1200
#fff1ea-color-orange-100
#ffe8db-color-orange-200
#ffcfb1-color-orange-300
#ffb37b-color-orange-400
#ff9400-color-orange-500
#e18300-color-orange-600
#c37100-color-orange-700
#a45f00-color-orange-800
#844d00-color-orange-900
#633a00-color-orange-1000
#422700-color-orange-1100
#221400-color-orange-1200
#fff9ea-color-yellow-100
#fff5db-color-yellow-200
#ffebb1-color-yellow-300
#ffe07b-color-yellow-400
#ffd600-color-yellow-500
#e1bd00-color-yellow-600
#c3a400-color-yellow-700
#a48a00-color-yellow-800
#846f00-color-yellow-900
#635300-color-yellow-1000
#423800-color-yellow-1100
#221d00-color-yellow-1200
#f3faea-color-lime-100
#eaf7db-color-lime-200
#d3efb2-color-lime-300
#bbe77d-color-lime-400
#a0df18-color-lime-500
#8dc515-color-lime-600
#7aab12-color-lime-700
#678f0f-color-lime-800
#53730c-color-lime-900
#3e5709-color-lime-1000
#2a3a06-color-lime-1100
#151e03-color-lime-1200
#ebf9ec-color-green-100
#dcf5de-color-green-200
#b3ebb7-color-green-300
#7fe089-color-green-400
#23d643-color-green-500
#1fbd3b-color-green-600
#1ba433-color-green-700
#178a2b-color-green-800
#126f23-color-green-900
#0e531a-color-green-1000
#093811-color-green-1100
#051d09-color-green-1200
#eaf8f5-color-teal-100
#dbf3ee-color-teal-200
#b1e7dd-color-teal-300
#7bdbca-color-teal-400
#00cfb7-color-teal-500
#00b7a2-color-teal-600
#009e8c-color-teal-700
#008576-color-teal-800
#006b5f-color-teal-900
#005147-color-teal-1000
#003630-color-teal-1100
#001c19-color-teal-1200
#ebf9fe-color-aqua-100
#dcf4fd-color-aqua-200
#b3e9fc-color-aqua-300
#80defa-color-aqua-400
#27d3f9-color-aqua-500
#22bbdc-color-aqua-600
#1ea2bf-color-aqua-700
#1988a0-color-aqua-800
#146d81-color-aqua-900
#0f5261-color-aqua-1000
#0a3741-color-aqua-1100
#051c21-color-aqua-1200
#f2f4fd-color-blue-100
#e9ecfc-color-blue-200
#d0d7fa-color-blue-300
#b5c0f7-color-blue-400
#94a5f4-color-blue-500
#6986f2-color-blue-600
#105cef-color-blue-700
#0f54da-color-blue-800
#0d4bc3-color-blue-900
#0b41a9-color-blue-1000
#09358a-color-blue-1100
#072561-color-blue-1200
#f3f2fb-color-indigo-100
#eae9f9-color-indigo-200
#d3d1f2-color-indigo-300
#bab5eb-color-indigo-400
#9d95e4-color-indigo-500
#786bdd-color-indigo-600
#411bd5-color-indigo-700
#3b19c3-color-indigo-800
#3516ae-color-indigo-900
#2e1397-color-indigo-1000
#26107b-color-indigo-1100
#1a0b57-color-indigo-1200
#f5f2fe-color-violet-100
#eee9fd-color-violet-200
#dcd1fb-color-violet-300
#c9b6f9-color-violet-400
#b396f6-color-violet-500
#9a6cf4-color-violet-600
#7c20f2-color-violet-700
#711ddd-color-violet-800
#651ac5-color-violet-900
#5817ab-color-violet-1000
#48128c-color-violet-1100
#330d63-color-violet-1200
#f9f3fe-color-purple-100
#f5eafd-color-purple-200
#e9d3fa-color-purple-300
#deb9f8-color-purple-400
#d29bf6-color-purple-500
#c575f3-color-purple-600
#b73cf1-color-purple-700
#a737dc-color-purple-800
#9531c5-color-purple-900
#812aaa-color-purple-1000
#6a238b-color-purple-1100
#4b1862-color-purple-1200
#fdf3fb-color-magenta-100
#fcebf8-color-magenta-200
#f9d4f1-color-magenta-300
#f6bcea-color-magenta-400
#f39fe3-color-magenta-500
#f07cdb-color-magenta-600
#ed4ad3-color-magenta-700
#d844c1-color-magenta-800
#c13cac-color-magenta-900
#a83495-color-magenta-1000
#892b7a-color-magenta-1100
#611e56-color-magenta-1200
#fef3f5-color-pink-100
#fdeaee-color-pink-200
#fad3dc-color-pink-300
#f8b9c9-color-pink-400
#f69bb3-color-pink-500
#f3759a-color-pink-600
#f13b7d-color-pink-700
#dc3672-color-pink-800
#c53066-color-pink-900
#aa2a58-color-pink-1000
#8b2248-color-pink-1100
#621833-color-pink-1200
#f2f4fd-color-primary-100
#e9ecfc-color-primary-200
#d0d7fa-color-primary-300
#b5c0f7-color-primary-400
#94a5f4-color-primary-500
#6986f2-color-primary-600
#105cef-color-primary-700
#0f54da-color-primary-800
#0d4bc3-color-primary-900
#0b41a9-color-primary-1000
#09358a-color-primary-1100
#072561-color-primary-1200
#105cef-color-primary-base
#ebf9fe-color-info-100
#dcf4fd-color-info-200
#b3e9fc-color-info-300
#80defa-color-info-400
#27d3f9-color-info-500
#22bbdc-color-info-600
#1ea2bf-color-info-700
#1988a0-color-info-800
#146d81-color-info-900
#0f5261-color-info-1000
#0a3741-color-info-1100
#051c21-color-info-1200
#1ea2bf-color-info-base
#fff1ea-color-warning-100
#ffe8db-color-warning-200
#ffcfb1-color-warning-300
#ffb37b-color-warning-400
#ff9400-color-warning-500
#e18300-color-warning-600
#c37100-color-warning-700
#a45f00-color-warning-800
#844d00-color-warning-900
#633a00-color-warning-1000
#422700-color-warning-1100
#221400-color-warning-1200
#c37100-color-warning-base
#feeded-color-danger-100
#fde1e1-color-danger-200
#fcc1c1-color-danger-300
#faa1a1-color-danger-400
#f97d7d-color-danger-500
#f85151-color-danger-600
#e52929-color-danger-700
#bf2222-color-danger-800
#991b1b-color-danger-900
#761515-color-danger-1000
#540f0f-color-danger-1100
#330909-color-danger-1200
#e52929-color-danger-base
#ebf9ec-color-success-100
#dcf5de-color-success-200
#b3ebb7-color-success-300
#7fe089-color-success-400
#23d643-color-success-500
#1fbd3b-color-success-600
#1ba433-color-success-700
#178a2b-color-success-800
#126f23-color-success-900
#0e531a-color-success-1000
#093811-color-success-1100
#051d09-color-success-1200
#1ba433-color-success-base
-
-
-

Font Size Tokens

-
-
-font-size-275 (11px)
- -
-font-size-300 (12px)
- -
-font-size-350 (14px)
- -
-font-size-400 (16px)
- -
-font-size-450 (18px)
- -
-font-size-500 (20px)
- -
-font-size-550 (22px)
- -
-font-size-600 (24px)
- -
-font-size-650 (26px)
- -
-font-size-700 (28px)
- -
-font-size-800 (32px)
- -
-font-size-900 (36px)
-
-
-

Font Weight Tokens

-
-
-font-weight-thin (100)
- -
-font-weight-extra-light (200)
- -
-font-weight-light (300)
- -
-font-weight-regular (400)
- -
-font-weight-medium (500)
- -
-font-weight-semi-bold (600)
- -
-font-weight-bold (700)
- -
-font-weight-extra-bold (800)
- -
-font-weight-black (900)
-
-
-

Letter Spacing Tokens

-
-
-letter-spacing-0 (0px)
- -
-letter-spacing-1 (1px)
- -
-letter-spacing-2 (1.5px)
-
-
-

Box Shadow Tokens

-
-
- -elevation-100 -
- -
- -elevation-200 -
- -
- -elevation-300 -
- -
- -elevation-400 -
- -
- -elevation-500 -
- -
- -elevation-600 -
- -
- -elevation-700 -
- -
- -elevation-800 -
-
-
-

Border Size Tokens

-
-
-border-size-0 (0px)
- -
-border-size-025 (1px)
- -
-border-size-050 (2px)
- -
-border-size-075 (3px)
-
-
-

Border Radius Tokens

-
-
-border-radius-0 (0px)
- -
-border-radius-050 (2px)
- -
-border-radius-100 (4px)
- -
-border-radius-200 (8px)
- -
-border-radius-300 (12px)
- -
-border-radius-400 (16px)
- -
-border-radius-500 (20px)
- -
-border-radius-800 (32px)
- -
-border-radius-1000 (40px)
- -
-border-radius-full (999px)
-
-
-

Border Style Tokens

-
-
-border-style-none (none)
- -
-border-style-solid (solid)
- -
-border-style-dashed (dashed)
- -
-border-style-dotted (dotted)
-
-
-

Space Tokens

-
-
-
-space-0 (0px)
-
- -
-
-space-050 (2px)
-
- -
-
-space-100 (4px)
-
- -
-
-space-150 (6px)
-
- -
-
-space-200 (8px)
-
- -
-
-space-250 (10px)
-
- -
-
-space-300 (12px)
-
- -
-
-space-400 (16px)
-
- -
-
-space-500 (20px)
-
- -
-
-space-600 (24px)
-
- -
-
-space-700 (28px)
-
- -
-
-space-800 (32px)
-
- -
-
-space-850 (34px)
-
- -
-
-space-900 (36px)
-
- -
-
-space-1000 (40px)
-
- -
-
-space-1200 (48px)
-
-
- - - - diff --git a/core/src/foundations/tokens/README.md b/core/src/foundations/tokens/README.md deleted file mode 100644 index 12df47e1af..0000000000 --- a/core/src/foundations/tokens/README.md +++ /dev/null @@ -1,5 +0,0 @@ -# Design Tokens JSON Files - -Please, do not directly change the JSON files on this token folder. They should come from the UX/UI Team (from Figma or any used source). - -Any changes done here should be validated with UX/UI and Framework teams. diff --git a/core/src/foundations/tokens/effect.styles.tokens.json b/core/src/foundations/tokens/effect.styles.tokens.json deleted file mode 100644 index c6ffbb39b9..0000000000 --- a/core/src/foundations/tokens/effect.styles.tokens.json +++ /dev/null @@ -1,154 +0,0 @@ -{ - "Elevation-100": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "3px", - "blur": "9px", - "spread": "0px", - "color": "#00000012" - }, - { - "offsetX": "0px", - "offsetY": "0px", - "blur": "4px", - "spread": "0px", - "color": "#0000000a" - } - ] - }, - "Elevation-200": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "8px", - "blur": "25px", - "spread": "0px", - "color": "#00000014" - }, - { - "offsetX": "0px", - "offsetY": "1px", - "blur": "5px", - "spread": "0px", - "color": "#0000000d" - } - ] - }, - "Elevation-300": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "6px", - "blur": "32px", - "spread": "0px", - "color": "#00000029" - }, - { - "offsetX": "0px", - "offsetY": "2px", - "blur": "7px", - "spread": "0px", - "color": "#0000000d" - } - ] - }, - "Elevation-400": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "15px", - "blur": "48px", - "spread": "0px", - "color": "#0000002e" - }, - { - "offsetX": "0px", - "offsetY": "3px", - "blur": "12px", - "spread": "0px", - "color": "#0000001f" - } - ] - }, - "Elevation-500": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "3px", - "blur": "9px", - "spread": "0px", - "color": "#062b6312" - }, - { - "offsetX": "0px", - "offsetY": "0px", - "blur": "4px", - "spread": "0px", - "color": "#062b630a" - } - ] - }, - "Elevation-600": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "8px", - "blur": "25px", - "spread": "0px", - "color": "#062b6314" - }, - { - "offsetX": "0px", - "offsetY": "1px", - "blur": "5px", - "spread": "0px", - "color": "#062b630d" - } - ] - }, - "Elevation-700": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "15px", - "blur": "32px", - "spread": "0px", - "color": "#062b6317" - }, - { - "offsetX": "0px", - "offsetY": "2px", - "blur": "7px", - "spread": "0px", - "color": "#062b630d" - } - ] - }, - "Elevation-800": { - "$type": "shadow", - "$value": [ - { - "offsetX": "0px", - "offsetY": "20px", - "blur": "48px", - "spread": "0px", - "color": "#062b631f" - }, - { - "offsetX": "0px", - "offsetY": "3px", - "blur": "14px", - "spread": "0px", - "color": "#062b631f" - } - ] - } -} \ No newline at end of file diff --git a/core/src/foundations/tokens/manifest.json b/core/src/foundations/tokens/manifest.json deleted file mode 100644 index 4c38474aba..0000000000 --- a/core/src/foundations/tokens/manifest.json +++ /dev/null @@ -1,30 +0,0 @@ -{ - "name": "Design Tokens", - "collections": { - "Primitives": { - "modes": { - "Value": [ - "Primitives.Value.tokens.json" - ] - } - }, - "Theme": { - "modes": { - "Ionic": [ - "Theme.Ionic.tokens.json" - ] - } - } - }, - "styles": { - "text": [ - "text.styles.tokens.json" - ], - "effect": [ - "effect.styles.tokens.json" - ], - "color": [ - "color.styles.tokens.json" - ] - } -} \ No newline at end of file diff --git a/core/src/foundations/tokens/primitives.value.tokens.json b/core/src/foundations/tokens/primitives.value.tokens.json deleted file mode 100644 index cd84c6b927..0000000000 --- a/core/src/foundations/tokens/primitives.value.tokens.json +++ /dev/null @@ -1,1220 +0,0 @@ -{ - "font-size": { - "275": { - "$type": "dimension", - "$value": "11px" - }, - "300": { - "$type": "dimension", - "$value": "12px" - }, - "350": { - "$type": "dimension", - "$value": "14px" - }, - "400": { - "$type": "dimension", - "$value": "16px" - }, - "450": { - "$type": "dimension", - "$value": "18px" - }, - "500": { - "$type": "dimension", - "$value": "20px" - }, - "550": { - "$type": "dimension", - "$value": "22px" - }, - "600": { - "$type": "dimension", - "$value": "24px" - }, - "650": { - "$type": "dimension", - "$value": "26px" - }, - "700": { - "$type": "dimension", - "$value": "28px" - }, - "800": { - "$type": "dimension", - "$value": "32px" - }, - "900": { - "$type": "dimension", - "$value": "36px" - } - }, - "font-weight": { - "thin": { - "$type": "dimension", - "$value": "100" - }, - "extra-light": { - "$type": "dimension", - "$value": "200" - }, - "light": { - "$type": "dimension", - "$value": "300" - }, - "regular": { - "$type": "dimension", - "$value": "400" - }, - "medium": { - "$type": "dimension", - "$value": "500" - }, - "semi-bold": { - "$type": "dimension", - "$value": "600" - }, - "bold": { - "$type": "dimension", - "$value": "700" - }, - "extra-bold": { - "$type": "dimension", - "$value": "800" - }, - "black": { - "$type": "dimension", - "$value": "900" - } - }, - "letter-spacing": { - "0": { - "$type": "string", - "$value": "0" - }, - "1": { - "$type": "string", - "$value": "1%" - }, - "2": { - "$type": "string", - "$value": "1.5%" - } - }, - "line-height": { - "300": { - "$type": "dimension", - "$value": "{scale.300}" - }, - "400": { - "$type": "dimension", - "$value": "{scale.400}" - }, - "500": { - "$type": "dimension", - "$value": "{scale.500}" - }, - "600": { - "$type": "dimension", - "$value": "{scale.600}" - }, - "700": { - "$type": "dimension", - "$value": "{scale.700}" - }, - "800": { - "$type": "dimension", - "$value": "{scale.800}" - }, - "900": { - "$type": "dimension", - "$value": "{scale.900}" - }, - "1100": { - "$type": "dimension", - "$value": "{scale.1100}" - }, - "1200": { - "$type": "dimension", - "$value": "{scale.1200}" - }, - "full": { - "$type": "string", - "$value": "100%" - } - }, - "space": { - "0": { - "$type": "dimension", - "$value": "{scale.0}" - }, - "100": { - "$type": "dimension", - "$value": "{scale.100}" - }, - "150": { - "$type": "dimension", - "$value": "{scale.150}" - }, - "200": { - "$type": "dimension", - "$value": "{scale.200}" - }, - "250": { - "$type": "dimension", - "$value": "{scale.250}" - }, - "300": { - "$type": "dimension", - "$value": "{scale.300}" - }, - "400": { - "$type": "dimension", - "$value": "{scale.400}" - }, - "500": { - "$type": "dimension", - "$value": "{scale.500}" - }, - "600": { - "$type": "dimension", - "$value": "{scale.600}" - }, - "700": { - "$type": "dimension", - "$value": "{scale.700}" - }, - "800": { - "$type": "dimension", - "$value": "{scale.800}" - }, - "850": { - "$type": "dimension", - "$value": "{scale.850}" - }, - "900": { - "$type": "dimension", - "$value": "{scale.900}" - }, - "1000": { - "$type": "dimension", - "$value": "{scale.1000}" - }, - "1200": { - "$type": "dimension", - "$value": "{scale.1200}" - }, - "050": { - "$type": "dimension", - "$value": "{scale.050}" - } - }, - "border-radius": { - "0": { - "$type": "dimension", - "$value": "{scale.0}" - }, - "100": { - "$type": "dimension", - "$value": "{scale.100}" - }, - "200": { - "$type": "dimension", - "$value": "{scale.200}" - }, - "300": { - "$type": "dimension", - "$value": "{scale.300}" - }, - "400": { - "$type": "dimension", - "$value": "{scale.400}" - }, - "500": { - "$type": "dimension", - "$value": "{scale.500}" - }, - "800": { - "$type": "dimension", - "$value": "{scale.800}" - }, - "1000": { - "$type": "dimension", - "$value": "{scale.1000}" - }, - "050": { - "$type": "dimension", - "$value": "{scale.050}" - }, - "full": { - "$type": "dimension", - "$value": "999px" - } - }, - "border-size": { - "0": { - "$type": "dimension", - "$value": "{scale.0}" - }, - "025": { - "$type": "dimension", - "$value": "{scale.025}" - }, - "050": { - "$type": "dimension", - "$value": "{scale.050}" - }, - "075": { - "$type": "dimension", - "$value": "{scale.075}" - } - }, - "border-style": { - "none": { - "$type": "string", - "$value": "none" - }, - "solid": { - "$type": "string", - "$value": "solid" - }, - "dashed": { - "$type": "string", - "$value": "dashed" - }, - "dotted": { - "$type": "string", - "$value": "dotted" - } - }, - "color": { - "base": { - "white": { - "$type": "color", - "$value": "#ffffff" - }, - "black": { - "$type": "color", - "$value": "#111111" - } - }, - "neutral": { - "100": { - "$type": "color", - "$value": "#f1f1f1" - }, - "200": { - "$type": "color", - "$value": "#e7e7e7" - }, - "300": { - "$type": "color", - "$value": "#cfcfcf" - }, - "400": { - "$type": "color", - "$value": "#b9b9b9" - }, - "500": { - "$type": "color", - "$value": "#a2a2a2" - }, - "600": { - "$type": "color", - "$value": "#8c8c8c" - }, - "700": { - "$type": "color", - "$value": "#777777" - }, - "800": { - "$type": "color", - "$value": "#626262" - }, - "900": { - "$type": "color", - "$value": "#4e4e4e" - }, - "1000": { - "$type": "color", - "$value": "#3b3b3b" - }, - "1100": { - "$type": "color", - "$value": "#292929" - }, - "1200": { - "$type": "color", - "$value": "#242424" - } - }, - "red": { - "100": { - "$type": "color", - "$value": "#feeded" - }, - "200": { - "$type": "color", - "$value": "#fde1e1" - }, - "300": { - "$type": "color", - "$value": "#fcc1c1" - }, - "400": { - "$type": "color", - "$value": "#faa1a1" - }, - "500": { - "$type": "color", - "$value": "#f97d7d" - }, - "600": { - "$type": "color", - "$value": "#f85151" - }, - "700": { - "$type": "color", - "$value": "#e52929" - }, - "800": { - "$type": "color", - "$value": "#bf2222" - }, - "900": { - "$type": "color", - "$value": "#991b1b" - }, - "1000": { - "$type": "color", - "$value": "#761515" - }, - "1100": { - "$type": "color", - "$value": "#540f0f" - }, - "1200": { - "$type": "color", - "$value": "#330909" - } - }, - "pumpkin": { - "100": { - "$type": "color", - "$value": "#feedea" - }, - "200": { - "$type": "color", - "$value": "#fde0db" - }, - "300": { - "$type": "color", - "$value": "#fbbdb1" - }, - "400": { - "$type": "color", - "$value": "#f9947c" - }, - "500": { - "$type": "color", - "$value": "#f75d07" - }, - "600": { - "$type": "color", - "$value": "#da5206" - }, - "700": { - "$type": "color", - "$value": "#bd4705" - }, - "800": { - "$type": "color", - "$value": "#9f3c05" - }, - "900": { - "$type": "color", - "$value": "#803004" - }, - "1000": { - "$type": "color", - "$value": "#602403" - }, - "1100": { - "$type": "color", - "$value": "#401802" - }, - "1200": { - "$type": "color", - "$value": "#210c01" - } - }, - "orange": { - "100": { - "$type": "color", - "$value": "#fff1ea" - }, - "200": { - "$type": "color", - "$value": "#ffe8db" - }, - "300": { - "$type": "color", - "$value": "#ffcfb1" - }, - "400": { - "$type": "color", - "$value": "#ffb37b" - }, - "500": { - "$type": "color", - "$value": "#ff9400" - }, - "600": { - "$type": "color", - "$value": "#e18300" - }, - "700": { - "$type": "color", - "$value": "#c37100" - }, - "800": { - "$type": "color", - "$value": "#a45f00" - }, - "900": { - "$type": "color", - "$value": "#844d00" - }, - "1000": { - "$type": "color", - "$value": "#633a00" - }, - "1100": { - "$type": "color", - "$value": "#422700" - }, - "1200": { - "$type": "color", - "$value": "#221400" - } - }, - "yellow": { - "100": { - "$type": "color", - "$value": "#fff9ea" - }, - "200": { - "$type": "color", - "$value": "#fff5db" - }, - "300": { - "$type": "color", - "$value": "#ffebb1" - }, - "400": { - "$type": "color", - "$value": "#ffe07b" - }, - "500": { - "$type": "color", - "$value": "#ffd600" - }, - "600": { - "$type": "color", - "$value": "#e1bd00" - }, - "700": { - "$type": "color", - "$value": "#c3a400" - }, - "800": { - "$type": "color", - "$value": "#a48a00" - }, - "900": { - "$type": "color", - "$value": "#846f00" - }, - "1000": { - "$type": "color", - "$value": "#635300" - }, - "1100": { - "$type": "color", - "$value": "#423800" - }, - "1200": { - "$type": "color", - "$value": "#221d00" - } - }, - "lime": { - "100": { - "$type": "color", - "$value": "#f3faea" - }, - "200": { - "$type": "color", - "$value": "#eaf7db" - }, - "300": { - "$type": "color", - "$value": "#d3efb2" - }, - "400": { - "$type": "color", - "$value": "#bbe77d" - }, - "500": { - "$type": "color", - "$value": "#a0df18" - }, - "600": { - "$type": "color", - "$value": "#8dc515" - }, - "700": { - "$type": "color", - "$value": "#7aab12" - }, - "800": { - "$type": "color", - "$value": "#678f0f" - }, - "900": { - "$type": "color", - "$value": "#53730c" - }, - "1000": { - "$type": "color", - "$value": "#3e5709" - }, - "1100": { - "$type": "color", - "$value": "#2a3a06" - }, - "1200": { - "$type": "color", - "$value": "#151e03" - } - }, - "green": { - "100": { - "$type": "color", - "$value": "#ebf9ec" - }, - "200": { - "$type": "color", - "$value": "#dcf5de" - }, - "300": { - "$type": "color", - "$value": "#b3ebb7" - }, - "400": { - "$type": "color", - "$value": "#7fe089" - }, - "500": { - "$type": "color", - "$value": "#23d643" - }, - "600": { - "$type": "color", - "$value": "#1fbd3b" - }, - "700": { - "$type": "color", - "$value": "#1ba433" - }, - "800": { - "$type": "color", - "$value": "#178a2b" - }, - "900": { - "$type": "color", - "$value": "#126f23" - }, - "1000": { - "$type": "color", - "$value": "#0e531a" - }, - "1100": { - "$type": "color", - "$value": "#093811" - }, - "1200": { - "$type": "color", - "$value": "#051d09" - } - }, - "teal": { - "100": { - "$type": "color", - "$value": "#eaf8f5" - }, - "200": { - "$type": "color", - "$value": "#dbf3ee" - }, - "300": { - "$type": "color", - "$value": "#b1e7dd" - }, - "400": { - "$type": "color", - "$value": "#7bdbca" - }, - "500": { - "$type": "color", - "$value": "#00cfb7" - }, - "600": { - "$type": "color", - "$value": "#00b7a2" - }, - "700": { - "$type": "color", - "$value": "#009e8c" - }, - "800": { - "$type": "color", - "$value": "#008576" - }, - "900": { - "$type": "color", - "$value": "#006b5f" - }, - "1000": { - "$type": "color", - "$value": "#005147" - }, - "1100": { - "$type": "color", - "$value": "#003630" - }, - "1200": { - "$type": "color", - "$value": "#001c19" - } - }, - "aqua": { - "100": { - "$type": "color", - "$value": "#ebf9fe" - }, - "200": { - "$type": "color", - "$value": "#dcf4fd" - }, - "300": { - "$type": "color", - "$value": "#b3e9fc" - }, - "400": { - "$type": "color", - "$value": "#80defa" - }, - "500": { - "$type": "color", - "$value": "#27d3f9" - }, - "600": { - "$type": "color", - "$value": "#22bbdc" - }, - "700": { - "$type": "color", - "$value": "#1ea2bf" - }, - "800": { - "$type": "color", - "$value": "#1988a0" - }, - "900": { - "$type": "color", - "$value": "#146d81" - }, - "1000": { - "$type": "color", - "$value": "#0f5261" - }, - "1100": { - "$type": "color", - "$value": "#0a3741" - }, - "1200": { - "$type": "color", - "$value": "#051c21" - } - }, - "blue": { - "100": { - "$type": "color", - "$value": "#f2f4fd" - }, - "200": { - "$type": "color", - "$value": "#e9ecfc" - }, - "300": { - "$type": "color", - "$value": "#d0d7fa" - }, - "400": { - "$type": "color", - "$value": "#b5c0f7" - }, - "500": { - "$type": "color", - "$value": "#94a5f4" - }, - "600": { - "$type": "color", - "$value": "#6986f2" - }, - "700": { - "$type": "color", - "$value": "#105cef" - }, - "800": { - "$type": "color", - "$value": "#0f54da" - }, - "900": { - "$type": "color", - "$value": "#0d4bc3" - }, - "1000": { - "$type": "color", - "$value": "#0b41a9" - }, - "1100": { - "$type": "color", - "$value": "#09358a" - }, - "1200": { - "$type": "color", - "$value": "#072561" - } - }, - "indigo": { - "100": { - "$type": "color", - "$value": "#f3f2fb" - }, - "200": { - "$type": "color", - "$value": "#eae9f9" - }, - "300": { - "$type": "color", - "$value": "#d3d1f2" - }, - "400": { - "$type": "color", - "$value": "#bab5eb" - }, - "500": { - "$type": "color", - "$value": "#9d95e4" - }, - "600": { - "$type": "color", - "$value": "#786bdd" - }, - "700": { - "$type": "color", - "$value": "#411bd5" - }, - "800": { - "$type": "color", - "$value": "#3b19c3" - }, - "900": { - "$type": "color", - "$value": "#3516ae" - }, - "1000": { - "$type": "color", - "$value": "#2e1397" - }, - "1100": { - "$type": "color", - "$value": "#26107b" - }, - "1200": { - "$type": "color", - "$value": "#1a0b57" - } - }, - "violet": { - "100": { - "$type": "color", - "$value": "#f5f2fe" - }, - "200": { - "$type": "color", - "$value": "#eee9fd" - }, - "300": { - "$type": "color", - "$value": "#dcd1fb" - }, - "400": { - "$type": "color", - "$value": "#c9b6f9" - }, - "500": { - "$type": "color", - "$value": "#b396f6" - }, - "600": { - "$type": "color", - "$value": "#9a6cf4" - }, - "700": { - "$type": "color", - "$value": "#7c20f2" - }, - "800": { - "$type": "color", - "$value": "#711ddd" - }, - "900": { - "$type": "color", - "$value": "#651ac5" - }, - "1000": { - "$type": "color", - "$value": "#5817ab" - }, - "1100": { - "$type": "color", - "$value": "#48128c" - }, - "1200": { - "$type": "color", - "$value": "#330d63" - } - }, - "purple": { - "100": { - "$type": "color", - "$value": "#f9f3fe" - }, - "200": { - "$type": "color", - "$value": "#f5eafd" - }, - "300": { - "$type": "color", - "$value": "#e9d3fa" - }, - "400": { - "$type": "color", - "$value": "#deb9f8" - }, - "500": { - "$type": "color", - "$value": "#d29bf6" - }, - "600": { - "$type": "color", - "$value": "#c575f3" - }, - "700": { - "$type": "color", - "$value": "#b73cf1" - }, - "800": { - "$type": "color", - "$value": "#a737dc" - }, - "900": { - "$type": "color", - "$value": "#9531c5" - }, - "1000": { - "$type": "color", - "$value": "#812aaa" - }, - "1100": { - "$type": "color", - "$value": "#6a238b" - }, - "1200": { - "$type": "color", - "$value": "#4b1862" - } - }, - "magenta": { - "100": { - "$type": "color", - "$value": "#fdf3fb" - }, - "200": { - "$type": "color", - "$value": "#fcebf8" - }, - "300": { - "$type": "color", - "$value": "#f9d4f1" - }, - "400": { - "$type": "color", - "$value": "#f6bcea" - }, - "500": { - "$type": "color", - "$value": "#f39fe3" - }, - "600": { - "$type": "color", - "$value": "#f07cdb" - }, - "700": { - "$type": "color", - "$value": "#ed4ad3" - }, - "800": { - "$type": "color", - "$value": "#d844c1" - }, - "900": { - "$type": "color", - "$value": "#c13cac" - }, - "1000": { - "$type": "color", - "$value": "#a83495" - }, - "1100": { - "$type": "color", - "$value": "#892b7a" - }, - "1200": { - "$type": "color", - "$value": "#611e56" - } - }, - "pink": { - "100": { - "$type": "color", - "$value": "#fef3f5" - }, - "200": { - "$type": "color", - "$value": "#fdeaee" - }, - "300": { - "$type": "color", - "$value": "#fad3dc" - }, - "400": { - "$type": "color", - "$value": "#f8b9c9" - }, - "500": { - "$type": "color", - "$value": "#f69bb3" - }, - "600": { - "$type": "color", - "$value": "#f3759a" - }, - "700": { - "$type": "color", - "$value": "#f13b7d" - }, - "800": { - "$type": "color", - "$value": "#dc3672" - }, - "900": { - "$type": "color", - "$value": "#c53066" - }, - "1000": { - "$type": "color", - "$value": "#aa2a58" - }, - "1100": { - "$type": "color", - "$value": "#8b2248" - }, - "1200": { - "$type": "color", - "$value": "#621833" - } - } - }, - "z-index": { - "0": { - "$type": "dimension", - "$value": "0" - }, - "1": { - "$type": "dimension", - "$value": "100" - }, - "2": { - "$type": "dimension", - "$value": "200" - }, - "3": { - "$type": "dimension", - "$value": "300" - }, - "4": { - "$type": "dimension", - "$value": "400" - }, - "500": { - "$type": "dimension", - "$value": "500" - }, - "bottom": { - "$type": "dimension", - "$value": "-99999" - }, - "top": { - "$type": "dimension", - "$value": "99999" - } - }, - "scale": { - "0": { - "$type": "dimension", - "$value": "0px" - }, - "100": { - "$type": "dimension", - "$value": "4px" - }, - "150": { - "$type": "dimension", - "$value": "6px" - }, - "200": { - "$type": "dimension", - "$value": "8px" - }, - "250": { - "$type": "dimension", - "$value": "10px" - }, - "300": { - "$type": "dimension", - "$value": "12px" - }, - "400": { - "$type": "dimension", - "$value": "16px" - }, - "500": { - "$type": "dimension", - "$value": "20px" - }, - "600": { - "$type": "dimension", - "$value": "24px" - }, - "700": { - "$type": "dimension", - "$value": "28px" - }, - "800": { - "$type": "dimension", - "$value": "32px" - }, - "850": { - "$type": "dimension", - "$value": "34px" - }, - "900": { - "$type": "dimension", - "$value": "36px" - }, - "1000": { - "$type": "dimension", - "$value": "40px" - }, - "1100": { - "$type": "dimension", - "$value": "44px" - }, - "1200": { - "$type": "dimension", - "$value": "48px" - }, - "1400": { - "$type": "dimension", - "$value": "56px" - }, - "1600": { - "$type": "dimension", - "$value": "64px" - }, - "1800": { - "$type": "dimension", - "$value": "72px" - }, - "2000": { - "$type": "dimension", - "$value": "80px" - }, - "2400": { - "$type": "dimension", - "$value": "96px" - }, - "2800": { - "$type": "dimension", - "$value": "112px" - }, - "3200": { - "$type": "dimension", - "$value": "128px" - }, - "3400": { - "$type": "dimension", - "$value": "136px" - }, - "3600": { - "$type": "dimension", - "$value": "144px" - }, - "4000": { - "$type": "dimension", - "$value": "160px" - }, - "5000": { - "$type": "dimension", - "$value": "200px" - }, - "6200": { - "$type": "dimension", - "$value": "248px" - }, - "7400": { - "$type": "dimension", - "$value": "296px" - }, - "9000": { - "$type": "dimension", - "$value": "360px" - }, - "025": { - "$type": "dimension", - "$value": "1px" - }, - "050": { - "$type": "dimension", - "$value": "2px" - }, - "075": { - "$type": "dimension", - "$value": "3px" - } - } -} diff --git a/core/src/foundations/tokens/text.styles.tokens.json b/core/src/foundations/tokens/text.styles.tokens.json deleted file mode 100644 index 38d18ffeb1..0000000000 --- a/core/src/foundations/tokens/text.styles.tokens.json +++ /dev/null @@ -1,682 +0,0 @@ -{ - "display": { - "sm": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.800}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.1100}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "light": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.800}", - "fontWeight": 300, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.1100}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "lg": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.900}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.1200}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "light": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.900}", - "fontWeight": 300, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.1200}", - "textTransform": "none", - "textDecoration": "none" - } - } - } - }, - "heading": { - "h1": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.700}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.700}", - "fontWeight": 500, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.600}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.700}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "h2": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.650}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.650}", - "fontWeight": 500, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.650}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.650}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.900}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "h3": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.600}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.800}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.600}", - "fontWeight": 500, - "letterSpacing": "0%", - "lineHeight": "{line-height.800}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.600}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{line-height.800}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.600}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.800}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "h4": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.550}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.550}", - "fontWeight": 500, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.550}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.550}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "h5": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.500}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.500}", - "fontWeight": 500, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.500}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.500}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "h6": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.450}", - "fontWeight": 400, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.450}", - "fontWeight": 500, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.450}", - "fontWeight": 600, - "letterSpacing": "0%", - "lineHeight": "{font-size.700}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.450}", - "fontWeight": 700, - "letterSpacing": "0%", - "lineHeight": "{line-height.700}", - "textTransform": "none", - "textDecoration": "none" - } - } - } - }, - "body": { - "lg": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 500, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 600, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 700, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "link": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "underline" - } - }, - "italic": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "md": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 500, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 600, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 700, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "link": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "underline" - } - }, - "italic": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "sm": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "12px", - "fontWeight": 500, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 600, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 700, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "link": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "underline" - } - }, - "italic": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 400, - "letterSpacing": "{letter-spacing.0}", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - } - } - }, - "action": { - "xl": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.500}", - "fontWeight": 500, - "letterSpacing": "1%", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "lg": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.400}", - "fontWeight": 500, - "letterSpacing": "1%", - "lineHeight": "{line-height.600}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "md": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.350}", - "fontWeight": 500, - "letterSpacing": "1%", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - }, - "sm": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 500, - "letterSpacing": "1%", - "lineHeight": "{line-height.500}", - "textTransform": "none", - "textDecoration": "none" - } - } - }, - "overline": { - "regular": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 400, - "letterSpacing": "1.5%", - "lineHeight": "{line-height.500}", - "textTransform": "uppercase", - "textDecoration": "none" - } - }, - "medium": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 500, - "letterSpacing": "1.5%", - "lineHeight": "{line-height.500}", - "textTransform": "uppercase", - "textDecoration": "none" - } - }, - "semi bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 600, - "letterSpacing": "1.5%", - "lineHeight": "{line-height.500}", - "textTransform": "uppercase", - "textDecoration": "none" - } - }, - "bold": { - "$type": "typography", - "$value": { - "fontFamily": "{font-family.Inter}", - "fontSize": "{font-size.300}", - "fontWeight": 700, - "letterSpacing": "1.5%", - "lineHeight": "{line-height.500}", - "textTransform": "uppercase", - "textDecoration": "none" - } - } - } -} diff --git a/core/src/foundations/tokens/theme/theme.ionic.tokens.json b/core/src/foundations/tokens/theme/theme.ionic.tokens.json deleted file mode 100644 index 404144ec34..0000000000 --- a/core/src/foundations/tokens/theme/theme.ionic.tokens.json +++ /dev/null @@ -1,308 +0,0 @@ -{ - "font-family": { - "Inter": { - "$type": "string", - "$value": "Inter" - } - }, - "color": { - "primary": { - "100": { - "$type": "color", - "$value": "{color.blue.100}" - }, - "200": { - "$type": "color", - "$value": "{color.blue.200}" - }, - "300": { - "$type": "color", - "$value": "{color.blue.300}" - }, - "400": { - "$type": "color", - "$value": "{color.blue.400}" - }, - "500": { - "$type": "color", - "$value": "{color.blue.500}" - }, - "600": { - "$type": "color", - "$value": "{color.blue.600}" - }, - "700": { - "$type": "color", - "$value": "{color.blue.700}" - }, - "800": { - "$type": "color", - "$value": "{color.blue.800}" - }, - "900": { - "$type": "color", - "$value": "{color.blue.900}" - }, - "1000": { - "$type": "color", - "$value": "{color.blue.1000}" - }, - "1100": { - "$type": "color", - "$value": "{color.blue.1100}" - }, - "1200": { - "$type": "color", - "$value": "{color.blue.1200}" - }, - "base": { - "$type": "color", - "$value": "{color.primary.700}" - } - }, - "info": { - "100": { - "$type": "color", - "$value": "{color.aqua.100}" - }, - "200": { - "$type": "color", - "$value": "{color.aqua.200}" - }, - "300": { - "$type": "color", - "$value": "{color.aqua.300}" - }, - "400": { - "$type": "color", - "$value": "{color.aqua.400}" - }, - "500": { - "$type": "color", - "$value": "{color.aqua.500}" - }, - "600": { - "$type": "color", - "$value": "{color.aqua.600}" - }, - "700": { - "$type": "color", - "$value": "{color.aqua.700}" - }, - "800": { - "$type": "color", - "$value": "{color.aqua.800}" - }, - "900": { - "$type": "color", - "$value": "{color.aqua.900}" - }, - "1000": { - "$type": "color", - "$value": "{color.aqua.1000}" - }, - "1100": { - "$type": "color", - "$value": "{color.aqua.1100}" - }, - "1200": { - "$type": "color", - "$value": "{color.aqua.1200}" - }, - "base": { - "$type": "color", - "$value": "{color.info.700}" - } - }, - "warning": { - "100": { - "$type": "color", - "$value": "{color.orange.100}" - }, - "200": { - "$type": "color", - "$value": "{color.orange.200}" - }, - "300": { - "$type": "color", - "$value": "{color.orange.300}" - }, - "400": { - "$type": "color", - "$value": "{color.orange.400}" - }, - "500": { - "$type": "color", - "$value": "{color.orange.500}" - }, - "600": { - "$type": "color", - "$value": "{color.orange.600}" - }, - "700": { - "$type": "color", - "$value": "{color.orange.700}" - }, - "800": { - "$type": "color", - "$value": "{color.orange.800}" - }, - "900": { - "$type": "color", - "$value": "{color.orange.900}" - }, - "1000": { - "$type": "color", - "$value": "{color.orange.1000}" - }, - "1100": { - "$type": "color", - "$value": "{color.orange.1100}" - }, - "1200": { - "$type": "color", - "$value": "{color.orange.1200}" - }, - "base": { - "$type": "color", - "$value": "{color.orange.700}" - } - }, - "danger": { - "100": { - "$type": "color", - "$value": "{color.red.100}" - }, - "200": { - "$type": "color", - "$value": "{color.red.200}" - }, - "300": { - "$type": "color", - "$value": "{color.red.300}" - }, - "400": { - "$type": "color", - "$value": "{color.red.400}" - }, - "500": { - "$type": "color", - "$value": "{color.red.500}" - }, - "600": { - "$type": "color", - "$value": "{color.red.600}" - }, - "700": { - "$type": "color", - "$value": "{color.red.700}" - }, - "800": { - "$type": "color", - "$value": "{color.red.800}" - }, - "900": { - "$type": "color", - "$value": "{color.red.900}" - }, - "1000": { - "$type": "color", - "$value": "{color.red.1000}" - }, - "1100": { - "$type": "color", - "$value": "{color.red.1100}" - }, - "1200": { - "$type": "color", - "$value": "{color.red.1200}" - }, - "base": { - "$type": "color", - "$value": "{color.danger.700}" - } - }, - "success": { - "100": { - "$type": "color", - "$value": "{color.green.100}" - }, - "200": { - "$type": "color", - "$value": "{color.green.200}" - }, - "300": { - "$type": "color", - "$value": "{color.green.300}" - }, - "400": { - "$type": "color", - "$value": "{color.green.400}" - }, - "500": { - "$type": "color", - "$value": "{color.green.500}" - }, - "600": { - "$type": "color", - "$value": "{color.green.600}" - }, - "700": { - "$type": "color", - "$value": "{color.green.700}" - }, - "800": { - "$type": "color", - "$value": "{color.green.800}" - }, - "900": { - "$type": "color", - "$value": "{color.green.900}" - }, - "1000": { - "$type": "color", - "$value": "{color.green.1000}" - }, - "1100": { - "$type": "color", - "$value": "{color.green.1100}" - }, - "1200": { - "$type": "color", - "$value": "{color.green.1200}" - }, - "base": { - "$type": "color", - "$value": "{color.success.700}" - } - } - }, - "state": { - "focus": { - "0": { - "$type": "string", - "$value": "none" - }, - "1": { - "$type": "color", - "$value": "#9ec4fd" - }, - "2": { - "$type": "color", - "$value": "#ffafaf" - } - }, - "disabled": { - "$type": "color", - "$value": "#ffffff99" - }, - "hover": { - "$type": "color", - "$value": "#2424240a" - }, - "pressed": { - "$type": "color", - "$value": "#24242414" - } - } -} diff --git a/core/src/themes/ionic/ionic.mixins.scss b/core/src/themes/ionic/ionic.mixins.scss index 4b6d05c39f..596d0e1087 100644 --- a/core/src/themes/ionic/ionic.mixins.scss +++ b/core/src/themes/ionic/ionic.mixins.scss @@ -17,7 +17,7 @@ position: absolute; - background-color: tokens.$ionic-state-pressed; + background-color: tokens.$ion-state-press; content: ""; } @@ -34,7 +34,7 @@ position: absolute; - background-color: tokens.$ionic-state-disabled; + background-color: tokens.$ion-state-disabled; content: ""; @@ -50,9 +50,9 @@ // -------------------------------------------------- @mixin focused-state($width: null, $style: null, $color: null, $addOffset: true) { // Use default values if null is passed - $width: if($width != null, $width, tokens.$ionic-border-size-050); - $style: if($style != null, $style, tokens.$ionic-border-style-solid); - $color: if($color != null, $color, tokens.$ionic-state-focus-1); + $width: if($width != null, $width, tokens.$ion-border-size-050); + $style: if($style != null, $style, tokens.$ion-border-style-solid); + $color: if($color != null, $color, tokens.$ion-border-focus-default); @if $addOffset { outline-offset: $width; @@ -63,7 +63,7 @@ // Typography mixin to be used with typography scss variables (ionic.vars.scss) // -// ex: @include typography($ionic-heading-h3-medium); +// ex: @include typography($ion-heading-h3-medium); // // -------------------------------------------------- @mixin typography($properties) {